2020年上半期に話題になったWebデザイン・コーディング参考書15冊

おはようございます。社員Aです。

今回は、2020年上半期に話題になったWebデザイン・コーディング参考書をご紹介します。

Webデザイン勉強中の方はもちろん、実際に業務で使っている方も参考になるものばかりですので、ぜひご覧ください。

なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉

「デザイン＝楽しい」を実感できる新しいデザイン書籍。

デザインする上で必要な基礎、概念、ルール、プロセスを

図解やイラスト、写真などのビジュアルで解説しています。

現場で活躍しているデザイナーが身近にあるわかりやすいものに例えたり、

図解、イラスト、別のものに置き換えて見方を変えてみたり…

豊富なビジュアルとともにわかりやすくひも解いた、

楽しみながらデザインのあれこれがわかる「なるほど！」と思える内容が盛りだくさんです！

なるほどデザイン 目で見て楽しむデザインの本。 ［ 筒井美希 ］

2,200円(04/26 18:06時点)

楽天市場

企画の立ち上げから本が完成するまでには、2年かかったそうです。

簡単だけど、すごく良くなる77のルール デザイン力の基本

「いきなり手を動かす」「とりあえず大きくすれば目立つ」「いろんな色、書体を使いたがる」など、

よくやりがちなダメパターンを避けるだけで、プロのデザイナーの原理原則が身につきます。

プロのデザイナーの思考プロセスを「デザインの原理原則(「AISUS」)」をもとに、

「BEFORE → AFTER」の改善例とともにわかりやすく解説しています。

チラシ、ポスター、プレゼン資料、Webサイト、年賀状など様々なシーンで役立つノウハウが掲載されています。

けっきょく、よはく。 余白を活かしたデザインレイアウトの本

「”今”のデザインがわかる! 」と大反響。

グラフィックデザイナーはもちろん、ノンデザイナーの方にも役立つ1冊。

ポスター、チラシ、POP、DM、プレゼン資料、会社案内、名刺などさまざまな作例でデザインのNG/OKを紹介しています。

けっきょく、よはく。 余白を活かしたデザインレイアウトの本 ［ ingectar-e ］

1,980円(04/26 17:57時点)

楽天市場

余白のとり方やレイアウト、配色、フォント選びなど実務で役立つ知識ばかりです。なるほどデザインと合わせて、本屋では目立つところに置いてあるのをみかけます。

ほんとに、フォント。　フォントを活かしたデザインレイアウトの本

先ほど紹介したデザイン書「けっきょく、よはく。」待望の第２弾。

フォントの知識を深める専門書は数あれど、結局、どのフォントをどう使えばいいの？という方におすすめ。

ほんとに、フォント。 フォントを活かしたデザインレイアウトの本 ［ ingectar-e ］

1,980円(04/26 18:06時点)

楽天市場

フォントのセンスを磨くにはたくさんの使用例を見ることが大切です。その経験値を上げるためにも読んで損はないです。

あるあるデザイン

デザインでよく使う手法を、豊富な作例とともにワンフレーズで紹介したレイアウトフレーズ集です。

写真をうまく使ったレイアウトを組みたい、イラストを活かしたい、文字だけで魅力的なデザインを作りたい……。

そんなときにパッと思い出したいあるあるなデザイン手法を45個のワンフレーズにまとめられています。

あるあるデザイン ［ ingectar-e ］

2,200円(04/27 02:38時点)

楽天市場

掲載されている作例は合計270点と圧倒的です。「デザインがありきたりになってしまう」という方への新しいインプットとしても役立ちます。

見てわかる、迷わず決まる配色アイデア 3色だけでセンスのいい色

センスのよい色の組み合わせがすぐ選べる、3色の配色アイデアに特化した配色本です。

おしゃれな色の組み合わせがわからない、たくさんの色があると色選びに悩む、見栄えのよく、バランスよく配色がまとまらない・・・。

そんな悩みを解決しデザイン作業に役立つ1冊です。

見てわかる、迷わず決まる配色アイデア3色だけでセンスのいい色

1,980円(04/27 02:38時点)

楽天市場

全ての配色のデザイン作例を収録しているので、デザインイメージや掴みやすい内容になっています。

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

ゆにメモのフォロワーさんでも読んでいる人が特に多い一冊です。

InstagramのWEBデザイン界隈でもこの本を載せている方をたくさん見かけます。

Web関連の情報やデザインについて記事が学べる『Webクリエイターボックス』の中の人、Manaによる渾身のHTML & CSSとWebデザインが学べる本。

これからWebサイトを作り始める初心者からWebの最新技術を学びたい人まで、幅広い読者を対象にしており、手を動かしながら学べます。

今までは、初心者向けの本でもデザインとコーディングが分かれているものが多かったのですが、この本は一冊で学べるのでわかりやすいですね。

配色アイデア手帖 めくって見つける新しいデザインの本

26刷、135,000部突破の大ヒット。

印象別/年代別/国別/色相別など、さまざまな配色見本が全部で3175選収録されています。

イメージを形にできる新しい配色の教科書です。

全テーマ見開き完結で読みやすく、本のサイズがコンパクトだから作業の邪魔になりません！

配色デザイン良質見本帳

配色デザインに関わる全ての人へ「直感」×「理論」で学べる一冊になっています。

合計300点以上の厳選した良質なグラフィックデザイン、Webデザイン、プロダクトデザイン、写真を集めたプロのデザイナーが使える配色見本集です。

デザインのイメージが見つからない方や配色に自信がない方におすすめの一冊です。

デザイナーになる! 伝えるレイアウト・色・文字の大切な基本と生かし方

この本は「デザイナー」を目指す人のための「入門の入門書」です。

第1章は、「デザイン構築の流れ」と、デザイナーの大切な「心構え」。

第2章は、デザインに必要なレイアウト・色・文字の「基本知識」。

第3章は、目的に沿った「デザインの作例紹介」。具体的な手法と考え方を解説します。

デザイナーを目指すすべての人はもちろん、デザインの基本を知りたいという人も楽しく学べる一冊です。

っぽくなるデザイン 誰でもできるかっこいいレイアウト集

今よく使われていたり、よく見る表現を集め、「ファッション誌っぽく」「お店っぽく」「アパレルブランドっぽく」など「●●っぽくなる」デザインを、雑誌、ポスター、広告、ショップカード、装丁などいろいろなデザイン作例で解説しています。

作例とともに解説されているので、取り入れやすいです。

Webデザイン良質見本帳

創造力を高める最新良質サイト415選がまとめられた見本帳。

レイアウト、配色、フォント、素材、プログラムなど、ページを構成しているデザインパーツまで分解して解説しているので、Webサイトを見るだけではわからなかった「デザインの魅力の理由」がわかり、サイトの制作にもすぐに活用できます。

テーマ別に分かれているので見やすく、私もデザインをするときにこの本を開いて参考にしています。

Adobe XDではじめるWebデザイン&プロトタイピング

ワイヤーフレームの作り方から、デザインカンプ制作、コンポ―ネントの管理、画面遷移の設計、インタラクティブなプロトタイプ制作と共有、コーディングに必要なデザインスペックの共有、さらに動きのあるUI設計やプラグイン活用まで、現場レベルで求められるスキルを、より実践的な学び方で習得できます。

初学者から、現場経験が浅い新人デザイナー、さらにグラフィックデザインからWebへキャリアを広げたい方まで、しっかりWebデザインを学びたい、あらゆる方のための一冊です。

現場レベルで求められるスキルを、より実践的な学び方で習得できます。

初心者からちゃんとしたプロになる Webデザイン基礎入門

WebデザインやHTML・CSSの学習を「1日30分からはじめる」をテーマに、やさしくしっかり解説した書籍。

初学者の方が、プロのWebデザイナーを目指す上で必要となる基本的な知識や技術を体系的に学べます。

Webデザインの概論と制作に必要となるツールや素材・配色について学んだあと、HTML・CSSの基礎と実践を習得し、サイトの公開や運用に関する知識を身につけます。

サイトを制作し、公開・運用していくために必要な基本知識をすべて解説しているので実務に落とし込みやすくなっています。

HTML5&CSS3標準デザイン講座 30LESSONS

基本文法から、正しいマークアップの作法、最新のCSSレイアウト、レスポンシブ対応の画面設計とコーディングまで、しっかり学べます。

考え方や知識を得るための「講義」パートと、実際に作りながらスキルを身につける「実習」パートからなる、合計30のLESSONを順番にステップアップしながら学んでいけます。

レッスン形式なのでマイペースで学習を進められます。