HTMLやCSSを学ぶ上でオススメの書籍5選
「Webデザインに興味がある」「簡単なプログラミングの基礎を学びたい」といったように、HTMLとCSSを学びたいという人の目的は様々だと思います。そんな中には、仕事でWeb担当者になったために基本的なHTMLとCSSの知識を習得しておきたいといった方や、趣味やプライベートでWebサイトを作ってみたいと考えている方もいらっしゃるかと思います。一方で、日々進化するWebデザインに関する最新の情報をキャッチアップしたいというフロントエンドエンジニアやUIデザイナーの方もいるでしょう。今回は、初心者からある程度予備知識を有している人まで、それぞれのレベルに合わせたHTMLとCSSを学ぶ上でオススメの書籍を５冊紹介します。
スラスラわかるHTML&CSSのきほん 第2版
著者：狩野 祐東(著)
出版社：SBクリエイティブ
本書の最大の特長は、初心者の方でも無理なくHTMLとCSSが学習できるように、架空のカフェ「KUJIRA Cafe」のWebサイトを作りながら、実践的にスキルを身につけることができるという点です。著者は、UIデザイナーでエンジニアの狩野祐東氏。累計4万部突破のベストセラーの前書を大改訂したものなので、読者から得た高い評価の内容はそのままに、最新のトレンドも踏まえた入門書となっています。
演習でサイトを作りながら学ぶというと、かなりの労力が必要なのかなと思う人も多いかもしれませんが、本書で制作する「KUJIRA Cafe」のWebサイトは、たったの全5ページ。飽きっぽいという方でも最後までやり遂げることができるはずです。PCだけでなくスマートフォンにも対応。予備知識がなくてもHTMLとCSSの知識をゼロから書きながら覚えていけるので、これからWeb制作を始める人にオススメです。
いちばんよくわかるHTML5&CSS3デザインきちんと入門 (Design&IDEA)
著者：狩野 祐東(著)
出版社：SBクリエイティブ
HTML5とCSS3がリリースされてから、だいぶ時間が経っていますので、初期の関連書籍ですと現在トレンドのWebデザインに対応していない部分も出てくるようになりました。現在は、スマホやタブレットなど閲覧する機器の画面サイズに合わせてレイアウトを変更するレスポンシブWebデザインを採用するのが当たり前の時代になってきていますが、発刊された時期が古い書籍には、こうした最新のデザインに関する情報は掲載されていないこともあるのです。HTMLやCSSに限らず、 IT関連の書籍はすぐ情報が古くなってしまいます。モバイルフレンドリーなサイト構築の重要性が増し、現在のHTML・CSSの書き方は、少し前までのHTML・CSSの書き方とは大きく変わっています。その点、本書はレスポンシブWebデザインが主流となってきた2016年に出版された本であり、新しいHTML・CSSの書き方ガイドとして編集されているので、スマートフォンでWebサイトを閲覧することが当たり前の時代に求められる実践的なテクニックがまとめられた入門書になっています。著者は「スラスラわかるHTML&CSSのきほん 第2版」と同じく、UIデザイナーでエンジニアの狩野祐東氏。
本書は、HTML・CSSの基礎知識、テキストの装飾方法、リンクの設定や画像の表示について、ボックスと情報の整理について、テーブルの作成方法、フォームの作成方法、ページ全体のレイアウトとナビゲーションについてといった内容に加え、最終章でレスポンシブWebデザインについて解説するといった構成。初心者からプロまで流行に左右されない基礎固めの知識の解説にはじまって、モバイル時代の最新テクニックや、コンポーネント単位で考える（ページの構成要素をパーツごとに作って組み合わせること）現代的なマークアップ、フレックボックスの作成方法なども丁寧に解説されています。初心者はもちろんのこと、HTMLやCSSについてはある程度知っているけど、モバイルファーストな時代のレスポンシブデザインについて勉強したいといった人にもオススメです！
デザインの学校 これからはじめる HTML & CSSの本 [Windows 10 & macOS対応版]
著者：千貫 りこ(著)／ロクナナワークショップ(監修)
出版社：技術評論社
HTMLやCSSを勉強したいけれども、何から手をつけていいのか分からないと悩んでいる人も多いのではないでしょうか。本書は、そんな方々に向けて、基本的な書式やよく使われるHTMLタグやCSSプロパティの意味などを丁寧に解説してくれます。さらに、モバイルフレンドリーなサイト構築についても対応しているので、最新のWebデザインについても学ぶことが可能です。著者は、フリーランスのウェブクリエイターとして活躍する千貫りこ氏。監修は、一流講師陣を集めた「ロクナナワークショップ」を主催するロクナナなので、初心者の方にもわかりやすく、なおかつ読み応えのある内容になっています。
一番やさしいホームページ制作の入門書というキャッチコピーを掲げるだけあって、まったくWebに関する知識がないといった人、PC作業が苦手といった人にもオススメです。WindowsとMacintosh両方に対応しており、サンプルファイルと完成ファイルを収録したCD-ROM付きなのも親切ですね！
HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方
著者：吉田 真麻(著)
出版社：翔泳社
本書は、現在主流なWebページのデザインスタイルである「スタンダードレイアウト」「グリッドレイアウト」「シングルページレイアウト」に適用した３つのサイトを作りながら、各スタイルの特徴や使い分け、コーディングテクニックを学ぶことができる内容となっています。著者は、フロントエンドエンジニアとしてHTML／CSS／JavaScriptでのシングルアプリケーションの開発や個人のプロダクト制作、イベントの登壇などで活躍する吉田真麻氏。
実際に手を動かしながら学ぶハンズオン形式で学ぶことができる本書は、HTML5やCSS3の基礎知識を習得しながら、枠組みから中身まで一通りコーディングするというフローをなぞることで、モダンなサイトを制作するための実用的なコーディングのスキルやテクニックを身につけることが可能です。
ある程度予備知識をもっている方向けの本書ですが、最新のWebデザインを知りたい、UIデザインを意識したサイト構築を学びたいという方には非常にオススメです！初心者の方は、簡単な入門書と一緒に、本書を購入しておくと最新のWebデザインに関するセンスを身につけられると思います！
HTML5&CSS3デザイン 現場の新標準ガイド
著者：エビスコム(著)
出版社：マイナビ出版
本書は、Web制作に関わっていてHTML5／CSS3をマスターしたいという人や、フロントエンドエンジニアの方などを対象としたガイドブックです。著者は、様々なメディアにおける企画制作・研究活動を世界各地のネットワークを駆使して展開。コンピュータ・インターネット関係の書籍出版で定評のある企業のエビスコム。現場の新標準ガイドというサブタイトルにも示されているとおり、コンテンツのマークアップから、フレキシブルボックスレイアウトやグリットレイアウトなどまで、必須の知識と最新のトレンドをキャッチアップする実践的なスキルを身につけることが可能です。
章の構成は、
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 特殊効果
フロントエンドエンジニア向けとなっていますが、項目別にまとめられているので、Web担当者やデザイナーなどが仕事現場のリファレンスブックとして活用することもできます。企業のWebチームで1冊購入しておいても良いかもしれません。
まとめ
いかがでしたでしょうか。今回は最新のWebデザインのトレンドも踏まえた上でのセレクトでしたが、レシポンシブデザインに対応する以前の書籍にも良書はあります。最新の情報はネットで補足すれば良いという人は、少し古い書籍を安く手にいれるといった方法も良いかもしれません。しかし、最新の情報を書籍から学ぶということは、非常に重要だと思います。本稿では、何度も改訂を重ねているベストセラーや、シリーズとして刊行されているもの、特定の読者に合わせた内容のものなどをセレクトしてみましたので、参考にしてみてくださいね！