Webサイトを学び始めた方におすすめの本5選
「Web制作の学び始めにおすすめの本は？」と聞かれることが多くなりましたので本記事にて紹介します。対象はこれから学び始める方ですが、サイトを作成した後に読み返すと新たな気付きをもらえる本ばかりなので初心者を脱出したい方にもおすすめです。気になるものはぜひ手にとってみてください。
HTML&CSSとWebデザインが1冊できちんと身につく本
技術評論社
Webサイトとは？から始まり、制作環境の準備方法、デザインに合わせたコーディングについて詳細に解説されております。基礎内容は一通り網羅してあるのでWebサイトの勉強をし始めた方にピッタリの内容。体系的にまとめられていて手を動かしながら学べるは身につきやすいと思います。
コードで「なぜ今float なのか？」「background-attachment はまだ早い⁉」など気になる点がありましたが、総合的に見て本書を初学者向けにおすすめします。
Amazonの紹介文
「4つのレイアウトパターン」と「レスポンシブデザイン」を、実際に手を動かして作りながら、サイト制作の基本が学べる!ライブ感のあるチュートリアル学習により、まるでWebデザイン会社でOJT(オン・ザ・ジョブ・トレーニング)を受けているような、体験型の独習書です。
【本書の対象読者】
・はじめてHTMLやCSSを学び、これからサイト制作をはじめる方
・超初心者ではないが未経験からWebデザイナーを目指している方【学習のしかけ】
はじめて学ぶ方には
・1つのサンプルサイトで4つのレイアウト手法が学べる
・チュートリアル形式でHTML5とCSS3の基本が身につく
・言語の解説だけでなくWebデザインの基礎についても解説
・レスポンシブデザインによるマルチデバイス対応がわかる
・見映えのよいデザインのサンプルサイトで楽しく学べるWebデザインの現場を知りたい方には
・CSSだけで背景画像を全画面表示にできる
・疑似要素や擬似クラスを積極的に使用している
・Webフォント(Google Fonts)を採用しているなどの新しい技術から、制作現場で実績のある実践テクニックまでをサンプルサイトのソースコードに盛り込みました。
1冊ですべて身につくHTML & CSSとWebデザイン入門講座
SBクリエイティブ
先に紹介した「HTML&CSSとWebデザインが1冊できちんと身につく本」を読み終えた後にはこちらをおすすめします。Webサイト作成の基礎を学ぶ内容なので情報が被っているものもありますが、基礎情報をさらに補える情報が紹介されております。
また、コードもこちらの書籍の方が今使えるものが多く、今現場でよく使われているflexbox の説明が分かりやすいので、サンプルサイトと合わせて実装方法を学ぶと理解しやすいと思います。体系的に学ぶにはピッタリの1冊です。
Amazonの紹介文
知識ゼロから体系的に学べる!HTMLとCSSの基本。最新の技術に対応!レスポンシブ、Flexbox、CSSグリッド。手を動かしながら学べる!プロの現場で役立つテクニック。コードの知識からデザインのことまで1冊ですべて学べる!
失敗しないカラーリング 知っておくと役立つ色のあれこれ
ソシム
学び始めの方にピッタリの配色本がこちら。色の紹介だけの内容ではなく、なぜこの配色なのか一つ一つ丁寧に解説されていて分かりやすいです。
配色本は一般的に配色だけを紹介しているものが多い印象。色の組み合わせは分かるけど初学者としては「なぜ」を解決することができないので、本書のように根拠を示してもらえるものが良いと思います。配色の学び始めはこちらがおすすめです。
Amazonの紹介文
大学・専門学校、企業研修などで色彩学講師を務め、色彩教材の企画制作を手がけてきた著者。
その「現場での経験」をまとめた、色彩センスのなさに悩む人々の問題を解決する1冊です。
「料理関連デザインに青はNG?」「和風にしたつもりがエスニック調に…」など、現場でよくあるお悩みを取り上げて解決方法を紹介します。
ゆるいイラストと紙面構成で読みやすい雰囲気ですが、実はしっかりと随所に使える知識が散りばめられています。
簡単だけど、すごく良くなる77のルール デザイン力の基本
日本実業出版社
うっかりやりがちなデザインをなぜダメなのか、どうすれば良いデザインになるのか、デザインする上でおさえておきたい基本的なポイントを丁寧に解説されています。
内容は紙デザインですが、もちろんWebデザインにも使えるTipsばかりで、伝えるためのデザイン力を身につけることができると思います。学び始めの方や初心者から脱出したい方におすすめ。
Amazonの紹介文
累計65万部「○○力の基本」シリーズ最新作のテーマは「デザイン」
チラシ、ポスター、プレゼン資料、Webサイト、年賀状……をはじめ、ノンデザイナーでも、デザインのコツがすぐに身につく!「いきなり手を動かす」「とりあえず大きくすれば目立つ」「いろんな色、書体を使いたがる」など、よくやりがちなダメパターンを避けるだけで、プロのデザイナーの原理原則が身につきます。
プロのデザイナーの思考プロセスを「デザインの原理原則(「AISUS」)」をもとに、「BEFORE → AFTER」の改善例とともにわかりやすく解説していきます。※AISUS
Accessibility(見やすさ、よみやすさ)
Impression(印象・映え)
Sincerity(信頼性・誠実さ)
Uniquness(ユニークである、独自性)
Share(共感・共生・共創力)チラシ、ポスター、プレゼン資料、Webサイト、年賀状……をはじめ、ノンデザイナーでも、「ワンキャッチ・ワンビジュアル」「色は3色まで」「基本は明朝体とゴシック」「文字の縁取りはやらない」など、すぐに役に立つデザインの原理原則やティップスを紹介します。
Webデザイン必携。プロにまなぶ現場の制作ルール84
Webデザインでやった方がいいこと、やらない方がいいことをまとめた1冊。デザインを作成後チェックする時に見直すといいかと思います。Webサイトの作り方を紹介する本は多いですが、何かとやりがちな注意点をまとめた本は意外と少ないのでこちらおすすめします。
Amazonの紹介文
〜Webデザインの考え方とデータ作成の正しいルールを身に付ける〜
Webデザインは、サイトの固定的な見映えだけを考えればよいわけではありません。Webページとして公開される際は、必ずHTML・CSSによるコーディングを経る必要があります。また、端末によって画面幅も異なりますし、ユーザーの使い勝手も重要です。さらに、公開後の更新によってはコンテンツの文量も変わるかもしれません。このようなWebの特性を理解していないと、そもそも実現不可能だったり、ユーザーが使いにくかったり、更新で崩れてしまうようなデザインになりがちです。
本書では、このようなWebデザインに携わるうえで知っておくべきルールを1冊にまとめました。Webデザインの基本的な考え方から、デザインデータ作成のノウハウ、納品時の指定、Photoshop/Illustratorの効率的な使い方など、Webデザイナーがプロとして“やるべきこと”と“やってはいけないこと”を網羅しています。Webデザインの初心者はもちろん、これまでグラフィックデザインを中心に手がけていた方にもきっと役立つはずです。Web特有のマナーを踏まえて、手戻りなく、スムーズに後工程が進められるデザイン制作を目指しましょう。
〈こんな方におすすめです〉
◯これからWebデザイナーを目指す方
◯手戻りが多く、もっと効率的な進め方がないか模索している方
◯Webデザインも手がけるグラフィックデザイナー
