1 週間で HTML&CSS の基礎が学べる本

入門書を読む前の基礎力をアップさせよう! HTML や CSS の学習書を読んではみたけど、ちょっと難しかった…そんなあなたを「基礎の基礎」から後押しします。本書では 1 週間で、Web のしくみの理解から、簡単なスマホ対応の Web ページが作れるようになるまでをサポートします。

『1 週間で HTML&CSS の基礎が学べる本』 (亀田 健司 著、インプレス、2022 年 9 月刊) は、Web のしくみの理解から簡単なスマホ対応の Web ページづくりまでを 1 週間の学習として組んだ、HTML と CSS の入門書です。版元の書誌登録ではシリーズ名を「1 週間プログラミング」としており、書店発売日は 2022 年 9 月 22 日です。

入門書の手前を埋める HTML と CSS の基礎の範囲

楽天ブックスの書誌に載る紹介文は、本書の目的を「入門書を読む前の基礎力をアップさせよう!」と掲げ、HTML や CSS の学習書を読んでみたものの難しかった読者を「基礎の基礎」から後押しすると案内しています。扱う範囲として示されているのは、Web のしくみを理解するところから、簡単なスマホ対応の Web ページが作れるようになるところまでです。

Web のしくみと HTML、CSS の役割分担

Web ページは、ブラウザーが Web サーバーへ HTTP で要求を送り、返ってきた HTML 文書を解釈して画面に描く仕組みで成り立っています。HTML は見出し、段落、リスト、リンク、画像といった文書の構造と意味を要素とタグで記述する言語で、CSS はその要素に対して色、文字の大きさ、余白、配置といった見た目をセレクターとプロパティで指定する言語です。構造と見た目を別の言語に分けておくと、同じ HTML に別の CSS を当てて表示を変えられ、文書の意味を保ったまま装飾だけを直せます。

スマホ対応のページを支える考え方

画面の幅が違う端末で同じページを読みやすく見せる手法は、一般に レスポンシブデザイン と呼ばれます。HTML の head に viewport の meta 要素を置いて端末の幅に合わせた表示を指示し、CSS のメディアクエリで画面の幅ごとにレイアウトや文字の大きさを切り替えるのが基本の組み合わせです。1 つの HTML をパソコンとスマートフォンで共有できるため、ページを端末ごとに 2 系統で管理する必要がありません。

本書が扱うのは、紹介文が示すとおり、Web のしくみの理解から簡単なスマホ対応の Web ページの作成までを 1 週間の学習にまとめた HTML と CSS の基礎です。HTML と CSS の本の選び方は Web デザイン本ガイド にまとめています。