Webデザイン良質見本帳 読んでみた。
［記事公開日］2018/03/01
［最終更新日］2023/08/01
Webデザイン良質見本帳[第2版] 目的別に探せて、すぐに使えるアイデア集 単行本（ソフトカバー） – 2021/12/22
久保田 涼子 (著)
35000部突破した大ベストセラーが
最新のWebデザインの見本集を盛り込んで4年ぶりの大改訂!
Webデザイン良質見本帳[第2版]は前作とは全く違う内容の本です。
（似てる部分などもあると思います）
Webデザイン良質見本帳[第2版] 目的別に探せて、すぐに使えるアイデア集 単行本（ソフトカバー） – 2021/12/22
久保田 涼子 (著)
HTMLサイトをWordPressにする本 単行本 – 2023/8/26
久保田 涼子 (著), 西原 礼奈 (著), 阿諏訪 聡美 (著)
アイデアとかデザインとか 単行本 – 2022/11/1
青木亮作 (著)
価値あるアイデアの生み出し方、育て方
パッケージデザインのひみつ 単行本（ソフトカバー） – 2023/5/8
公益社団法人 日本パッケージデザイン協会 (監修)
あらゆる人の生活に密着している商品の「パッケージ」。
そこには、使いやすさ、訴求力、意匠性、さまざまな面から、デザインの工夫や秘密があふれています。
デザイナーのとなりで仕事を見ている気分 「そのデザイン、どうやって作るの？」が分かる、デザインの参考書 単行本（ソフトカバー） – 2023/5/15
森田 啓一 (著)
デザイナーの頭の中、手の内がまるわかり！
STEP UP! 同人誌のデザイン 作りたくなる装丁のアイデア 単行本 – 2023/3/15
髙山彩矢子 (著), しまや出版 (著), BNN編集部 (編集)
豊富な作例から広がる、デザインの可能性！
頑張らなくても速攻できる! パパッとデザインレシピ 単行本 – 2022/5/24
Power Design Inc. (著)
誰でもかんたん! マネするだけでできる時短デザイン本。
頑張らなくても速攻できる! パパッとデザインレシピ 単行本 – 2022/5/24
Power Design Inc. (著)
言葉をイメージに変える ひらめきデザインひき出し帖 単行本（ソフトカバー） – 2022/9/15
pasto (著)
デザインワークにおける“今すぐひらめきたい！”という要望に応えるアイデア＆ヒント集
あるあるタイポ。誰でもできる文字加工のデザイン集 単行本（ソフトカバー） – 2022/6/24
ingectar-e (著)
大好評『あるあるデザイン』シリーズに新刊の仲間入り!
あるあるタイポ。誰でもできる文字加工のデザイン集 単行本（ソフトカバー） – 2022/6/24
ingectar-e (著)
カワイイエコノミー 単行本 – 2022/1/6
稲垣 涼子 (著)
ヒット商品には、必ず「カワイイ」がある!
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目次
Webデザイン良質見本帳 読んでみた。
PART0 Webデザインの基礎知識
PART1 印象から考えるデザイン
PART2 配色から考えるデザイン
PART3 業種・ジャンル別から考えるデザイン
PART4 レイアウトや構図から考えるデザイン
PART5 素材・フォント・プログラムを使ったデザイン
PART6 トレンドのデザイン
PART7 パーツ別デザイン
Webデザイン良質見本帳
この本を手にとる人とか、買う人って、
Webデザインに興味があるとか、
Webのデザイン制作などしてる方、
またWebデザインの勉強などを、これからしたいと思ってる方など。
いろいろあると思います。
自分は去年に、この本を買いましたが、
もっと昔に、出ていたらいいなと思いました。
今は、昔みたいにWebスクールなどに通ってなく、サイトなどは作ってないけど。
求職者支援訓練などで、Webスクール系など通っても、
ちゃんと就職ができない。
ネットとかで検索すると、いろいろ出てきます。
求職者支援訓練に通った意味がないと感じる人も多いと思います。
Web系の場合だと求職者支援訓練で１度（3ヶ月、6ヶ月）受けたら、
2度目は受けられません。
Web業界って常に進化してるから、1度（3ヶ月、6ヶ月）求職者支援訓練で受けただけでは就職ができないです。（年齢が若いとか、個々のスキル、昔はデザインの仕事してとかによると思いますが。）
技術も、どんどん進化しています。
今は、昔と違い、書籍（本）良い本などが出ています。
また、動画を見て学べる時代なので、便利だと思います。
でも、本って、読み手によって異なる本もあります。
昔って、このような本って1冊も出てなく、
Webスクールなど通い、制作の課題とか出されても、
インターネットで検索して、あいまいな知識でサイトなど制作してた感じ。
短いは正義 「60字1メッセージ」で結果が出る文章術 単行本（ソフトカバー） – 2021/9/29
田口 まこ (著)
もう文章で悩まない!
プレゼン資料、メール、営業資料、プレスリリース、企画書、履歴書……
「一文60字、1メッセージ」ですべてうまくいく!
ロゴ
ブランドランキング
Best Japan Brands 2021
https://www.interbrandjapan.com/ja/bjb/japan_brands/2021.html
赤ペン添削でわかりやすい! 選ばれるデザイナーへの道 単行本 – 2022/2/25
上司ニシグチ (著)
SNSで大人気!
上司のいないデザイナーのためのオンライン上司・上司ニシグチが
新米デザイナーの作品を赤ペン添削します。
【期間限定特典あり】思わずクリックしたくなる バナーデザインのきほん 単行本（ソフトカバー） – 2022/2/9
カトウ ヒカル (著)
バナーデザインで困った時は
この1冊で解決!
バナーは情報量の多いWeb上に掲載されるので
「パッと一目で情報を伝える」必要があります。
なので、目に留めてもらう工夫が必須!
【期間限定特典あり】思わずクリックしたくなる バナーデザインのきほん 単行本（ソフトカバー） – 2022/2/9
カトウ ヒカル (著)
オノマトペでピンとくる! ひらめき配色図鑑 単行本（ソフトカバー） – 2022/2/8
FLAMINGO STUDIO INC. (編集)
ワクワク、きゅんきゅん、ドキドキ、しっとり…
「この感覚、色で表現するには何色がいいだろう?」
そんな悩みがすぐに解決する!
オノマトペでピンとくる! ひらめき配色図鑑 単行本（ソフトカバー） – 2022/2/8
FLAMINGO STUDIO INC. (編集)
(DLデータ付)デザイン初心者のためのPhotoshop Illustrator 先輩に聞かずに9割解決できるグラフィックデザイン超基礎 単行本（ソフトカバー） – 2022/1/25
Power Design (著), インプレス編集部 (編集)
新人デザイナーや、宣伝広報など社内デザイン担当者の方向けのPhotoshop、Illusutratorガイド。
QA形式で疑問点を先輩に教わっている感覚で解説しているのが特徴で、ポスター、Webバナーなど実際の業務での制作物を前提に、ソフトの画面の見方からデータの作り方、データの書き出し、印刷入稿方法、デザイン知識まで、現場のリアルな仕事を解説しています。WebやSNSの画像作り、印刷物のデータ入稿といった業務におすすめ。
(DLデータ付)デザイン初心者のためのPhotoshop Illustrator 先輩に聞かずに9割解決できるグラフィックデザイン超基礎 単行本（ソフトカバー） – 2022/1/25
Power Design (著), インプレス編集部 (編集)
Webデザイン良質見本帳[第2版] 目的別に探せて、すぐに使えるアイデア集 単行本（ソフトカバー） – 2021/12/22
久保田 涼子 (著)
35000部突破した大ベストセラーが
最新のWebデザインの見本集を盛り込んで4年ぶりの大改訂!
Webデザイン良質見本帳[第2版] 目的別に探せて、すぐに使えるアイデア集 単行本（ソフトカバー） – 2021/12/22
久保田 涼子 (著)
とりあえず、素人っぽく見えないデザインのコツを教えてください! 単行本（ソフトカバー） – 2022/1/19
ingectar-e (著)
素人っぽいデザインはもう卒業! 知識0でもわかるデザインの入門書が発売!
とりあえず、素人っぽく見えないデザインのコツを教えてください! 単行本（ソフトカバー） – 2022/1/19
ingectar-e (著)
現場で使える Webデザインアイデアレシピ 単行本（ソフトカバー） – 2022/1/28
小林 マサユキ (著)
HTML&CSSで表現するシンプルで使いやすいデザイン。
現場で使える Webデザインアイデアレシピ 単行本（ソフトカバー） – 2022/1/28
小林 マサユキ (著)
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
この本は、サンプルデータなどのダウンロードなどはないです。
本では、参考の、Webサイトなど載ってますが、
出来れば、参考サイトのURLの一覧とか、ダウンロードできると便利かもです。
本に載ってるURLの文字は小さいので、本だと、拡大縮小などできないので、
人によっては、虫眼鏡とかでみないとURLが見えないかも。
Googleなどで、サイトの名前や、URLを検索すればヒットするかもですが、
すこし手間な感じがします。
デザインは見て学ぶ
本書は415点の厳選した良質なWebサイトを集めた見本集です。
レイアウト、配色、フォント、素材、プログラムなど、ページを構成しているデザインパーツまで分解して解説しているので、Webサイトを見るだけではわからなかった「デザインの魅力の理由」がわかり、サイトの制作にもすぐに活用できます。
デザインパーツとか、架空のサイトでもいいので、ダウンロードデータで作成の見本とかあるといいかも。
載ってるサイトとか、テンプレートとかを使って、作ってるサイトもあるので、
1から作ったサイトとかなら勉強になるけど、テンプレートとかだと、勉強にならない場合もあります。
また、URLをアクセスしたら、そのサイトのデザイン（見出し、ほか）が変わってるのもあります。
（これは仕方ないけど）
後、びっくりするのが、
いきなり音がでるサイトもあるので、PCの音量など上げてる方などは注意が必要なサイトもあります。
音がでるなど、本に記載で載ってないので。
本書の対象読者
デザインのアイデアが見つからない方
デザインの制作に自信が持てない方
クライアントと打ち合わせする際に方向性となる見本が欲しい方
目的別に探せて、すぐに使えるアイデア集
動くWebデザイン アイディア帳 実践編 単行本（ソフトカバー） – 2021/7/31
久保田 涼子 (著), 杉山 彰啓 (著)
本書は、好評の「動くWebデザイン アイディア帳」の姉妹本です。
動くWebデザイン アイディア帳 実践編 単行本（ソフトカバー） – 2021/7/31
久保田 涼子 (著), 杉山 彰啓 (著)
動くWebデザインアイディア帳 単行本 – 2021/2/27
久保田涼子 (著), 杉山彰啓 (著)
「サイトに動きをつける時、同じ内容を何回も検索をしてソースコードを探している」
「サイトで見つけたソースコードをそのままコピペしてみたけど、動かない」
本書はWebサイトを動かすことが苦手な右脳系ウェブデザイナーが、サイトを動かす第1歩を踏み出すための「動きの逆引き事典」です。
動くWebデザインアイディア帳 単行本 – 2021/2/27
久保田涼子 (著), 杉山彰啓 (著)
ネットに詳しいだけでネットマーケ担当者になってしまった人が本気でマーケターを目指す本 単行本（ソフトカバー） – 2021/8/21
佐藤 昌弘 (著)
マーケティングにネットは避けて通れない必須の時代
今は、1カラムのサイトが多いです。
Amazonサイトも3カラムから1カラムに。
昔はPCからサイトを閲覧してた。スマートフォンが普及してから、
現在では、スマートフォンでサイトを見るので、1カラム（1ペラ）が支流
ネットに詳しいだけでネットマーケ担当者になってしまった人が本気でマーケターを目指す本 単行本（ソフトカバー） – 2021/8/21
佐藤 昌弘 (著)
たのしごとデザイン論 完全版 すべてのクリエイターが幸福に仕事をするための50+未来の方法論。 単行本（ソフトカバー） – 2021/10/22
カイシ トモヤ (著)
「 何を作るか? 」 から「 どう作るか? 」へ。
自分の価値の見つけ方、つくり方を学び、
健やかに、仕事を楽しく続けるための道しるべ。
たのしごとデザイン論 完全版 すべてのクリエイターが幸福に仕事をするための50+未来の方法論。 単行本（ソフトカバー） – 2021/10/22
カイシ トモヤ (著)
色の大事典 基礎知識と配色・カラーチャート・伝統色・慣用色名 DIGITAL COLORS for DESIGN 単行本（ソフトカバー） – 2021/9/17
井上 のきあ (著)
あらゆるデザイン制作に役立つ色彩のすべて。
色の大事典 基礎知識と配色・カラーチャート・伝統色・慣用色名 DIGITAL COLORS for DESIGN 単行本（ソフトカバー） – 2021/9/17
井上 のきあ (著)
366日 日本の美しい色 (366日の教養シリーズ) 単行本（ソフトカバー） – 2021/10/21
橋本 実千代(カラーコンサルタント) (監修)
1週間で7テーマ! 1年で「和の色」の魅力を探る!
366日 日本の美しい色 (366日の教養シリーズ) 単行本（ソフトカバー） – 2021/10/21
橋本 実千代(カラーコンサルタント) (監修)
美しい自然の色図鑑 1000点の博物画でひもとくカラーチャートの歴史 大型本 – 2021/10/8
石井 博 (監修), 宮脇 律郎 (監修), パトリック・バティ (編集),
動物・植物・鉱物の博物画で魅せる、110の色見本
美しい自然の色図鑑 1000点の博物画でひもとくカラーチャートの歴史 大型本 – 2021/10/8
石井 博 (監修), 宮脇 律郎 (監修), パトリック・バティ (編集),
【Amazon.co.jp 限定】鬼フィードバック デザインのチカラは“ダメ出し”で育つ (特典:未収録オリジナル「鬼フィードバック」掲載PDF) 単行本（ソフトカバー） – 2021/9/17
前田 高志 (著), 染谷 昌利 (編集)
『前田デザイン室』で生まれたデザイン千本ノック、“鬼フィードバック”を書籍化!
【Amazon.co.jp 限定】鬼フィードバック デザインのチカラは“ダメ出し”で育つ (特典:未収録オリジナル「鬼フィードバック」掲載PDF) 単行本（ソフトカバー） – 2021/9/17
前田 高志 (著), 染谷 昌利 (編集)
Photoshop よくばり入門 CC対応 (できるよくばり入門) 単行本（ソフトカバー） – 2021/10/21
senatsu (著)
Photoshop よくばり入門 CC対応 (できるよくばり入門) 単行本（ソフトカバー） – 2021/10/21
senatsu (著)
(PDF版電子書籍・練習用ファイル・解説動画付き)Illustrator よくばり入門 CC対応 (できるよくばり入門) 単行本（ソフトカバー） – 2021/11/4
石川 洋平 (著), 清水 健次 (著), 堀内 良太 (著)
(PDF版電子書籍・練習用ファイル・解説動画付き)Illustrator よくばり入門 CC対応 (できるよくばり入門) 単行本（ソフトカバー） – 2021/11/4
石川 洋平 (著), 清水 健次 (著), 堀内 良太 (著)
女性の心をつかむショップイメージグラフィックス 単行本（ソフトカバー） – 2020/4/17
パイ インターナショナル (編集)
今、女性に好まれる注目すべきショップ約100件が一堂に!
女性の心をつかむショップイメージグラフィックス 単行本（ソフトカバー） – 2020/4/17
パイ インターナショナル (編集)
UXと理論で作る Webデザイン: デザイナーでなくてもわかる Kindle版
川合 俊輔 (著), 大本あかね (著), 菊池崇 (著) 形式: Kindle版
デザインする際にツールを思い通りに使いこなせることも重要ですが、デザインするための原則や法則を学ぶことはさらに重要です。
なぜこのレイアウトなのか、なぜこのUIなのか、なぜこの色なのか…
【Amazon.co.jp限定】見てわかる、迷わず決まるフォントのアイデア マネするだけでセンスのいいフォント(特典「装飾につかえる! カジュアルな手書きフォントデータ」データ配信) (見てわかるシリーズ) 単行本（ソフトカバー） – 2021/10/19
ingectar-e (著)
【Amazon.co.jp限定】見てわかる、迷わず決まるフォントのアイデア マネするだけでセンスのいいフォント(特典「装飾につかえる! カジュアルな手書きフォントデータ」データ配信) (見てわかるシリーズ) 単行本（ソフトカバー） – 2021/10/19
ingectar-e (著)
直感で伝わる！プレゼン資料は見た目が9割 単行本 – 2021/7/16
高村 勇太 (著)
直感で伝わる！プレゼン資料は見た目が9割 単行本 – 2021/7/16
高村 勇太 (著)
【Amazon.co.jp 限定】これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本(特典:すぐにサイト作成を開始できる! HTMLスターターキット&最新技術バリアブルフォントの解説PDF) 単行本（ソフトカバー） – 2021/10/14
Capybara Design 竹内 直人 (著), 竹内 瑠美 (著)
本書は手を動かしてWebサイトを作りながら
HTML/CSSとWebデザインの基本を楽しく学べる入門書です。
【Amazon.co.jp 限定】これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本(特典:すぐにサイト作成を開始できる! HTMLスターターキット&最新技術バリアブルフォントの解説PDF) 単行本（ソフトカバー） – 2021/10/14
Capybara Design 竹内 直人 (著), 竹内 瑠美 (著)
【特典PDF付き】現場のプロから学ぶ CSSコーディングバイブル (Compass Web Development) 単行本（ソフトカバー） – 2021/8/27
田村 章吾 (著)
本書では、業務でWebサイトをコーディングしていく人を対象として、必要なCSSの知識、CSS設計の基本、CSSを効率的に書くためのSassの基本を解説しました。後半はサンプルサイトのコーディングプロセスを通して、実践的な制作ノウハウを学びます。
【特典PDF付き】現場のプロから学ぶ CSSコーディングバイブル (Compass Web Development) 単行本（ソフトカバー） – 2021/8/27
田村 章吾 (著)
個人サイトを作ろう! テンプレートですぐできる! すぐに身につく! HTML&CSS 単行本（ソフトカバー） – 2021/8/24
ガタガタ (著)
はじめてでもHTMLとCSSの基本をしっかり学べる
ウェブサイトを自分で作ってみたい人
昔、個人サイトを作っていた人
個人サイトを作ろう! テンプレートですぐできる! すぐに身につく! HTML&CSS 単行本（ソフトカバー） – 2021/8/24
ガタガタ (著)
レタースペーシング タイポグラフィにおける文字間調整の考え方 単行本 – 2021/7/21
今市達也 (著)
タイポグラフィにおける「レタースペーシング(文字間調整)」に焦点を当て、
今まで感覚的に処理されてきたレタースペーシングを論理的に考察し、
図と文章で丁寧に解説した書籍です
レタースペーシング タイポグラフィにおける文字間調整の考え方 単行本 – 2021/7/21
今市達也 (著)
印刷ボーイズに花束を 単行本 – 2021/9/2
奈良裕己 (著)
印刷あるあるのすべてがわかる超究極本、誕生!
印刷ボーイズに花束を 単行本 – 2021/9/2
奈良裕己 (著)
Webデザインの基本きちんと入門[第2版] 単行本（ソフトカバー） – 2021/8/19
伊藤 庄平 (著), 益子 貴寛 (著), 宮田 優希 (著),
これからはじめる人、一気に学びたい人へ
一生使えるWebデザインのテクニック集!
Webデザインの基本きちんと入門[第2版] 単行本（ソフトカバー） – 2021/8/19
伊藤 庄平 (著), 益子 貴寛 (著), 宮田 優希 (著),
教科書では教えてくれないHTML&CSS 単行本（ソフトカバー） – 2021/7/17
狩野 祐東 (著)
各種講座や書籍でHTML&CSSの学習を終えても、実際の現場では、求められるレベルの業務をこなせない人が少なくありません。デザイナーから渡されたデザインの全体を把握・解釈して、HTML&CSSで書き起こす力が弱い傾向にあります。
教科書では教えてくれないHTML&CSS 単行本（ソフトカバー） – 2021/7/17
狩野 祐東 (著)
Webデザイン必携。 プロにまなぶ現場の制作ルール84 Kindle版
北村 崇 (著), 浅野 桜 (著) 形式: Kindle版
【Webデザイナーとして“やるべきこと”と“やってはいけないこと”をまとめた新しいルールブック】
Webデザイン必携。 プロにまなぶ現場の制作ルール84 単行本 – 2016/3/23
北村 崇 (著), 浅野 桜 (著)
コンバージョンを上げるWebデザイン改善集 単行本（ソフトカバー） – 2020/6/29
井水大輔 (著), 菊池達也 (著), 井上清貴 (著),
本書は、Webサイトのデザインを改善するために役立つ実際の改善事例やTipsなど、絶えずWebサイトを改善し続けるためのヒントを詰め込みました。
コンバージョンを上げるWebデザイン改善集 単行本（ソフトカバー） – 2020/6/29
井水大輔 (著), 菊池達也 (著), 井上清貴 (著),
Webデザイナー女子〜Webデザイナーになる前に知りたい７つのこと〜 Kindle版
たいら (著) 形式: Kindle版
麗香先生が教えるLPの作り方: 初心者でもわかりやすく丁寧に教えちゃいます♡ Kindle版
BHP出版 (著), 麗香 (著) 形式: Kindle版
ひきニートはフリーWEBデザイナーに転職する Kindle版
ぷぅすけ (著) 形式: Kindle版
ITスキルのない人がwebデザイナーになるための副業アウトプット成功術: webデザイナーとして稼ぐためのSuccessRoadがスキマ時間で分かる 楽しく続けるクリエーター生活【副業】【webプログラミング】【経営数学】【スモールビジネス】【eコマース】 Kindle版
山田 浩平 (著), DIY出版 (著, 編集) 形式: Kindle版
【2021年増補版】36歳のずぼら主婦がWEBデザインを3ヶ月勉強したら月10万円と昔からの夢を手に入れた【副業】: ９９％の人が間違っている稼ぎ方【在宅】 Kindle版
佐々木波瑠 (著) 形式: Kindle版
【Amazon.co.jp 限定】あるあるレイアウト すぐに使えて素敵に仕上がるデザインカタログ集(特典:困った時に使えるレイアウト集 特別編集版PDFデータ配信) 単行本（ソフトカバー） – 2021/5/28
ingectar-e (著)
レイアウトの参考になるグレーレイアウト(.eps)データは、ダウンロードできます。
【Amazon.co.jp 限定】あるあるレイアウト すぐに使えて素敵に仕上がるデザインカタログ集(特典:困った時に使えるレイアウト集 特別編集版PDFデータ配信) 単行本（ソフトカバー） – 2021/5/28
ingectar-e (著)
昔に、面接で言われた。
ギャラリーサイトのような作品でないと。それで目指すのは辞めました。20代だったら頑張ってたかも。
Webデザイン、Web製作などに便利な参考サイト
URAGAWA | 制作会社がわかるWEBデザイン・参考サイト集
国内トップクラスの制作プロダクション、事業会社のクリエイティブが「どの企業が作ったのか」も含めてわかるWEBデザインギャラリー、参考サイト集です。
https://uragawa.work
マネるデザイン研究所
普通のWebデザイン集とは違い、ちょっぴりポイントを解説したWebデザイン集です。
https://maneru-design-lab.net
I/O 3000
Webデザインに関わる人のためのWebデザインギャラリーサイトです。国内外を問わず、Web制作の参考となるサイトをセレクトしています。
https://io3000.com
現代デザイン | Webデザインギャラリー・サイトリンク集
現代デザインはWebサイトを集めたギャラリー･リンク集です。
https://gendaidesign.com
縦長のwebデザインギャラリー・サイトリンク集｜MUUUUU.ORG
https://muuuuu.org
S5-Style、Webデザインギャラリー
ハイクオリティなWebデザインをブックマークしたWebデザインギャラリー。
https://bm.s5-style.com
Webデザインの新しい教科書 改訂3版 基礎から覚える、深く理解できる。〈Flexbox、CSS Grid、レスポンシブ〉 単行本（ソフトカバー） – 2021/5/28
こもりまさあき (著), 赤間 公太郎 (著)
Web制作入門書のロングセラーが、最新仕様にアップデート!
本書の章構成
Lesson1 Webデザインの世界を知る
Lesson2 Webサイトを設計する
Lesson3 HTMLの役割とできること
Lesson4 CSSの役割とできることLesson5 Webサイトを構成する素材
Lesson6 Webサイトを表現する色
Lesson7 Webサイトを公開する
Lesson8 Webサイトを運用する
Lesson9 Webサイトを制作する
Webデザインの新しい教科書 改訂3版 基礎から覚える、深く理解できる。〈Flexbox、CSS Grid、レスポンシブ〉 単行本（ソフトカバー） – 2021/5/28
こもりまさあき (著), 赤間 公太郎 (著)
広告がなくなる日 単行本（ソフトカバー） – 2021/3/26
牧野 圭太 (著)
広告がなくなる日 単行本（ソフトカバー） – 2021/3/26
牧野 圭太 (著)
Illustrator & Photoshopデザインの作り方 アイデア図鑑 単行本（ソフトカバー） – 2021/6/19
上司ニシグチ (著), 長井 康行 (著), 楠田 諭史 (著), 森 一機 (著)
デザインが作れない。操作がわからない。センスがない。成長してない。アイデア出ない!
プロの技が一気に学べる!
学習用の素材は「全て」ダウンロードできます。
仕事で一生使える Illustratorトレーステクニック 単行本（ソフトカバー） – 2021/5/1
北村 崇 (著), 渋谷 瞳 (著)
ロゴマーク・手描きのトレース・地図の作成・自由なイラストなどなど、知っておくと仕事で一生使えるイラレのワザを身につけましょう。
仕事で一生使える Illustratorトレーステクニック 単行本（ソフトカバー） – 2021/5/1
北村 崇 (著), 渋谷 瞳 (著)
2択でわかる配色基礎トレーニング 単行本（ソフトカバー） – 2021/1/20
内田広由紀 (著), 視覚デザイン研究所 (編集)
デザインを学びたいなら
勝てるデザイン 単行本 – 2021/3/17
前田 高志 (著)
なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉 単行本 – 2015/7/31
筒井 美希 (著)
簡単だけど、すごく良くなる77のルール デザイン力の基本 単行本（ソフトカバー） – 2019/8/8
ウジ トモコ (著)
伝わるデザインの授業 一生使える8つの力が身につく 単行本（ソフトカバー） – 2020/11/9
武田 英志 (著)
レイアウトを学びたいなら
レイアウト・デザインの教科書 単行本 – 2019/2/23
米倉 明男 (著), 生田 信一 (著), 青柳千郷(ベーコン) (著)
あるあるデザイン〈言葉で覚えて誰でもできるレイアウトフレーズ集〉 単行本（ソフトカバー） – 2019/1/18
ingectar-e (著)
っぽくなるデザイン 誰でもできるかっこいいレイアウト集 単行本（ソフトカバー） – 2020/3/3
ingectar-e (著)
余白を学びたいなら
けっきょく、よはく。 余白を活かしたデザインレイアウトの本 単行本 – 2018/7/20
ingectar-e (著)
あたらしい、あしらい。 あしらいに着目したデザインレイアウトの本 単行本 – 2020/8/31
ingectar‐e (著)
やってはいけないデザインを学びたいなら
やってはいけないデザイン 単行本（ソフトカバー） – 2016/12/17
平本 久美子 (著)
知識を学びたいなら
デザイン入門教室[特別講義] 確かな力を身に付けられる ~学び、考え、作る授業~ (Design&IDEA) 単行本 – 2015/7/1
坂本 伸二 (著)
配色を学びたいなら
配色デザイン良質見本帳 イメージで探せて、すぐに使えるアイデア集 単行本 – 2019/12/20
たじま ちはる (著)
定番レイアウト素材集 チラシ、カード編 (日本語) 単行本（ソフトカバー） – 2018/2/8
タイポグラフィ編集部 (編集), フレア編集部 (編集)
定番レイアウト素材集 本、パンフレット編 (日本語) 単行本（ソフトカバー） – 2018/3/8
タイポグラフィ編集部 (編集), フレア編集部 (編集)
失敗しないカラーリング 知っておくと役立つ色のあれこれ 単行本 – 2021/3/9
桜井 輝子 (著)
失敗しないカラーリング 知っておくと役立つ色のあれこれ 単行本 – 2021/3/9
桜井 輝子 (著)
オンスクリーン タイポグラフィ 事例と論説から考えるウェブの文字表現 (日本語) 単行本 – 2021/2/17
文字の扱い方が特徴的なWebサイトの事例約80 例を紹介。
オンスクリーン タイポグラフィ 事例と論説から考えるウェブの文字表現 (日本語) 単行本 – 2021/2/17
どうする?デザイン クライアントとのやりとりでよくわかる! デザインの決め方、伝え方 (日本語) 単行本（ソフトカバー） – 2021/1/18
ingectar-e (著)
ヒアリングから、ラフ、提案、修正、校了まで、
クライアントとデザイナーの会話をベースに、
実戦形式で解説していくので、
コミュニケーションでつまづくことが多い方にも
わかりやすく理解できます。
どうする?デザイン クライアントとのやりとりでよくわかる! デザインの決め方、伝え方 (日本語) 単行本（ソフトカバー） – 2021/1/18
ingectar-e (著)
目的別にデザインが探せて、すぐに使える！
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザインに関わる全ての人へ
創造力を高める最新良質サイト415選！
優れた実例を見ることは発想（アイデア）を生み出す糧（かて）になる！
［印象／配色／業種／レイアウト／書体／トレンド／パーツ別］
これからはじめる人に！
打ち合わせのお供に！
困った時のアイデア出しに！
デザインは見て学ぶ
本書は415点の厳選した良質なWebサイトを集めた見本集です。
レイアウト、配色、フォント、素材、プログラムなど、ページを構成しているデザインパーツまで分解して解説しているので、Webサイトを見るだけではわからなかった「デザインの魅力の理由」がわかり、サイトの制作にもすぐに活用できます。
「アイデアが見つからない」「イメージはあるけど、何が必要で、どうつくればいいかわからない」といった時に必見の価値あり。パラパラめくって好きなページを見つけ出し、デザイン制作に役立ててください。
本書の対象読者
デザインのアイデアが見つからない方
デザインの制作に自信が持てない方
クライアントと打ち合わせする際に方向性となる見本が欲しい方
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
Manaさん「1冊ですべて身につくHTML & CSSとWebデザイン入門講座」の続編が出版されるみたいです。CSSやJavaScriptを使っての動きやレイアウト組み、またSassを使った、より実践向けの解説本
ほんの一手間で劇的に変わるHTML&CSSとWebデザイン実践講座 (日本語) 単行本（ソフトカバー） – 2021/2/20
Mana (著)
Chapter 1 最初に知っておこう! Webサイトの基本と必携ツール
Chapter2 ランディングページで学ぶ「レスポンシブWebデザインとフォント」
Chapter3 ブログサイトで学ぶ「装飾とカラムレイアウト」
Chapter4 コーポレートサイトで学ぶ「表組み、フォーム、JavaScript」
Chapter5 イベントサイトで学ぶ「特定ページ作り方とアニメーション」
Chapter6 ギャラリーサイトで学ぶ「動画と画像の使い方」
Chapter7 HTMLやCSSをより早く、より上手に管理できる方法
Chapter8 サイトの投稿と問題解決
1冊ですべて身につくHTML & CSSとWebデザイン入門講座 単行本 – 2019/3/16
Mana (著)
配色アイデア手帖 世界を彩る色と文化(DL特典:世界の配色MAP) (日本語) 単行本 – 2020/5/29
【予約特典あり】見てわかる、迷わず決まる配色アイデア 3色だけでセンスのいい色 (日本語) 単行本（ソフトカバー） – 2020/6/12
Webサイト・リニューアル 「見た目だけ変えた」にしない成功の手引き (日本語) 単行本（ソフトカバー） – 2020/4/27
Webサイト・リニューアル 「見た目だけ変えた」にしない成功の手引き (日本語) 単行本（ソフトカバー） – 2020/4/27
Webディレクションの新・標準ルール 改訂第2版 現場の効率をアップする最新ワークフローとマネジメント (日本語) 単行本（ソフトカバー） – 2020/3/17
初心者からちゃんとしたプロになる HTML+CSS標準入門〈モバイルファースト、レスポンシブ、Flexbox〉 (日本語) 単行本（ソフトカバー） – 2020/2/26
Webサイトを制作するノウハウの学習を「1日30分からはじめる」をテーマに、やさしく・しっかりと伝える本。
タイプや難易度の異なる5つのサンプルサイトを題材に、作り方のノウハウを解説しています。
HTML+CSSの基本から、FlexboxやCSSグリッドといった“流行り”の手法の使い方・使いどころがわかります!
初心者からちゃんとしたプロになる HTML+CSS標準入門〈モバイルファースト、レスポンシブ、Flexbox〉 (日本語) 単行本（ソフトカバー） – 2020/2/26
CSS設計完全ガイド ~詳細解説+実践的モジュール集 (日本語) 単行本（ソフトカバー） – 2020/2/27
CSS設計完全ガイド ~詳細解説+実践的モジュール集 (日本語) 単行本（ソフトカバー） – 2020/2/27
だれでもレイアウトデザインができる本[新装版] (日本語) 単行本（ソフトカバー） – 2019/12/15
今日から役立つアイデアを満載! Illustrator魔法のレシピ (日本語) 単行本 – 2020/2/10
思い描いた世界を作る Photoshopレタッチ・加工 魔法のレシピ (日本語) 単行本 – 2020/2/10
世界一わかりやすい Illustrator 操作とデザインの教科書 ［改訂3版］ (日本語) 単行本（ソフトカバー） – 2020/2/27
デザイナーのためのプロトタイピング入門 単行本 – 2019/7/23
Webデザイン知識 入門編: Webサイト制作の学習を始めるときに一番はじめに読んでほしい本 (MyISBN – デザインエッグ社) オンデマンド (ペーパーバック) – 2019/11/18
[新版]デザイナーになる! 伝えるレイアウト・色・文字の大切な基本と生かし方 単行本（ソフトカバー） – 2019/5/27
はじめてのWebデザインの教科書 まずは押さえておきたいWebの原則 Kindle版
初心者からちゃんとしたプロになる Webデザイン基礎入門〈HTML、CSS、レスポンシブ〉 単行本（ソフトカバー） – 2019/9/25
はじめるデザイン 知識、センス、経験なしでもプロの考え方&テクニックが身に付く 単行本（ソフトカバー） – 2019/4/11
あるあるデザイン〈言葉で覚えて誰でもできるレイアウトフレーズ集〉 単行本（ソフトカバー） – 2019/1/18
内容紹介
そうだ、「丸インパクト」でいこう！ 言葉で覚えて誰でもできるレイアウトフレーズ考えました。
本書はデザインでよく使う手法を、豊富な作例とともにワンフレーズで紹介したレイアウトフレーズ集です。写真をうまく使ったレイアウトを組みたい、イラストを活かしたい、文字だけで魅力的なデザインを作りたい……、そんなときにパッと思い出したいあるあるなデザイン手法を45個のワンフレーズにまとめました。
例えば、「丸インパクト」で情報を目立つようにしよう！ 「さんかく散らす」でおしゃれな雰囲気に！ そんな風にフレーズで覚えて活用することができれば、デザインの引き出しも増え、パッと簡単にレイアウトができるようになります。
また、本書に掲載している作例は合計270点！ ポスター、広告、ショップカード、装丁など種類も豊富です。それぞれいくつかの手法を組み合わせて作ったものなので、応用デザインの参考として役立つものばかりです。ぜひデザインのお共として、この一冊をお楽しみください。
ほんとに、フォント。 フォントを活かしたデザインレイアウトの本 単行本（ソフトカバー） – 2019/2/20
ingectar-e (著)
けっきょく、よはく。 余白を活かしたデザインレイアウトの本 単行本 – 2018/7/20
なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉 単行本 – 2015/7/31
ノンデザイナーズ・デザインブック [第4版] 単行本（ソフトカバー） – 2016/6/30
Webデザイン・スタンダード 伝わるビジュアルづくりとクリエイティブの最新技法 単行本（ソフトカバー） – 2018/12/26
内容紹介
いま知っておくべき、現場のWebデザイン。
「Webデザイン」という言葉が指す仕事の領域は、かつてないほど広がっています。従来はパソコンで見るWebサイトのビジュアルを、画像ベースで制作すれば事足りました。しかし近年は、スマートフォンの小さい画面で、「外出先」や「通勤電車の中」といった様々な使用場面が存在することを想定しながらデザインを考える必要があります。そこでは、画像では表現しきれない細かなUIとインタラクションの設計も重要になりますし、ユーザー心理を把握するUXデザインの視点も理解しておかなくてはなりません。
Introduction|Webサイトができるまで
Chapter1|レイアウト
Chapter2|配色
Chapter3|UXデザイン
Chapter4|UI・グラフィックデザイン
Chapter5|モーションデザイン
かわいいデザイン 単行本（ソフトカバー） – 2019/6/18
配色デザイン インスピレーションブック 単行本 – 2018/7/24
内容紹介
「直感(インスピレーション)」で見つける
新感覚の配色デザイン書
デザインの基本ノート 仕事で使えるセンスと技術が一冊で身につく本 単行本 – 2018/7/21
内容紹介
仕事で使えるセンスと知識が身につく!
デザイナーの心構えから、今の現場で使える知識まで
プロのデザイナーになるためのすべてのノウハウがここにある!
・アイデアの出し方
・デザインの作り方
・入稿データのチェックの仕方
・デザイン料の算出の仕方
・デザインのプレゼンなど
クライアントに「できる! 」と思われる
デザインの現場の仕事術が満載。
本書の対象読者
・これからデザインのことを学びたい人
・プロとしてのデザイン制作に自信がない人
・一冊でデザイナーになるための知識を学びたい人
HTML5+CSS3の新しい教科書 改訂新版 基礎から覚える、深く理解できる。〈レスポンシブWebデザイン対応〉 単行本（ソフトカバー） – 2018/8/27
Lesson 1 Webサイトの構造を理解する
Lesson 2 制作に入る前の準備
Lesson 3 HTMLでページの骨格をつくる
Lesson 4 HTML&CSSの基本ルール
Lesson 5 文字・見出し・段落の設計
Lesson 6 リンクと画像の設定
Lesson 7 リストとテーブルを組む
Lesson 8 ナビゲーションをつくる
Lesson 9 フォームをつくる
Lesson 10 Webページをレイアウトする
Lesson 11 HTML5+CSS3の新機能
Lesson 12 実践編:レスポンシブサイトをつくる
本当によくわかるHTML&CSSの教科書 はじめての人も、挫折した人も、本格サイトが必ず作れる 単行本 – 2018/9/21
鈴木 介翔 (著)
2万回のA/Bテストからわかった 支持されるWebデザイン事例集 単行本（ソフトカバー） – 2018/7/25
最新ブラウザ対応で気持ちよく書くCSSデザイン Chrome、Safari、Firefox、Edge、Internet Explorer 11対応! (技術書典シリーズ(NextPublishing)) オンデマンド (ペーパーバック) – 2018/7/20
実習で身につく!新しいWebデザインの教科書~基礎から学べるHTML&CSSデザイン~ (SCC Books 408) 単行本 – 2018/3/19
境 祐司 (著)
内容紹介
Webデザインを基礎から習得、コスパ最強の1冊!
Webデザイン、HTML、CSSの基礎、Webレイアウトの基礎と応用などを、図と写真を用いて基礎から詳しく説明しています。
数多くの実習課題を掲載しましたので、ウェブサイトを実際に作成しながら学習できます。
また、最近ではパソコン、スマートフォン、タブレットなど、ウェブサイトを閲覧するアイテムが多様化しています。
異なる画面サイズでもレイアウトやデザインを見やすく調整する「レスポンシブウェブデザイン」についても100ページにわたり、随所で解説しています。
もちろんソーシャルメディアとの連携方法も解説!
自作のウェブサイトを客観的に評価する方法とチェックシートも掲載しましたので、よりわかりやすく見やすいウェブサイト作成にお役立てください。
CSSグリッドレイアウト デザインブック 単行本（ソフトカバー） – 2018/6/15
エビスコム (著)
Gitが、おもしろいほどわかる基本の使い方33 改訂新版〈バージョン管理、GUI、Sourcetree、Bitbucket〉 単行本（ソフトカバー） – 2019/6/28
いちばんやさしいGit&GitHubの教本 人気講師が教えるバージョン管理&共有入門 (「いちばんやさしい教本」シリーズ) 単行本（ソフトカバー） – 2018/12/14
ノンプログラマーなMacユーザーのためのGit入門 〜知識ゼロでスタート、ゴールはGitHub〜 単行本 – 2019/5/28
いちばんやさしい Git 入門教室 単行本 – 2019/8/23
サルでもわかるGit入門 単行本（ソフトカバー） – 2018/9/25
内容紹介
Git入門の決定版「サルGit」がついに書籍化!
圧倒的な分かりやすさでバージョン管理を使いこなそう
本書は、コレまでにGitを触ったことが無い方。もしくは一度勉強しようと思ったが、どうも手につかず普段はGitを利用していない。というような方々に向けたGitの操作を一から学べる内容となっています。
無料のGitクライアントソフト「Sourcetree」と「Backlog」に含まれているGit機能を用いた手順を丁寧に解説しています。
わかりやすさはそのままに、コマンドラインの利用が苦手なユーザーにも親しみやすくGitの操作を紹介しています。
さあ、一緒にGitを学んでいきましょう。そして皆さんの仕事がより良く、進められますように。
Webポートフォリオ・デザインブック SNS時代のクリエイティブの見せ方・伝え方 単行本（ソフトカバー） – 2018/2/27
内容紹介
自分の作品を世界中に発信! 作品や“あなた自身”を売り込むノウハウがわかる本
イケてるWeb系エンジニアを目指すなら抑えておきたい”Sass”の超基礎知識 Kindle版
「Sassって何？」「何が出来るの？」「何が優れているの？」と言うレベル感の人を対象とした入門書です。
既にSassについて少しでも学んだことがある人にとってはあまり価値の無い内容になっていると思いますので、予めご了承ください。
また、何らかのプログラミング言語やWebシステム開発の経験者を対象としているので、その点もご注意ください。
１．Sassを知る
Sassとは
SASSとSCSS
PlayGround
開発環境
２．最低限のことを覚える
ネスト
コメント
変数
演算
親セレクタの参照
インポート
３．少し踏み込んだことを覚える
データ型
条件分岐
繰り返し
関数の利用
関数の自作
スタイルの継承
Mixin
補完
変数の振る舞いを変える
４．組み込み関数を覚える
文字列の操作
数値の操作
色（RGB）の操作
色（HSL）の操作
セレクタの操作
その他
Webデザインのロジック 同業者に語りたくなるコンテンツイメージとブランディングのひみつ 単行本（ソフトカバー） – 2018/2/26
内容紹介
Webサイトをロジカルに分析すれば、デザインや構成のセンスは自然と身に付く!
Webを支える技術 -HTTP、URI、HTML、そしてREST (WEB+DB PRESS plus) 単行本（ソフトカバー） – 2010/4/8
HTML5 & CSS3 デザインレシピ集 単行本（ソフトカバー） – 2017/2/22
HTML&CSSとWebデザインが 1冊できちんと身につく本 大型本 – 2017/7/21
HTML5&CSS3標準デザイン講座 30LESSONS【第2版】 単行本（ソフトカバー） – 2019/5/24
ロゴデザインのロジック 同業者に語りたくなるグラフィックとブランドイメージの関係性とひみつ 単行本（ソフトカバー） – 2018/1/27
内容紹介
センスのある・なし関係なく、ロジカルにロゴデザインが理解できる！
いちばんよくわかるWebデザインの基本きちんと入門 レイアウト/配色/写真/タイポグラフィ/最新テクニック (Design&IDEA) 単行本 – 2017/2/25
色の辞典 単行本 – 2018/3/16
いちばんよくわかるHTML5&CSS3デザインきちんと入門 (Design&IDEA) 単行本 – 2016/10/27
狩野 祐東 (著)
Webデザイン、これからどうなるの? キーワードから探るデザイン動向の現在と未来 単行本（ソフトカバー） – 2018/1/17
Webサイト、これからどうなるの? キーワードから探るWeb制作の未来像 単行本（ソフトカバー） – 2017/9/20
ノンデザイナーでもわかる UX+理論で作るWebデザイン 単行本（ソフトカバー） – 2017/9/26
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
Webデザイン良質見本帳 読んでみた。
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
目次は、このような感じです。
本書の使い方では、テーマ、テーマのまとめ、本文、URL、ポイント、実例サイトなど
PART0 Webデザインの基礎知識
PART1 印象から考えるデザイン
PART2 配色から考えるデザイン
PART3 業種・ジャンル別から考えるデザイン
PART4 レイアウトや構図から考えるデザイン
PART5 素材・フォント・プログラムを使ったデザイン
PART6 トレンドのデザイン
PART7 パーツ別デザイン
久保田 涼子さんは、動くWebデザインアイディア帳の本も出してます。
自分も持ってますが、おすすめな本です。
ただ、jQueryを使って実装されてます。
動くWebデザインアイディア帳 単行本 – 2021/2/27
久保田涼子 (著), 杉山彰啓 (著)
「サイトに動きをつける時、同じ内容を何回も検索をしてソースコードを探している」
「サイトで見つけたソースコードをそのままコピペしてみたけど、動かない」
本書はWebサイトを動かすことが苦手な右脳系ウェブデザイナーが、サイトを動かす第1歩を踏み出すための「動きの逆引き事典」です。
動くWebデザインアイディア帳 単行本 – 2021/2/27
久保田涼子 (著), 杉山彰啓 (著)
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザインは「印象」と「機能」からできています。
Webサイト全体に関わる基礎を、まとめました。
Webデザインの基礎知識
01デザインってなんだろう？
デザイン
実用的なもの
人に情報や目的を伝える
客観的
なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉 単行本 – 2015/7/31
アート
自己表現
万人に理解されてなくても成り立つ
主観的
印象
機能
Webデザイン
02Webデザイナーの役割
Webデザイナーは、クライアントがイメージするゴールを反映させたストーリーを作り、情報設計やデザイン、動きに落とし混んでターゲットユーザーに発信していきます。
Webデザイナーの仕事を楽にする! gulpではじめるWeb制作ワークフロー入門 単行本（ソフトカバー） – 2018/4/13
03紙デザインとWebデザインの違い
CMYKとRGB
Webページの構成とワークフロー
01基本的なWebページの構成
WebページはPhotoshopなどで作ったデザインを元に、HTMLという言語で組み立て制作します。
02ワークフロー
使用するツールなど載ってます。
Webページに入るデザインパーツ
01Webページの基本的な構造
①ヘッダー
②グローバルナビゲーション
③メインカラム
④フッター
など
参考サイト
http://thefathatter.com/
02レイアウトの4つの法則
近接、整列、反復、コントラストなど
03人の視線の流れ
04Webページの基本的な構造
レイアウトデザイン見本帳 レイアウトの意味と効果が学べるガイドブック 単行本（ソフトカバー） – 2017/4/18
Webサイトで扱う画像
01Webサイトで扱う画像の形式
ビットマップデータ形式
ベクターデータ形式
02解像度とカラーモード
Webデザインとタイポグラフィ
01読みやすいサイトを作る
フォントの基本
フォントの種類
行間
色彩の基礎知識
01光りの三原色と色料の三原色
色の持つイメージ
色や配色の参考サイト
色カラー
https://iro-color.com/
ほか
配色アイデア手帖 めくって見つける新しいデザインの本[完全保存版] 単行本 – 2017/12/16
配色アイデア手帖 日本の美しい色と言葉 心に響く和のデザインがつくれる本[完全保存版] 単行本 – 2018/12/21
桜井 輝子 (著)
配色スタイル ハンドブック 単行本 – 2018/1/30
配色の基礎知識
01色から考える配色
Webデザインの参考サイト
I/O 3000
https://io3000.com/
など
「キュート」や「高級感」といったデザインの印象は、何からつくられているのでしょうか？
解説や色など載ってます。
01キュートで可愛いデザイン
http://baybirds-okame.com
本では、参考サイトのURLなどが載ってますが、
サイトのURLが、httpがhttpsに変更になってるサイトなどもあり
（逆もあり）それで表示されるならまだ、いいですが、
本のとおりに、httpsで入力すると、エラーで、サイトが表示されない。またこのサイトにアクセスできない表示もあります。
02ポップで元気あふれるデザイン
アクセスできない
http://www.ohtakegakuen.ac.jp
03エレガントで気品に満ちたデザイン
https://bijoupiko.com
04ナチュラルで優しいデザイン
http://kamino-mf.com
05クールで先進的なデザイン
アクセスできない
https://wordpress.metaphorcreations.com/delicious/
06信頼感があるデザイン
https://www.unionnet.jp
07ヴィンテージ風で憧れるデザイン
http://www.lamourfou.be
08クラシックで格調高いデザイン
http://www.t-museum.jp
など
ロイヤリティ、フリーの写真素材サイト
Webデザインの配色は
「ベースカラー」
「メインカラー」
「アクセントカラー」
の3色を決めるころからスタートします。
Webページの基本的な構造
メインカラーを決める
ベースカラーを決める
アクセントカラーを決める
01ロゴやブランドカラーから考える配色
02黄を基調とした配色
03橙を基調とした配色
04赤を基調とした配色
05ピンクを基調とした配色
06紫を基調とした配色
07青を基調とした配色
08緑を基調とした配色
09茶を基調とした配色
10白やグレーを基調とした配色
11黒を基調とした配色
12トーン合わせた配色
配色ジェネレーターとブラウザアドオン
など解説
HUE / 360
https://hue360.herokuapp.com/
サイトの業種やジャンル別に、共通して入っている情報の設計方法、機能、色、レイアウトの傾向など多角的に見て分析しています。
01レストラン・カフェサイト
チャンピオンカレー
http://chancurry.com/
02医療・病院サイト
03ファッションサイト
04美容室・エステサイト
05アートフェス・イベントサイト
06音楽サイト
07アニメ・ゲームサイト
08士業サイト
09学校・幼稚園サイト
10ポートフォリオサイト
11ニュース・ポータルサイト
12ECサイト
13コーポレートサイト
14スポーツ・フィットネスサイト
15ランディングページ
目的に合わせた情報設計とデザインの組み立て方
など
PC、タブレット、スマートフォンなど、サイトを表示するデバイスの種類やサイズに合わせ、Webデザインのレイアウトは日々進化しています。
01グリッドレイアウト
kinfolk
https://kinfolk.com/
02 カード・タイル型のレイアウト
03 1カラムのレイアウト
04 2カラムのレイアウト
05 カラムを組み合わせたレイアウト
06 フルスクリーンレイアウト
07 グリッドから外したレイアウト
08 フリーレイアウト
レイアウトに取り入れた4つの法則
など
写真やイラストといった素材を使ったサイトの見せ方やフォントで内容を魅力的に魅せているサイト
01写真をメインに使ったデザイン
横浜DeNAランニングクラブ
https://dena.com/running/
02切り抜き写真を使ったデザイン
03テクスチャを使ったデザイン
04飾りパーツを使ったデザイン
05イラストを使った親しみやすいデザイン
06タイポグラフィを使ったデザイン
07動画を効果的に使ったデザイン
08動きを持たせたデザイン
09インフォグラフィックで伝えるデザイン
Font Awsomeの導入方法
の仕方など解説
Webデザインはトレンドが日々変化し続けています。
01レスポンシブWebデザイン
株式会社グッドライフ
http://goodlife-inc.co.jp/
02Webフォント
03スプリットスクリーン
04フラットデザインとマテリアルデザイン
05マイクロ・インタラクション
06ヒーローヘッダー
07パララックス
08デュオトーン
09横書きのレイアウト
更新システムとして使われるWordPress
ヘッダーやフッター、見出しなどのデザインをパーツ別で分析
01ヘッダー
PART7の、パーツ別デザインとかで、参考のURLが載ってますが、
中には、サイト名が載ってないので、
URLだけの記載だとURLの文字が小さくて見えないです。
また、パーツ、パーツだけなので、出来れば、実際にダウンロードで素材などあるといいかもです。
やっぱりWebデザインって20代の職業なのかな。と。
またURLが間違っている？変更になってるサイトもあります。
出来れば、サイト名などは、全部、記載してほしいかも。
02グローバルナビゲーション
03見出し
04ボタン・ページトップリンク
05テーブル
06フォーム
07フッター
ファビコンの設置方法
など解説
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
目的別にデザインが探せて、すぐに使える!
目的別に探せて、すぐに使える
Webデザインのアイデア集
Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集 単行本 – 2017/6/16
久保田 涼子 (著)
