HTML/CSS の絵本 Web コンテンツ作りの基本がわかる新しい 9 つの扉

Web コンテンツ作りには興味があるけれど、HTML や CSS は複雑で難しそうだな、と感じている人も多いのではないでしょうか。本書はイラストも多く交えて解説しているので、HTML / CSS の仕組みや書き方などの基本を直感的にイメージでき、理解も進められます。さあ、HTML / CSS の扉を開き、Web コンテンツ作りの一歩を踏み出しましょう。

『HTML/CSS の絵本 Web コンテンツ作りの基本がわかる新しい 9 つの扉』 (株式会社アンク 著、翔泳社、2023 年 3 月刊) は、Web ページを形づくる HTML と CSS の考え方を、フルカラーのイラストと見開き単位の解説で学ぶ入門書です。版元ドットコムの紹介文には、Web ページを作ってみたい人、HTML と CSS の仕組みを知りたい人、プログラミングを始めてみたい人に向けた本で、HTML Living Standard に対応しているとあります。国立国会図書館の書誌では、書名に「豊富なイラストでイメージしながら学ぼう!」が添えられています。

第 0 章から付録まで、HTML と CSS と JavaScript の構成

目次は第 0 章「HTML と CSS の勉強をはじめる前に」から始まり、第 1 章「Web サイトの概要」、第 2 章「HTML の基礎」、第 3 章「HTML の要素」と、文書を組み立てる側を進みます。続く第 4 章「CSS の基礎」、第 5 章「CSS のプロパティ (1)」、第 6 章「CSS のプロパティ (2)」で見た目の指定へ移り、第 7 章「レスポンシブデザイン」と第 8 章「JavaScript」を経て、第 9 章が付録です。版元ドットコムの紹介文には、考え方や概念を見開き単位で学べるとあります。

文書の構造を書く HTML と、見た目を決める CSS の分担

Web ページは、文書の構造と意味を記述する HTML と、色や余白、配置といった見た目を定める CSS の組み合わせで成り立っています。HTML Living Standard は、WHATWG が継続して更新する HTML の仕様です。

第 7 章のレスポンシブデザインと第 8 章の JavaScript

レスポンシブデザイン は、画面の幅に応じて CSS を切り替え、1 つの HTML をスマートフォンとパソコンの両方で見やすく表示する作り方です。JavaScript は、利用者の操作に応じて要素を書き換えたり動きを付けたりする言語です。

デザインの制作手順や、サーバーへの公開とサイトの運営は章として立っていません。Web デザインの本の選び方は Web デザイン本ガイド にまとめています。本書は、HTML と CSS の基礎から JavaScript の章までを、第 0 章から第 9 章の付録までにイラストとともに収めています。