これからWebデザインを学びたいけれど、何から手をつけていいのかわからない！ この記事はそんな悩みを抱えるWebデザイン入門者の方のために書いています。
スクールに通うのか、テキストで学ぶのがいいのか？また、学習を続けられるかな？と不安があったり、費用も気になるところですよね。そんな時はまず、手軽に始められる無料のサービスを利用してみてはいかがでしょうか？
実はWebデザインが学べる無料のサービスがインターネットには沢山あるのです！無料とはいえ、わかりやすい動画講義や、隙間時間を活用できるような工夫がされているなどクオリティも十分。気になったサイトはどんどん覗いてみてくださいね。
Webサイトについて、見た目の美しさ、情報のわかりやすさ、使いやすさを設計、構築するのがWebデザインと呼ばれるものです。
Webデザインに取り組むためには、幅広い領域の知識が必要となります。たとえば、「デザインや色彩の知識」「掲載する画像を編集するための画像ソフトの知識」「HTMLやCSS、Javascriptなどのプログラミング知識」などです。
会員登録が必要となりますがコードキャンプの有料スクール講座並みの体験を無料で体験することができます。CodePenを教科書に埋め込まれているため、初学習者が躓きやすい開発環境がない方でも教科書上でコードを書いて実行することができます。
日々最新の技術やコミュニケーションスキルから社会問題まで、幅の広いスキルアップのための動画講座を放送しているschoo。
Webデザインについても、HTML,CSS,Photoshop,illustratorの各入門講座は無料公開されています。
特徴は現役スペシャリストばかりを揃えた講師陣。
スライドを元に、1〜2時間じっくりと授業を聞く形式です。HTML講座は全3時間、illustrator講座は全6時間と、無料でスクールなみのボリュームの講義が受けらるのはお得です。学習時間をしっかり確保できる方にオススメです。
中級や応用にあたる講座、また過去の生放送授業の録画は月額料金(¥980〜)の有料プランに加入すると閲覧できるようになっており、もうワンステップ進んだ学習がしたい場合にも対応しています。
おもに入門者向けの無料講座を307講座も公開しているドットインストールは、3分にコンパクトにまとまった学習動画で、スキマ時間に学習を進めていける便利なサイト。こまぎれ時間しか取れない忙しい方にもオススメです。
ユーザー登録すると、ちゃんと自分がどこまで進んでいるかも管理できちゃいます。
入門者向け講座としておすすめなのは、はじめてのWeb制作や詳解HTML 基本タグ編と詳解CSS 基礎文法編ですね。
これらをマスターしたら、 実践！ポートフォリオサイトを作ろう で、自分で1からポートフォリオを作ってみましょう。
スライドを見ながら、実際のプログラムをブラウザ上で書ける手軽さが魅力のprogate。
まずは環境を整えることが難しい初心者には、すぐに学習を始められるという利点があります。
初級コースは全て無料で公開されていますが、有料の実践コースをクリアした方には、クラウドワークスでのお仕事紹介の提携があります。
いまから、Webデザインやプログラミングで、手に職をつける！という目標が欲しい方に、オススメです。
CODEPREPは、プログラミングが楽しい！と誰もが思えるように、というコンセプトで作られた学習サイトです。
穴埋め式のプログラム練習画面で、プログラムの醍醐味である、「手を動かしながら試してみる」が味わえるので飽きずにテンポよく学習が進められます。
講座内で他のユーザーに質問ができる機能もあり、励まし合い、助け合いながら進められますよ。
デザインや画像処理は好きだけれど、HTMLなどのプログラミングに苦手意識のある方にオススメです。
オンラインの企画、デザイン、プログラミング、クラウド、マーケティングのスクールSkillhub(スキルハブ）。
基本的には有料のサイトですが、HTML,CSS,illustratorの入門講座は無料公開されています。(Photoshop講座、JavaScript講座は有料プランです)
無料とはいえ、スライドを使っての講師の解説が動画で閲覧できます。Webサイト制作実践講座は、illustratorで画像を作成し、HTMLでコーディング、作成したサイトをWebサーバーに公開するまでの、Webデザインの仕事の一連の流れが学習できます。知識ゼロからWebデザインの概要全体を知りたいという方にオススメします。
学べる知識：Photoshop,illustrator
PhotoshopやillustratorなどのAdobe製品の基本的な使い方は、公式サイトのチュートリアルで、とても詳しく解説されています。ひとまず、基本の使い方をマスターしたい方はぜひ読んでみてください。
とくに、画像編集のソフトを使い始めたばかりの方は「レイヤー」や「ベクター」などの特徴的な考え方にまず戸惑うことが多いと思います。
チュートリアルではその概念から、親切な動画で説明してくれていますよ。ひとまずソフトの操作方法を身につけたい方にオススメです。
10年前に作られたWebサイトはやはり今見ると古いなという印象を受けますよね。
そう、Webデザインにも流行があるのです。素敵なWebデザインを目指すなら、流行感度をあげていかなくてはいけません。
そんな時に便利なサイトがこの PHOTOSHOP VIP です。
Webデザイン関連の最新ニュースやデザインテクニックについて、また国内外の流行デザインについての記事が日々更新されています。眺めているだけでセンスがアップしますよ！
日本のWebサイトの流行を知りたいなら、こちらをブックマークしておきましょう。
日本企業やサービスのWebサイトに特化した、優れたデザインのサイトを集めたリンク集です。
眺めて目を肥やすもよし、業種ごとの傾向を探るもよし。
いち早く話題のデザインに詳しくなりたい方に、オススメです。
プロのWebデザイナーであるMana氏が日々デザインのコツや流行のデザインについての解説などを綴っているブログです。
最新技術の解説やセンスよく見せるための小技は上級者でも役に立ちますし、初心者向けの記事も充実しています。
プロはWebデザインのこういったところに気をつけているのか、ということを知ることができるので、入門者からのステップアップにも役に立つブログです。
特におすすめしたいのは、Web制作の流れを、ひと通りやさしく解説してくれているこちらの記事実践で学ぶWebサイト制作ガイド。
すこし昔の記事ですが、Web制作を俯瞰したい方にとても役立つ記事です。ぜひ読んでみてください
Webデザインはいろいろな知識が必要ですが、その分どこから手をつけても自分の力になっていくという楽しさがあります。
最近は、プログラミングがブラウザで体験できる学習サイトも増え、プログラムを体験するためのハードルも下がってきていますよ。
もっと学びたい、もっと知りたい！と思ったときが始めどきです。
ぜひ、昨日より一歩進んだ自分になってみてくださいね。
Codecampではご自宅で受講できるオンラインで朝7時～23時と幅広い時間でビデオ通話形式でワンツーマンレッスンを受講することができます。
まずは、Webデザインのスクールを受講する前に、無料カウンセリングで勉強法や将来設計についてのアドバイスや不明点を質面してみるとより具体的な将来像が固まります。
コードキャンプの講師はベテラン現役エンジニアなので、まずはこの機会にぜひご活用ください。
体験カウンセリングについて詳しくはこちら ※受講するだけで1万円が安くなるキャンペーン実施中です。
