ELEMENT, INC.

初心者WEBデザイナーがスキルアップを図る方法といえば、デザインのトレースや、実際にコーディングなどして作品を作り上げる、本を読んで技術や知識を学び取るなどがあります。

そんな中から今回は、初心者がステージアップするために、これだけは押さえておきたいという基本ポイントがカバーされている本をご紹介します。

WEBデザイナーに必要なのはスキルとセンスと考える初心者も多いですが、センスとは膨大な知識と経験の中から最適解を導き出す力。書籍は、スキルに必要な知識だけでなく、センスに繋がる知識を増やしてくれます。

ここで紹介する書籍は、ここまでの知識レベルは得ておきたいというものを揃えていますので、ぜひ参考にしてください。

WEBデザイナーに必要なスキルとは

そもそもWEBデザイナーに必要なスキルとは何でしょうか？　WEBデザイナーは、カッコイイ・可愛い・おしゃれなデザインを作る人というだけではありません。そもそもの役割は「WEBサイトの見栄えや動作を設計する人」。

ですから、WEBデザイナーに求められるスキルをまとめると、次のポイントを挙げることができます。

・デザインツールの操作スキル
・配色や配置などの基本デザインスキル
・UI/UXのデザインスキル
・HTMLやCSS、JavaScriptなどのコーディングスキル

これらの力を総動員して、クライアントが求めるWEBサイトの見た目・動作・成果を出せる人が、実力あるWEBデザイナーです。

これらの力をつけるためには、どんな書籍がピッタリなのでしょうか？

デザインツールを使うときに参考になる本

WEBデザイナーにとってデザインツールは、仕事道具の一つ。ですから、思うとおりに使いこなせるようになるのが理想です。とはいえ、基本の使い方がわからなければ、手技を応用もできません。

そこで、参考にしたいのがこれらの本です。どちらも「世界一やさしく丁寧」と謳うだけあって、初心者が知りたいことを一つ一つ親切に解説してくれています。

Photoshop しっかり入門[CC/CS6/CS5] (しっかり入門シリーズ)

WEBデザイナー必携ともいえるAdobeのデザインツール「Photoshop」。基本操作がわかりやすく説明されていて、初心者がつまづいてしまいやすいポイントについても解説があり、理解を深めるのにぴったりの入門書といえます。

タイトルに「入門」とありながらも、やりこめば初級以上の力を身に付けられるようになっています。

Illustrator しっかり入門 [CC/CS6/CS5] (しっかり入門シリーズ)

こちらの「Illustrator」も、上記のPhotoshopと同様に、WEBデザイナーにとって必要不可欠なツールです。本書は、上記でご紹介した「Photoshopしっかり入門」の姉妹本。内容も、初心者向けに満遍なく基本のポイントが押さえられていて、つまずきやすいところもカバーされています。

Photoshopの入門書と同じく、1冊丸ごとやりこめばツールを使いこなせるような作りになっていますので、上記の書籍と揃えて持っておくといいでしょう。

デザイン力をつけたいときに参考になる本

WEBデザイナーのデザイン力の有無は、クライアントに依存するところもあります。そのため、Aのクライアントではデザイン力がないと見なされても、Bのクライアントでは絶賛されることもあります。そのような「デザイン力」という言葉は、その意味自体が広義で、人によって尺度も異なります。

そのため、何をもってデザイン力を図るのか、一概に言い切ることが難しいものです。しかし、天才と称されるデザイナーを除き、ほとんどのWEBデザイナーは自分自身の努力によって、デザイン力を上げていかねばなりません。

デザインの概念をどう捉えるのかによって、デザインの学び方も変わってきます。ですが、プロのWEBデザイナーとして活躍するのであれば、どんなクライアントにも応えられるデザイン力は身に付けて然るべき、というのは暗黙の理ではないでしょうか。

では、WEBデザイナーがデザイン力を上げるには、どんな書籍が参考になるのか、見ていきましょう。

ノンデザイナーズ・デザインブック [第4版]

おそらくWEBデザインを始めた人で、この本を知らないという人はいないでしょう。それほど、デザイナーにとって指南書のような書籍です。デザインの概念から、デザインを考えるうえで基本原則、デザインを見る目、考える意識そのものが養えるように構成されています。

「ノンデザイナーズ」という触れ込みになっていますが、WEBデザイナー初心者で、デザインの概念さえ知らなかった人は、一通り読むことをおすすめします。読みやすいデザインとは何か？　伝わりやすい・理解してもらいやすいレイアウトとはどのようなものか？　こういった点が、言語化されています。

WEBデザイナーの中には、自分の作ったデザインを言葉で説明することがあまり上手くない・自信がないという人も多いものです。そういった点でも、どのように説明すればいいのかを考えさせてくれます。

なるほどデザイン

上記の「ノンデザイナーズ・デザインブック」は、英訳本です。そのためか、中には読みづらい部分や、自分の中に落とし込むまでに何度も繰り返し読んでみてわかるといった部分もあります。こちらは、日本人のデザイナーが記した書ということもあり、すっと頭に入ってくるのが特徴です。

ノンデザイナーズ・デザインブック同様に、こちらの書籍も本来はWEBデザインに特化しているものではありません。しかしながら、デザインに関する基本的な考え方や知識を得ることが十分にできます。

また、ノンデザイナーズ～と異なるのは、デザインの活用についての内容が濃いため、さらに実践的ともいえます。ノンデザイナーズ・デザインブックとあわせて持っておきたい1冊です。

だから、そのデザインはダメなんだ。WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる

上記の2冊よりも、さらに実践的な書籍です。WEBサイトのデザインに特化した内容になっているため、WEBデザイナー初心者が迷いがちなデザインの良し悪しを判断する助けにもなります。

また、どんな点でダメなのかが説明されているため、クライアントとデザイン案を詰めていく際にも、何をもってダメなのかを伝えるスキルも身につけられるでしょう。さらに、実在するWEBデザインが使われているため、デザインするうえでの具体的な参考書としても使えます。

タイポグラフィの基本ルール -プロに学ぶ、一生枯れない永久不滅テクニック-

WEBデザイナーは、色味や色調などによる配置や写真・イラストの作成だけが仕事ではありません。文字というデザインを扱うことも仕事の一部です。タイポグラフィは、文字を使用したデザイン処理のことで、読者や利用者の可読性・視認性・注目度を左右する大切なものです。

本書では、効果的な書体、フォントサイズ、行間などについて書かれており、初心者が見落としがちな文字デザインの重要性について学べるようになっています。ここに書かれている内容を意識してデザインすることによって、素人っぽさが抜け、よりプロらしいデザインに仕上げられるようになります。

UI/UXデザインを学ぶときに参考になる本

UI/UXデザインは、コンバージョンを狙うWEBサイトにとって無視することのできないものです。トレースをすることでデザインの知識を増やすことはできても、それが実際に効果があり、実績があるのかどうかなど、外側からではわかりません。

では、どんなUI/UXデザインであれば効果があるのか。初心者WEBデザイナーは、経験も実績もまだまだこれからですから、知識として参考にしたい書籍をご紹介します。

UIデザイン みんなで考え、カイゼンする。

こちらは、UIデザインを含めてデザインを作り上げるうえで必要な考え方、取り組み方などが書かれており、デザインについて書かれた本ではありません。「デザインの力を付けたいのに、そんなことを学んでどうするのか？」と考える人もいるかもしれませんが、実際の現場ではデザインに関することは、デザイナーが主導権を握ってクライアントと案を詰めていくことになります。

WEBデザイナーは、単にデザインだけできればいいというわけではないのです。成果が出るUIデザインを突き詰めるには、着眼点や考えるプロセスを重視して設計していくことが重要です。本書は、先述の点に加えて、チームのリレーションシップを上げるうえでも大切な視点を与えてくれます。

【新版】UI GRAPHICS　成功事例と思想から学ぶ、これからのインターフェイスデザインとUX

こちらの書籍は、2015年に発売された「UI GRAPHICS」の改訂本です。WEBの世界でのトレンドや環境は、まるで激流の川のごとく移り変わっていきます。そのため、最新のトレンドや技術などを盛り込み、改めて本書が発売されたのです。

デザインについては、デザイン手法を学ぶというよりも、考え方や背景から知識を得られるようになっています。現状を理解したうえで最適解を導き出すにはどうすべきか、効果を発揮するには何に気を付ければいいのか、といった歴史的観点から知識を増せる書籍です。

HTMLとCSSを学ぶときに参考になる本

WEBデザイナーがWEBサイトをデザインする際、あると仕事の幅が確実に広がるのがコーディングスキルです。コーディングとは、“HTMLやCSSなどプログラム言語のコード（指示語）を書く”ことを指します。

コーディングができるのと、できないのとでは請け負える仕事の量が少なくなります。コーディングができないと、一つのWEBサイトを作る際にコーダー（コーディングをする人）を別に採用しなければなりません。しかし、そのぶん予算が必要になりますし、クライアントの本音としてはコストは安いに越したことはないのです。

こうした背景もあり、いまやWEBデザイナーはコーディングはできて当たり前という風潮にあります。デザインも初心者で、なおかつプログラムに関しても初心者だと、ハードルが高く感じるかもしれません。

ですが、コーディングはトレースで繰り返し練習したり、実践で覚えていくことでいくらでも身につくスキルです。参考になる書籍を1冊でも持っておくと安心です。

1冊ですべて身につくHTML & CSSとWebデザイン入門講座

コーディングするなら、知っておくべきHTMLとCSS。本書では、最初からコードを解説するというものではなく、WEBデザインをする際に知っておくべき制作工程、表示の仕組みなど、初歩的な部分から言及されています。

入門書とあるように、WEBデザイナー初心者にピッタリの内容です。

本当によくわかるHTML&CSSの教科書 シンプルで、デザインの良いサイトが必ず作れる

こちらも初心者向けに用意された書籍で、WEBサイトを1から作る方法が書かれています。WEBサイトが公開されるまでの一連の流れや手順も、わかりやすい言葉で説明されていますから、自身のポートフォリオサイトを作るときにも役に立ちます。

シンプルさが売りになっているので、基本中の基本が学べる書籍と位置付けておくといいでしょう。

JavaScriptやjQueryを学ぶときに参考になる本

コーディングで使われる言語には、HTMLやCSS以外にも、JavaScriptやjQueryといったものもあります。コーディングスキルは、覚えるというよりも、理解して適切なコードを選んでいく力を身に付けることが必要でしょう。

ここでは、HTMLやCSSと並んで、基本的な部分を理解するために一助になる書籍を紹介しています。ここから始めていくことで、確実に力が身につくものをピックアップしました。

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)

JavaScriptを初めて書く人向けにまとめられた書籍です。基本的なコードの書き方や使い方から実践で役立つテクニックまで得られる1冊です。超初心者をターゲットに想定されているため、プログラミングの基本知識のある人にとっては物足りない印象を受けるかもしれません。

作りながら学ぶjQueryデザインの教科書

jQueryについて、基本知識から実践的内容まで含まれた書籍です。本書を通してサンプルを作ることによって、一連を学べるようになっています。jQuery初心者向けではありますが、「教科書」というだけあり、実務中に辞書代わりに使うこともできる使い勝手のいい書籍になっています。

まとめ

ここで挙げた書籍は、いずれも初心者WEBデザイナーが一度は目を通しておきたいものばかりです。書籍を読みつつ、コーディングやトレースをすれば、実力も上がり、活躍を飛躍させていけるでしょう。