Webデザインの仕事は、初心者からでも比較的スムーズに仕事として成り立ちやすい職種である。
また実践を積んでいけば、フリーランスとして独立したり、Webプロデューサーとしてステップアップしていくこともできる、将来性のある仕事でもある。
この記事では、未経験者がWebデザイナーを目指すために必要な「デザイン・ソフト・プログラミング言語」を解説する。
Webデザイナーに必要なデザインの知識
Webデザイナーは、その名前の通りデザインの知識が必要だ。
デザインと言うと、見た目のオシャレさやカッコよさをイメージするかもしれない。もちろん目を引くデザイン・素敵と思ってもらうデザインも必要だ。
しかし、見た目だけ良くても、使い勝手の悪いWebサイトはすぐにユーザーは離れていく。
見た目だけでなく、誰もが使いやすいデザインになっているか（ユーザービリティ）も大事である。
また、クライアントの要望に応えるデザインを作成し、提案できるためのワイヤーフレーム（サイトの構成やデザインを整理した図）の作成など、Webデザイナーになるためのデザインの知識は幅広い。
デザインの知識を磨くためのポイント
Webデザインに関しては、流行の波が激しい。数年前に最先端だったサイトも、今見ると古臭い感じに見えるものも良くある。
例えば近年になっても、スマホ対応すらしていないサイトは、非常に見ずらく古臭く感じないだろうか。
Webデザインの知識を磨くためには、「良いデザイン」「新しいデザイン」「使いやすいデザイン」を常にチェックして、今何が求められているかに敏感になることが大切だ。
Webデザイナーを目指す人初心者の人で、良く「私はデザインセンスが無い」という悩みを聞く。
しかし、第一線で活躍するWebデザイナーに聞くと、必ず「デザインセンスは磨くものだ」という答えが返ってくる。
今センスが無いと感じていても、日ごろからアンテナを張って磨いていくことで、数年後には必ず身につくだろう。
デザインの知識を磨くポイント
- 良いと思うホームページのデザインを観察する
- 使い勝手が良いと思うホームページのデザインを観察する
- デザインに関する本を読む
- 現役のWebデザイナーに学ぶ
Webデザイン・必要なソフト・プログラミングは同時学習がおすすめ
「デザインセンスは磨くものだ」と前述したが、あくまでWebデザイナーとして仕事をしていく時の話で、未経験者であれば、基本的な部分は勉強して事前に身に付けておく必要がある。
また、Webデザインとともに、デザインを表現するためのソフト（illustrator・Photoshop）と、Webサイトとして表現するためのプログラミング言語（HTML/CSS/JavaScript）はセットで学習するのが効率的だ。
次に、Webデザイナーになるための必要なソフトの知識と、プログラミング言語を順に紹介していく。
Webデザイナーに必要なソフトの知識
Webデザイナーを目指す場合、Webデザインを作成したり、画像やバナー広告を作成するために、画像加工や編集が出来るソフトが必要だ。
無料のソフトもあるが、Webデザイナーとして仕事をしていくのであれば、illustrator（イラストレーター）とPhotoshop（フォトショップ）はマスターしたい。
どちらも、Adobe（アドビ）社が提供する、Creative Cloud（クリエイティブ クラウド）というサービスの中のソフトだ。
Webデザイナーとして活躍している人のほぼ全てが、この2つのソフトを使いこなしている。いわゆる業界標準と言えるソフトだ。
illustrator（イラストレーター）
illustratorは「ロゴ作成、イラスト作成、地図作成、図解作成、ポスター作成」などに使用されるソフト。
Windowsに付属している「ペイント」が、はるかに高スペックになったソフトと言えばイメージしやすいだろう。
プロのデザイナーやイラストレーターが愛用しているソフトだ。
Webデザイナーの仕事でも、ロゴ作成やバナー広告作成などに多用されている。
Photoshop（フォトショップ）
Photoshopは、画像編集に特化したソフトだ。写真加工では世界一有名なソフトである。
また、グラフィック加工やCG等の作成にも使われる。
使い方次第では、イラスト加工や図解作成、ポスターやプレゼン資料など、用途に応じて幅広く使えるツールでもある。
illustratorとPhotoshop、どちらがおすすめ？
Webデザイナーを目指す人に「illustratorとPhotoshop、どちらが必要（おすすめ）？」と聞かれることがある。
もちろん、どちらも使いこなせるに越したことは無い。
しかしソフト自体も高額であるし、2つ使いこなせるまでは学習に時間がかかるので、悩む気持ちもわかる。
そこで、どちらか1つだけを選ぶとしたら、Photoshopをお勧めする。
illustratorには及ばないが、Photoshopでも使い方次第でイラスト加工や図解も出来るのでカバーできる部分が多い。
現役のWebデザイナーでも、ほぼPhotoshopだけしか使っていない人もいる。
ソフトの価格と安く購入する方法
illustratorとPhotoshopは有料で、比較的高額なソフトなので購入をためらう人も多い。
初心者は無料ソフトでやりくりしがちだが、Webデザイナーを本気で目指すのであれば、どの道避けては通れない必須のツールと言える。
ちなみに以前は、数十万円払ってソフトライセンスを購入していたが、現在は1ヶ月単位でライセンスを購入することが出来るので、初心者も使いやすくなった。
illustrator・Photoshopセットで月々5000円程度のライセンス料が必要。詳しい価格はコチラ（Adobe Creative Cloud公式サイト）
勉強している間は月単位でライセンスを購入して、就職して会社のライセンスが使用できるようになったら解約する、もOKだ。
学生割引（アカデミック価格）が安い
学生や教職員であれば、学生割引（アカデミック価格）があり、大幅に割引が聞くので、かなりお得だ。
| 通常価格 | 学生割引 | |
| コースの種類 | コンプリートプラン （一括払い） | コンプリートプラン （一括払い） |
| 1年間の 料金 | 59,760円（税別） | 23,760円（税別） |
アカデミック価格は、学校法人基づく教育機関に在籍している学生、教職員のみ
「自分は学生じゃないから・・・」と気落ちするのは早い。
一般の人であっても学生割引（アカデミック版）を購入する方法があるので、次に紹介していく。
一般の人が学生割引（アカデミック版）を購入する方法
illustratorとPhotoshop、ともに通常は一般価格で購入する必要があるが、例外がある。
それは、Adobe社が学生と認めるスクールに入会することだ。
スクールパートナーの「 ヒューマンアカデミーのソフトライセンス付きオンラインスクール 
」を受講した人は、特例として学生と認められ、割引価格でライセンスを購入することが出来る。
| ヒューマンアカデミー | |
| コースの種類 | オンライントレーニング講座 （1ヶ月受け放題） |
| 1年間の 料金 | 29,800円（税別） |
| サービス内容 | トレーニング講座の受講料 ＋ illustratorとPhotoshopの1年間ライセンス使用料 |
illustratorとPhotoshopが専門スクールで学べて、ラインセンス料を含めての値段なので、普通に購入するよりはるかにお得である。今から2つのソフトを勉強する人にとっては、まさに理想のスクールである。
すでにソフトの知識がある人にとっても、学割価格でライセンスが手に入ると考えるだけでも利用しないと損である。
ちなみにスクール入会者は、なんと2年目も学割価格で購入することが出来る。（3年目以降は正規の価格）
2年あれば、その期間で勉強してWebデザイナーとして就職するか、フリーランスとして独立して正規のライセンス料が払えるように稼ぐこともできるだろう。
今からWebデザインの勉強をする人にとっては、有難いサービスだ。
Webデザイナーに必要なプログラミング言語3つ
Webデザイナーであっても、Webサイト作成に使用される基本的なプログラミング言語の知識は必要である。
必ず必要な知識は「HTML」「CSS」である。この2つはセットと考えて、必ずマスターする必要がある。
さらに加えてJavaScript（ジャバスクリプト）までマスターすると、仕事の幅も広がるだろう。
HTML
Webページ作成のための言語で、これが基本となる。
「タグ」と呼ばれるコマンドを駆使して、Webページを作成していく。
Webページ作成ソフトを使うことで、作業量の短縮を図るわけだが、ソフトで修正できないような、細かいところは直接HTMLを修正する必要がある。
C言語のような一般的なプログラミング言語に比べると、感覚的で容易に理解することができる。
CSS
「スタイルシート」を作成するための言語である。
スタイルシートとはHTML内に記述した文字のフォントや位置、画像の配置からボーダーラインの設定まで、Webサイト全体のデザインを統一するために必要なものだ。
HTML内にCSSファイルを呼び出すコマンドを記述して使用する。HTMLより少しハードルが上がるが、CSSが使えないとデザインできない。
もちろんCSSの支援ソフトもあるが、基本的なプロパティは覚えておかなければならない。
JavaScript
Webブラウザ上で動作するスクリプト言語である。
動的なサイトを作成する際には必要で、しかも、こちらは一般的なプログラミング言語としても使え、Webプログラマーとしても必須の言語である。ジャバという名前が付いているが、「Java」とは似て非なる言語である。
言語的な制約も少なく、比較的容易に習得することができる。こちらも開発環境はエディターとブラウザがあればよいのでシンプルだ。PHPとの連携もできるのでWebデザイナーとしてまず学んでおきたい言語である。
無料学習サイトの紹介
「HTML/CSS/JavaScript」は比較的簡単なプログラミング言語なので、独学でも充分に習得可能な言語だ。
どれもニーズの多いプログラミングなので、学習教材も多く、ネットにも多くの情報が掲載されていて調べやすい。
例えば、オンラインプログラミングスクールの「 テックアカデミー
」のサービスの一つに、「 プログラミング無料体験
」がある。
無料で「HTML/CSS/JavaScript」の講座を受講することが出来て、講師のサポートも受けることが出来るので、今からプログラミングを勉強する人にはおすすめだ。
これからのWebデザイナーに求められるもの
Webデザイナーに必要なスキル等を一通り説明してきた。
もちろん、Webデザインセンスを磨くことは大事だが、Webデザイナーとして成長していくためには、Web全般に関わるつもりで、常に勉強して新しい情報を仕入れ、取り組む気持ちが大切だ。
Webプロデューサー的な役割も求められる
Webサイト全般を統括管理役割にWebプロデューサーがある。
Webプロデューサーには、Webページビューを増やすためのSEO対策や、Web広告の仕方、またネットマーケティングなどの知識、Webサイトに絡む全ての要素をプロデュースする能力が必要だ。
これからWebデザイナーとして成長していくときには、Webプロデューサーのような役割も求められることがあるだろう。
時代の方向性を読む力
Webサイトはこれからも変化するだろう。同じような仕事形態が続く保証はどこにもない。時代の変化に対応できるように、常に情報には敏感になる必要があるだろう。
SNS使った情報発信が主流の今、Webサイトの位置付けも変化している。新しいWebサイトの在り方を提案できるようにな力を蓄えておきたい。
Webデザイナーは、今後も需要が途切れることが無い、将来性のある職種だ。
一人前のWebデザイナーになるには、数年の期間が必要だが、将来フリーランスとして大きく稼ぐことも可能な職種である。
あなたが数年後、Webデザイナーとして第一線で活躍することを願っている。
-
未経験者がwebプログラマーになる方法【PG転職プロが解説】
web系のプログラマーは、プログラマーの中でも未経験者が比較的転職しやすい職種だ。 webは今後も発展していくことは間違いない。今プログラマーに転職を考えるなら、webプログラマーはオススメである。 ...
続きを見る
-
未経験からフリーランスエンジニアを目指すベストなステップ【講師が解説】
水瀬この記事は、フリープログラマーであり、プログラマー育成講師である筆者が記載しています。 プログラマーへの転職を目指す方で、将来フリーランスを希望する人も多い。 ちなみにプログラマー育成講師をしてい ...
続きを見る
