【2020版】HTML/CSS本「人気ランキング20 / おすすめ参考書9選」

Web制作の基本中の基本である「HTML/CSS」。

PHPやRuby、JavaScriptなどもあれど、結局はWebサイトはHTMLとCSSで表示されています。

Web上でコンテンツを公開・開発するなら、一定以上の知識は必須といえるのがこのHTML/CSS。

Web制作でも、Webデザイナーでも、ブロガーでも、すなわちWebに関わる人全てが知っておきたい「HTML/CSS」、そのの参考書を人気/評価とともに紹介していきまっす。

 

 
Kindle Paperwhite
発売日 2018/11/07
通常 13,980円
現在 13,980円

 

 

Kindle Unlimited 1ヶ月無料

kindle_unlimited_sale
 
  • 1ヶ月無料で読み放題
  • 1ヶ月以内でも解約可能
  • 解約後も1ヶ月まで利用可


    

HTML/CSS本「人気ランキング」

HTML/CSSの今売れ筋本を人気ランキングで一覧したのが以下。

ランキングは日々更新されていますので、最新の人気が反映されています。

 

(2020/10/30 更新)
売筋
Rank
製品評価
1
1冊ですべて身につくHTML & CSSとWebデザイン入門講座 (DL特典: CSS Flexbox チートシート)...
発売日 2019/03/16
通常    2,486円
単行本   2,486円 (+44pt)
Kindle   2,237円 (+22pt)
(4.3)
総評価数 276件
2
(4)
総評価数 7件
3
ゲームで学ぶJavaScript入門 HTML5&CSSも身につく!
発売日 2015/12/11
通常    2,640円
単行本   2,640円 (+54pt)
Kindle   2,178円 (+22pt)
Kindle Unlimited(読み放題)
(3.9)
総評価数 27件
4
(3.6)
総評価数 17件
5
【特典付き】HTML5&CSS3デザイン 現場の新標準ガイド【第2版】 (Compass Booksシリーズ)...
発売日 2020/10/23
通常    3,289円
単行本   3,289円 (+58pt)
Kindle   3,289円 (+33pt)
(0)
総評価数 0件
6
できるホームページHTML&CSS入門 Windows 10/8.1/7対応 できるシリーズ...
発売日 2017/02/17
通常    1,738円
単行本   1,738円 (+34pt)
Kindle   1,406円 (+14pt)
Kindle Unlimited(読み放題)
(4.3)
総評価数 12件
7
(3.6)
総評価数 4件
8
(4.4)
総評価数 41件
9
スラスラわかるHTML&CSSのきほん 第2版
発売日 2018/04/14
通常    2,178円
単行本   2,178円 (+38pt)
Kindle   1,960円 (+20pt)
(4.3)
総評価数 89件
10
これからWebをはじめる人のHTML&CSS、JavaScriptのきほんのきほん...
発売日 2017/03/27
通常    2,838円
単行本   2,838円 (+50pt)
Kindle   2,554円 (+26pt)
(4)
総評価数 32件
11
HTML&CSSとWebデザインが 1冊できちんと身につく本
発売日 2017/07/21
通常    2,508円
単行本   2,508円 (+44pt)
Kindle   2,508円 (+25pt)
(4.1)
総評価数 58件
12
HTML & CSS3 レイアウトブック
発売日 2016/12/20
通常    2,838円
単行本   479円
Kindle   2,838円 (+28pt)
Kindle Unlimited(読み放題)
(3.3)
総評価数 4件
13
(4.3)
総評価数 18件
14
(3.6)
総評価数 47件
15
世界一わかりやすい HTML5&CSS3コーディングとサイト制作の教科書...
発売日 2019/03/01
通常    2,948円
単行本   2,948円 (+52pt)
Kindle   2,801円 (+28pt)
(4.2)
総評価数 45件
16
フレキシブルボックスで作る HTML5&CSS3レッスンブック
発売日 2019/03/18
通常    2,860円
単行本   2,860円 (+29pt)
Kindle   2,599円 (+26pt)
(4.5)
総評価数 8件
17
(3.6)
総評価数 17件
18
HTML5 & CSS3 デザインレシピ集
発売日 2017/02/22
通常    3,025円
単行本   3,025円 (+54pt)
Kindle   2,874円 (+29pt)
(3.8)
総評価数 23件
19
作りながら学ぶ HTML/CSSデザインの教科書
発売日 2013/12/13
通常    2,772円
単行本   2,762円 (+33pt)
Kindle   2,772円 (+28pt)
(3.8)
総評価数 46件
20
HTML5&CSS3標準デザイン講座 30LESSONS【第2版】
発売日 2019/05/24
通常    2,838円
単行本   2,838円 (+125pt)
Kindle   2,554円 (+26pt)
(4.4)
総評価数 13件

 

以降でおすすめ・注目の本をピックアップしていきまっす。

ちなみに、Kindle版のある本ならサンプル送信で試し読み可能。大概目次まで見れるので、内容の概要もつかめるので、サンプル試読おすすめです。

 

基礎から学ぶ!「HTML/CSSおすすめの入門書」

Web制作未経験かつプログラム未経験の方は、まずは何よりもとっつきやすさや、わかりやすさを重視して、途中で折れないこと、意外と簡単なんだと自信をつけることが重要。

そのため、以下のような読みやすい入門書から初めて見るのがおすすめです。

ちなみにぼくは 「いちばんよくわかるHTML5&CSS3デザインきちんと入門 (Design&IDEA)」 で最初は勉強しました。

スラスラわかるHTML&CSSのきほん 第2版

ベストセラーが大改訂!

※この電子書籍は、「固定レイアウト型」で配信されております。説明文の最後の「固定レイアウト型に関する注意事項」を必ずお読みください。

4万人が学んだベストセラーが、5年ぶりの大改訂!

小さなサイト作りを通してHTMLとCSSの基礎が学べる入門書の決定版!
第2版ではPCだけでなくスマホやタブレットにも対応したサイトが完成します。
ソースコードは現在のトレンドに合わせ、解説もいっそう丁寧にわかりやすくなりました。

これからWeb制作を始める人にも、HTML/CSSを学び直したい人にもおすすめの、充実の内容です!

最新HTML5.2準拠。Windows/Mac対応

●目次
chapter01 Webサイト制作を始める前に
 01 Webサイトとその構成要素
 02 Webブラウザの機能と種類 ほか
chapter02 HTMLの基礎
 01 HTMLはWebページを制作するための言語
 02 HTMLの基本的な書式 ほか
chapter03 制作の準備と基本のHTML
 01 Webサイト制作の準備
 02 すべてのHTMLで共通するタグ
chapter04 見出し、段落、リスト
 01 見出しテキスト
 02 テキストの段落 ほか
chapter05 リンクと画像の挿入
 01 サイト内リンクと相対パス
 02 外部サイトへのリンクと絶対パス
 03 画像の表示 ほか
chapter06 2ページ目以降を効率的に作成する
 01 index.html以外のファイルの作成
 02 段落にテキストと画像を含める
 03 テキストを太字にする・改行する ほか
chapter07 CSSの基礎
 01 HTMLの「見た目」を整えるCSS
 02 CSSの基本的な書式
 03 主なセレクタと書き方 ほか
chapter08 CSSでページのスタイルを調整
 01 背景色の設定
 02 テキスト色、フォントサイズの設定
 03 マージン、ボーダー、パディング ほか
chapter09 フロートとテーブルのスタイル
 01 テキストの回り込み
 02 テーブルの整形 ほか
chapter10 フォームの作成
 01 フォームの基礎知識
 02 お問い合わせページの概要
 03 フォーム全体の親要素 ほか
chapter11 モバイル端末に対応する
 01 レスポンシブデザイン
 02 ビューポートの設定
 03 画像をレスポンシブデザインに対応させる ほか
chapter12 Webサイトの公開
 01 Webサイト公開までの準備
 02 Webサーバーに接続 ほか

固定レイアウト型に関する注意事項(必ずお読みください)
この電子書籍は、全ページ画像の「固定レイアウト型」で配信されております。以下の点にご注意し、購入前にプレビュー表示をご確認の上、ご購入ください。

■使用できない機能
・文字拡大(ピンチイン・ピンチアウトは可能ですが、画面におさまらない場合は画面をスワイプ)/文字のコピー/マーク/ハイライト/文字列検索/辞書の参照/Web検索/引用

■推奨環境
・タブレットなど大きいディスプレイを備えた端末
・Wi-Fiネットワーク経由でのダウンロード(Kindle端末の場合)

↓全て表示↑少なく表示
 
目次

(引用元Amazon)

 
Users Voice
HTMLとCSSの勉強をしようと思って買った本です。
基本的にわかりやすく、説明も丁寧でいいです。しかし、あまりにもスラスラ読まてしまい理解する努力を怠ると、最後の方には何も残りません。
入門書としては完璧ですが読む人の努力度によってどれほどマスターできるかが変わります。しかし1週間ちょっとで1周は読めるので、1か月間でヘビロテすれば完璧です! (参考:Amazon)

↓全て表示 ↑少なく表示
webサイト作成の「体験」をするという意味ではとても簡単でスラスラ進めます。
読み終えた後はなるべく本を見ないで自分だけで同じようなページを作ることでコーディング作業にもそこそこ慣れます。
まずはこの本から入り本格的にHTML、CSS、その他のプログラミング言語を学ぶといいと思います。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
スラスラわかるHTML&CSSのきほん 第2版
発売日 2018/04/14
通常 2,178円
現在 1,960円
218円(10%)OFF!!

  

いちばんよくわかるHTML5&CSS3デザインきちんと入門 (Design&IDEA)

これから本気で学びたい人の最高の教科書!

レスポンシブWebデザインが“当たり前"の時代の、新しいHTML・CSSの書き方ガイド

現在のHTML・CSSの書き方は、少し前までのHTML・CSSの書き方とは大きく変わっています。本書ではスマートフォン時代に求められる、HTMLを組むときの考え方からCSSの実践的なテクニックまでをきちんと解説。たくさんのサンプルコードに触れていただくことで、最新の、実践で役立つ力がきちんと身につきます。

<本書の対象読者>
● これからWebサイト制作を学びたい初心者の方
● 最新のHTML・CSSの書き方を知りたい経験者の方
● フレックスボックスを使ったページレイアウトについて知りたい方

↓全て表示↑少なく表示
 
目次

(引用元Amazon)

 
Users Voice
現在web制作の現場では主流になりつつある(もうなっている?)flex-boxのコーディング方法がとても丁寧に解説されています。全体的に初心者向けの言葉を選びながらわかりやすく解説されています。意外とwebサイトのコーディング方法は十人十色で、ルールなどの基礎をしっかり固めたい、といったキャリアのある方にもとてもオススメです。スラスラとページをめくるのが進む書籍です。 (参考:Amazon)

↓全て表示 ↑少なく表示
他の方の評価にもあるように一つ一つの項目について非常に丁寧な説明がなされており、web初心者を想定してか html とはなんぞやというところから解説が始まります。新旧問わず定番のcssタグについてはもちろん、後半では現在主流になってきている「フレックスボックス」の作り方にも触れ、押さえておきたい最新の知識も学べるつくりです。本自体のデザインもオシャレでセンスのある人たちがつくったんだろうなという信頼も置けます。
一見すると欠点がないかのように見えますが、難をあげれば、よほどリリースを急いだのか校正担当者がザルだったのか誤字が多いことと、9章までの「こういう風に記述するんですよ」とサンプルを確認していく流れから、10章では「では実際に作成していきましょう」との文言があり実践的な練習作業ができるかと思いきや、完成したサンプルと工程途中のhtmlが用意されているだけで結局サンプルを眺めるだけで終わってしまうという何とも肩すかしな終わり方になっていることです。9章までも、読者にいくらか手を動かす余地を入れた方がただ読み眺めておしまい♫よりは習得度の実感も湧きやすいと思います。その点で「ー★」ですが、cssの基礎を学べる良書には間違いないと感じました。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
  

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

初心者からちゃんとしたプロになる Webデザイン基礎入門
(著)栗谷 幸助, おの れいこ, 藤本 勝己, 村上 圭
発売日 2019/09/25
(4.3)

この商品は固定レイアウトで作成されており、タブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。

〈電子書籍版に関する注意事項〉
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。

【1日30分からはじめる! プロを目指す人の新・スタンダード。】

WebデザインやHTML・CSSの学習を「1日30分からはじめる」をテーマに、やさしくしっかり解説した書籍。初学者の方が、プロのWebデザイナーを目指す上で必要となる基本的な知識や技術を体系的に学べます。“ちゃんとしたプロ”のWebデザイナーとしてスタート地点に立つために、最初に選んでいただきたい1冊です。

Webサイトの実制作のフローに沿い、本書の解説では、Webデザインの概論と制作に必要となるツールや素材・配色について学んだあと、HTML・CSSの基礎と実践を習得し、サイトの公開や運用に関する知識を身につけます。HTML・CSSの書き方を初歩から教えるだけにとどまらず、サイトを制作し、公開・運用していくために必要な基本知識をすべて解説しています。

また、各記事ごとに学習時間の目安を記載しており、授業や独習で学習教材として活用しやすい作りを目指しました。HTML・CSSの実践部分でサンプルサイトとして制作するのは、シングルページのシンプルなお店のサイトと、モバイルファーストの手法を取り入れたサイトの2つです。サンプルは学習用データとしてダウンロード提供します。

〈こんな方にオススメ〉
・初学者からプロのWebデザイナーやマークアップエンジニアを目指す方
・Webデザイン制作やHTML・CSSの知識を身につけたい方
・WebデザインやHTML・CSSの基本情報をアップデートしたい方

〈本書の章構成〉
○Lesson1 Webサイトの成り立ち
○Lesson2 Webサイトの枠組みを知る
○Lesson3 Webデザインに必要な素材
○Lesson4 HTMLをマスターする
○Lesson5 CSSをマスターする
○Lesson6 シングルページのサイトを作る
○Lesson7 レスポンシブ対応サイトを作る
○Lesson8 Webサイトを公開してみよう
○Lesson9 SNS連携とWebサイトの運用

↓全て表示↑少なく表示
 
目次

(引用元Amazon)

 
Users Voice
講師業としてwebデザイン+フロントエンドを教えています。
「webデザイン」のタイトルがつく本書には、フォトショップやXD, Sketch等のデザインツールやデザインの作り方の話はなく、「webデザイン」に関連する記述としては「webサイトで使う素材や技術」の基礎知識中心なので、その点は注意です。
「webデザインを学んでみよう」と思った方がHTMLやCSSという技術の壁にぶち当たってしまったときに、まず手にとってみるとよいのが本書です。後半では実際にページを2つ作れますので、理論→実践の流れとしても良いと感じました。
教えている側としても、前半の理論パートでは逆引き的に学生さんに使ってもらいつつ、後半でテストがわりではないですが、チャレンジしてもらえる流れを作れるので、初学者・初心者におすすめしてみようと考えています。 (参考:Amazon)

↓全て表示 ↑少なく表示
これからWebデザインを勉強したい人にオススメなのは言わずもがななのですが、そんな風に学習している最中の人に最適な知識と情報を届けるために、これは本当にバイブルになります。初学者の方だけでなく教える立場の人にもオススメの1冊。
自分にとって既知の知識を、より分かりやすく伝えるためのエッセンスがぎっしりです! (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
初心者からちゃんとしたプロになる Webデザイン基礎入門
発売日 2019/09/25
通常 2,750円
現在 2,613円
137円(5%)OFF!!

  

 

   

脱初心者!「HTML/CSS全体像をしっかり学ぶ書籍」

HTML5&CSS3デザイン 現場の新標準ガイド(特典PDF付き)

HTML5とCSS3をより深く理解し、使いこなしたい人のためのガイドブック

フロントエンドエンジニアの方や、Web制作に関わっていてHTML5/CSS3を使いこなしたい、と思っている人のためのガイドブックです。
思ったようなデザインをどう実現するか、現在の仕様がどのようになっているか、現時点で何に留意して制作を進めていけばよいか、制作の現場で必要不可欠な情報を凝縮しました。

現場でリファレンスとしてぜひ常備しておきたい、「現在」と「これから」の標準をまとめた1冊。
『HTML5スタンダード・デザインガイド』『CSS3 スタンダード・デザインガイド』『これからの「標準」を身につける HTML+CSSデザインレシピ』等でWebの仕様解説に定評のある著者の手による、渾身の最新刊です。

【内容】
Chapter 1 HTML
Chapter 2 Webページの作成とメタデータ
Chapter 3 コンテンツのマークアップ
Chapter 4 CSSの適用
Chapter 5 ボックスのレイアウト
Chapter 6 フレキシブルボックスレイアウト
Chapter 7 グリッドレイアウト
Chapter 8 テーブル
Chapter 9 テキスト
Chapter 10 エンベディッド・コンテンツ
Chapter 11 フォーム
Chapter 12 特殊効果

------------------------
期間限定! 特典PDF付きキャンペーン実施中! !

本書『HTML5&CSS3デザイン 現場の新標準ガイド』をAmazonにて
ご購入いただいた方に、特典PDFをプレゼントします! (Kindle版は対象外)

●特典PDFの申し込み方法や特典の詳細については、
「出版社からのコメント」欄掲載の当該キャンペーン紹介ページにてご確認ください。
当キャンペーンが始まる前に、すでに予約してくださった方もご応募いただけます。

●特典内容紹介
『HTML5&CSS3デザイン 現場の新標準ガイド​』要素/プロパティ&ブラウザ対応一覧(PDF)
今回ページ数の都合で入れられなかった「要素/プロパティ&ブラウザ対応一覧」のPDFをプレゼントします。
本文の参照ページも掲載してありますので、書籍と一緒にご活用ください。
この機会をぜひお見逃しなく!

↓全て表示↑少なく表示
 
目次

(引用元Amazon)

 
Users Voice
内容はコーディングに必要な基本的作業方法が得られるものだと思います。
文字も小さすぎず大き過ぎず。カラーを使って説明してありますが、淡い邪魔にならないカラーデザインの図で見易いと思います。
例えば「boxを上部で固定したい!」と思った時に、逆引き辞書の様には使えないと思います(使うコードが分かっていれば索引から引けます)。
時間がある時にパラパラっと目を通して置いて、付箋などで気になる箇所にマークしておき「あれはどうやって書くんだっけ?」となった時にサッと見てみる‥という使い方をしています。
使用したコードの使い方が、どのブラウザに対応してどのブラウザが非対応なのかアイコンで一目で分かるのが便利です。 (参考:Amazon)

↓全て表示 ↑少なく表示
セマンティックマークアップの概念から始まり、メタデータの記述、CSSの仕様の詳細へと、一冊によくまとめられています。
こういった内容はネットでも拾えるようなものだと思いますが、それに対する労力(情報の鮮度の確認や、正確さの判断、また書き手の冗長な文章や知りたいこととは異なる情報を読み飛ばすことなど)を考えるとこの本を一冊持っておく方が断然効率的だと思います。
flexやgridなど情報の鮮度もよく、何より紙面のデザイン、配色、アイコンでの表示などで、情報が認識しやすく良い本だと思います。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
HTML5&CSS3デザイン 現場の新標準ガイド(特典PDF付き)
発売日 2017/08/28
通常 4,655円
現在 3,289円
1,366円(29%)OFF!!

  

CSS設計完全ガイド ~詳細解説+実践的モジュール集

CSS設計の考え方と実践法が身につく

CSS設計は多くの現場で導入されていますが、いまだに悩みがつきません。プロジェクトの大小や性質によって最適解も変わってきます。
そこで本書は、CSSのさまざまな設計手法を紹介しつつ、考え方や実践のポイントを明確化します。そのうえでボタン、ラベル、カード、テーブル…といったウェブの定番的なモジュールを網羅的に取り上げ、さらにはそれらの組み合わせ方まで、実践的なコードを紹介します。
代表的な設計手法である「BEM」と、著者が開発した設計手法「PRECSS」によって対比的な解説を加えており、思考をなぞることで最適解が炙り出されることでしょう。
駆け出しのウェブ開発者、フロントエンドエンジニアの方に、ぜひ読んでいただきたい1冊です。

↓全て表示↑少なく表示
 
内容サンプル

(引用元Amazon)

 
Users Voice
以前、某CSS設計本を買いましたが、コードの説明をあまりうまく解説されておらず、
また、BEMなどの説明も少し、著者の提唱するCSS設計手法の宣伝本みたいなイメージを持ってしまい、
半分挫折して、自分流なコーディングルールでやっていました。

この本は違い、著者の提唱するCSS設計手法の話だけでなくBEMなど著者の提唱するCSS設計手法以外の説明を十分にされていること、CSSの基礎から説明しながら、CSS設計とは何ぞやを100ページ以上にわたり説明しています。

また具体的にどういうレイアウトになるかという説明やどういうCSSかというの説明も十分にされており、
横文字ばかりの説明を最小限に抑えているのもプラスです。

概念だけではなく実際に使われる具体的な方法もわかりやすく説明しているため、
CSSをある程度勉強した初心者が1歩進めたいときや、
コーダーの教育にも非常に役立ちそうな本な気がします。 (参考:Amazon)

↓全て表示 ↑少なく表示
前半はCSSの歴史から始まり、どのようなポイントを意識しながら設計すれば大規模な開発でも耐えられるか具体的なコードとともにわかりやすく説明されている。
後半は前半で紹介されたポイントと照らし合わせながら、BEMとPRECSSのコードが大量に記載されており、理解した後はそのままサンプル集としても流用できる作りになっている。

私は趣味でHTML+CSSを使っているがいつもCSSの影響範囲を制御しきれず困っていた。この本で具体的なポイントが理解できたので、今後の開発に活かせると思う。

分厚くてタイトルもお堅いが、中身は非常に読みやすかった。どのようにCSSを定義していけばカオスにならずに済むのか気になっている人は読んで損はない書籍だと思う。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
CSS設計完全ガイド ~詳細解説+実践的モジュール集
発売日 2020/02/27
通常 3,608円
現在 3,608円

  

 

サイトデザインのお手本に「デザイン参考書・レシピ本」

HTML5 & CSS3 デザインレシピ集

HTML5 & CSS3 デザインレシピ集
(著)狩野 祐東
発売日 2017/02/22
(3.8)

本書は、HTML5とCSS3によるWebサイト制作のための"おいしい"レシピ集です。
制作の現場で使われる定番テクニックから、プロ技まで余すところなく集めました。

テキスト/リスト/リンク/画像/ボックス/
テーブル/フォーム/ナビゲーション/
レイアウト/レスポンシブWebデザイン…

テーマ別にレシピを整理しているので、引きやすくなっています。
「あのデザインはどう作るんだろう?」が、スグにわかります。
デザイナーからWebプログラマーまで、Web制作に携わるすべての方にお届けします。

↓全て表示↑少なく表示
 
内容サンプル

(引用元Amazon)

 
Users Voice
現役のウェブデザイナーです。
デザインレシピ集と銘打たれているので高度な事例を期待しましたが、レベルは初心者向けのhtml逆引き事典です。
知っていて当たり前のことばかりですので、残念ながら得るものはありませんでした。
ただ、本自体はきれいにまとまっていて見やすいので初心者の方であれば有用なのかもしれません。

○良い点
・一つの表現でも複数のやり方が提示されている(レイアウトの方法でflexboxとfloat両方のやり方を載せているなど)

✕悪い点
・タイトル 解説詐欺。期待はずれです。基本的な内容で初心者向けであると明示していただきたかった。

本書の想定される活用シュチュエーション
・html cssの入門書1冊は終え本格的に自分のサイトを作ろうという初学者の副読本
かなと思います。 (参考:Amazon)

↓全て表示 ↑少なく表示
"デザインレシピ集" という言葉から通常想像するであろう内容とはかけ離れています。
かなり基本的なコードがほとんどです。むしろ、ここまで基本的なコードがデザインレシピ?
という感想で驚くべき書籍です。

本来ならタイトルと中身のずれもあり、レビュー評価は低くしたいところですが、
いやいや、この書籍は案外使えるのです。
なぜなら、その基本的なコードについて一つ一つかなり詳しく解説されているからです。
特に同じデザインをするにも状況別に数パターン書かれていて、現在主流の方法についても
理由とともに解説されていたりする。
これはWebデザインやコーディングを仕事としている方にも、よく読めば
知らなかったことや新しい発見も多いのではないでしょうか。

【良い点】
・基本コードについての解説が深い
・状況別のコードが用意されている
・基本中の基本が一通り学べる

【悪い点】
・タイトルから連想する書籍の内容と実際の内容にはかなり乖離がある。
あのデザインはどうやるんだろう、とか、魅力的なデザインを表現したりするための内容ではない

【まとめ】
・単純な基本コードをここまで網羅的に掘り下げて解説する書籍は皆無で、その意味で価値は高いです。
・やりたいデザインを逆引きするという使い方ではなく、基本コードの使い方を確認するのに向いています。
・初めてコードを学習する方が1つずつ練習していくのに向いています。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
HTML5 & CSS3 デザインレシピ集
発売日 2017/02/22
通常 3,025円
現在 3,025円

  

6ステップでマスターする 「最新標準」HTML CSSデザイン(固定レイアウト版)


※この商品は固定レイアウト型の電子書籍です。

※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。

※お使いの端末で無料サンプルをお試しいただいた上でのご購入をお願いいたします。

※本書内容はカラーで制作されているため、カラー表示可能な端末での閲覧を推奨いたします。





フレキシブルボックスレイアウトを使ったレスポンシブWebデザインをきっちり習得!

本書は、マルチデバイスに対応したWebサイトをステップ・バイ・ステップで作成し、最新標準のHTML+CSSをマスターすることを目的とした書籍です。

Webページ制作を取り巻く環境は、ここ数年で大きく変化しています。スマートフォンやタブレットといったモバイルデバイスからのアクセスがPCを凌駕し、それとともにWebページのデザインも1段組みをベースとしたシンプルなものが求められるようになっています。

そこで、本書では古いブラウザに縛られた時代には使い切ることができなかった機能をふんだんに活用し、今どきのWebページをシンプルなステップで形にしていく方法をまとめました。

サンプルサイトの制作工程を6ステップに分け、
CHAPTER1 下準備
CHAPTER2 トップページの作成 - コンテンツ編
CHAPTER3 トップページの作成 - ナビゲーション編
CHAPTER4 コンテンツページの作成
CHAPTER5 記事一覧ページの作成
CHAPTER6 アレンジ

と順に進めていくことで、基本からアレンジの方法まで、効率よくマスターできるカリキュラムとなっています。
本書サポートサイトから学習用のファイルをダウンロードできますので、それを使って学習することができます。

↓全て表示↑少なく表示
 
目次

(引用元Amazon)

 
Users Voice
インターネット利用の70%~80%がスマホになっている時代。
モバイルファーストのWEBデザインが必須になってきています。
この時代の流れを先取りした1段組みのフラットデザインの解説。

最新のHTML5とCSS3でレスポンシブWEBデザインが作れる所がすばらしい。
最新技術が習得できます。
(float は一切使われていません。)

Googleなどで昔は上位表示されていた3段組みのデザインのサイトが
どんどん順位が下がってゆき。もう時代遅れのデザインになってきています。
そんな中、検索の上位に表示されるようになってきているのは1段組みのモバイルファーストのWEBサイト。
時代の流れを先取りしている著者に脱帽です。

この本は古いWEBデザインから脱却し、最新の技術で時代の最先端をゆく
WEBデザインを学びたい人のための本だと思います。 (参考:Amazon)

↓全て表示 ↑少なく表示
HTML・CSSが初めての方は、別の書籍で基礎を勉強してからの方がいいかなと思います。
基礎的な細かなことはあまり書かれていないので、基礎がわかった方が、フレキシブルボックスレイアウトを勉強用に使用するといいですよ。
1つのサイトを作成しながら、フレキシブルボックスレイアウトを使って色々なデザインのページを説明している。
おおと感激したのは、メディアクエリを使用せずに画面の横幅に応じて横に並べる要素数が自動的に変わるようにした部分のところ。
考え方がとても役にたった。

出版年月日から年月が経っているので、やってみて違ったところは、「アイコンフォント」
現在は、登録しなくても使用できるみたいで、
・利用するための取得コードは「script」タブじゃなく「link」タブになっている
・アイコンは、「i」タグのコードでクラス名も微妙に違ってる。
・P197のアイコンは、「f105」に変更「FontAwesome」は「Font Awesome 5 Free」に変更、そして、このアイコンは、「font-weight: 900;」を追加しないとアイコンが表示されません。

私は、このP197でハマりました。

「div」タブ、多い気がするけど、1つのサイト作成で、色々なレイアウトが簡単にできているので私は、星5としま~す。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
  

HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シ...

フロントエンドエンジニアから学ぶ制作現場の実践的なテクニック!

本書は、HTML5/CSS3を使ってモダンなサイトを制作するためのコーディングテクニックをハンズオン形式で学ぶ書籍です。現在主流なWebページのデザインスタイル、「スタンダードレイアウト」「グリッドレイアウト」「シングルページレイアウト」を適用した3つのサイトを作りながら、各スタイルの特徴や使い分け、コーディングテクニックを学びます。実際のWeb 制作の現場と同様に、サイトのデザインを基にして骨格を見極め、枠組みから中身までひと通りコーディングするというフローをなぞることで、HTML5/CSS3の実用的なコーディングスキルやテクニックを無理なく身につけることができます。3つのサイトを作成することで、「本格的なレイアウトのサイトを作れた」「こういったレイアウトの場合こうコーディングすればいいという具体的なテクニックがわかった」というような手応えを得やすく、学ぶことへのモチベーションが下がらずに高まる構成にしています。駆け出しのフロントエンドエンジニアや、HTML/CSSコーディングに興味はあっても実践の機会がないデザイナー、バックエンドエンジニアなどが、実際にサイトを作ることを通してスキルアップすることを目標とした一冊です。

↓全て表示↑少なく表示
 
内容サンプル

(引用元Amazon)

 
Users Voice
1冊でもHTML5/CSS3の入門本を学び終えれば、こちらの本を手に取ることを強くオススメします。
初めのうちは難解と感じるかと思います。インターネットの検索と併用して読み進める必要もあると思います。しかしそれでも初心者の方に強く勧める理由が「保守性の高いCSSのマルチクラス設計」を自然と身につけることが出来るからです。

その他のHTML5/CSS3の入門書は、ひとつひとつの機能を説明することに比重を置いているため、どうしても現実的ではないコードの書き方をしています。
その点本書では、一度作ったwebページの一部が変更になっても大体的に修正を必要とせず、また拡張しやすい綺麗なコードの書き方を自然と身につけることが出来る良書となっています。

これは将来のあなたが、趣味の範疇を超えて職業にする可能性があるならば、いずれ学なくてはならない綺麗なコードの書き方です。それならば、変な癖がついた後から修正するよりも、初学者のうちに自然と吸収できる本書を早い段階で手にしましょう。
この本を2周すれば、初心者を脱出したと自信を持って断言してよいでしょう。

余裕があるならば、「Web制作者のためのCSS設計の教科書」も併せて購入すると良いでしょう。
2冊の相互作用であなたのHTML5/CSS3のレベルは一気に飛躍すること間違いありません。 (参考:Amazon)

↓全て表示 ↑少なく表示
HTML/CSSの勉強の3冊目として購入。
1冊目『いちばんよくわかるHTML5&CSS3デザインきちんと入門 』
2冊目『作りながら学ぶ HTML/CSSデザインの教科書』

スタンダードな2コラムレイアウトとJavascriptライブラリを使った可変グリッドレイアウト、レスポンシブ対応のシングルページレイアウトの3種類を作りながら学べる。

スタンダードレイアウトはこれまでの2冊でも作ってきたので、復習になる。コラムの段組はflexではなく、float。
この本でいちばんよかったのはCSSのアニメーションを少し体験できたこと。

CSSのtransformとtransitionプロパティを使って、回転や移動などの動きをサイトにつけることができると知った。
また、擬似要素を使ったデザインも前の2冊よりもより洗練されていたと思う。

ただ、やはり出版年が少し古いため、レスポンシブデザインの作り方がPCファーストであったり、コラムの段組にfloatを使っていたりするので、少し新しい入門書を読んだ後に利用するのがいいと思う。

全体的には満足できる1冊。 (参考:Amazon)

↓全て表示 ↑少なく表示
 
内容サンプル

(引用元Amazon)

 
  
 

   

HTML/CSS本「Kindle Unlmited 読み放題 人気ランキング」

「Kindle Unlimited」は、Amazonの定額本読み放題サービス。

実はそこにHTML/CSSの本もそこそこあるんです。すなわち、定額で何冊も学習することも可能

Kindle Unlimitedの主な特徴としては、おおよそ以下の通り。

  • 雑誌がかなり充実
  • 豊富なKindle個人出版本がほとんど読み放題
  • 最近は出版社単行本も対応増加

個人的には雑誌が、IT系(CG WORLD等)、ガジェット系(Get Navi等)、ゲーム(ファミ通等)、など見たい雑誌が幅広く読めるのが大きな魅力。2冊以上読みたいものがあるだけで確実にお得です。

また、30日無料体験も可能なので、体験期間を利用して無料で学習してみるのもお得な学習法です。

以下がKindle Unlimited対応のHTML/CSS関係の本人気ランキング(Best10)です。

(2020/10/30 更新)
売筋
Rank
製品評価
1
(4)
総評価数 7件
2
ゲームで学ぶJavaScript入門 HTML5&CSSも身につく!
発売日 2015/12/11
通常    2,640円
単行本   2,640円 (+54pt)
Kindle   2,178円 (+22pt)
Kindle Unlimited(読み放題)
(3.9)
総評価数 27件
3
(4.7)
総評価数 5件
4
(3.6)
総評価数 17件
5
できるホームページHTML&CSS入門 Windows 10/8.1/7対応 できるシリーズ...
発売日 2017/02/17
通常    1,738円
単行本   1,738円 (+34pt)
Kindle   1,406円 (+14pt)
Kindle Unlimited(読み放題)
(4.3)
総評価数 12件
6
(3.6)
総評価数 4件
7
(0)
総評価数 0件
8
(4.6)
総評価数 5件
9
(0)
総評価数 0件
10
HTML & CSS3 レイアウトブック
発売日 2016/12/20
通常    2,838円
単行本   479円
Kindle   2,838円 (+28pt)
Kindle Unlimited(読み放題)
(3.3)
総評価数 4件

 

おまけ①:本より高コスパ?「UdemyのHTML/CSS動画講座」

UdemyではHTML/CSSを基礎から応用までトータルで学べる学習講座があります。

こちらが、セール時には2千円程度で購入可能で、講座によっては本よりコスパよく学習が可能です。

講座は、買い切り型ながら更新あり、質問可能、30日間返金も可能、という本以上の手厚いサポートがあるのが魅力。

以下の表が、HTML/CSSの学習講座例。セールの場合、かなりおすすめなのでぜひトライしてみください。

学習コース評価
(4.5)
総評価数 4780件
(4.2)
総評価数 69件
HTML・CSS・JavaScript入門・はじめてのHTMLからマスターしていこう...
発売日 2018/02/16
受講者 1,114人
通常 2,400円
新規 1,680円
(4.1)
総評価数 273件

さらに詳しくは、以下でも紹介しています。覗いてみてください。


 

おまけ②:新書一覧(2019,2020刊行本)

IT技術・プログラミング言語は、最新情報をキャッチアップも非常に重要、すなわち新書は要チェック

ということで、2019年以降に発売したHTML/CSS参考書の新書を最後に一覧しておきまっす。

 

(2020/10/30 更新)
製品評価
できるデザイン教室 HTML&CSS&Webデザインきほん講座
発売日 2021/02/05
通常    2,420円
単行本   2,420円 (+24pt)
(0)
総評価数 0件
図解! HTML&CSSのツボとコツがゼッタイにわかる本
発売日 2020/12/15
通常    2,420円
単行本   2,420円 (+24pt)
(0)
総評価数 0件
HTML5&CSS3デザイン 現場の新標準ガイド【第2版】 (Compass Booksシリーズ)...
発売日 2020/10/23
通常    3,289円
単行本   3,289円 (+58pt)
Kindle   3,289円 (+33pt)
(0)
総評価数 0件
(0)
総評価数 0件
(0)
総評価数 0件
(0)
総評価数 0件
ゼロから学ぶHTML&CSSの基本
発売日 2020/09/09
通常    2,200円
単行本   2,200円 (+22pt)
(4)
総評価数 1件
初心者からちゃんとしたプロになる HTML+CSS実践講座
発売日 2020/08/28
通常    2,860円
単行本   2,860円 (+52pt)
Kindle   2,717円 (+28pt)
(3)
総評価数 1件
(0)
総評価数 0件
(0)
総評価数 0件
(0)
総評価数 0件
(0)
総評価数 0件
(0)
総評価数 0件
(4)
総評価数 1件
今すぐ使えるかんたんEx HTML&CSS 逆引き事典
発売日 2020/04/20
通常    2,398円
単行本   2,398円 (+42pt)
Kindle   2,278円 (+23pt)
(5)
総評価数 2件
(0)
総評価数 0件
よくわかるHTML/CSS
発売日 2020/04/13
通常    800円
Kindle   800円 (+8pt)
Kindle Unlimited(読み放題)
(1)
総評価数 1件
CSS設計完全ガイド ~詳細解説+実践的モジュール集
発売日 2020/02/27
通常    3,608円
単行本   3,608円 (+36pt)
Kindle   3,428円 (+35pt)
(4.5)
総評価数 69件
初心者からちゃんとしたプロになる HTML+CSS標準入門
発売日 2020/02/26
通常    2,750円
単行本   2,750円 (+54pt)
Kindle   2,613円 (+27pt)
(3.7)
総評価数 14件
(4.4)
総評価数 41件

 

関連:Web開発(PHP,JavaScript)系の他の書籍

Web開発のベースであるHTML/CSSの基礎が身についたら、よりリッチな表現が可能になるJavaScript、サーバーバックエンド操作も可能になるPHPを学ぶのがおすすめ

それによって、表現や扱えるデータなどの幅が広がり、リッチなコンテンツ作りが可能です。合わせて覗いてみてください。

関連:最新おすすめのKindle端末

以下では最新のKindle端末について比較、おすすめ紹介しています、合わせてのぞいて見てください。

いじょうでっす。

コメント

タイトルとURLをコピーしました