HTMLとCSSの疑問が一気に解ける！ 真剣に学びたい人にお勧めの解説書 -プロを目指す人のためのHTML＆CSSの教科書
Post on:2022年6月3日
sponsors
最新のHTML Living Standardの仕様に準拠したHTMLとCSSの基礎知識を身につけ、なぜそこにそのHTMLを、そのCSSを使用するのかまで実践的な知識までしっかりと学べる解説書を紹介します。
HTMLとCSSへの理解を深めたい人、最新の仕様をきちんと理解しておきたい人、プロとしてWeb制作に関わる人が知識をブラッシュアップする際にもお勧めです。
本書はWeb制作、特にHTMLとCSSに関する書籍なら購入して間違いなしの大藤 幹氏の最新刊、すべてのページに学びがあります。
HTMLとCSSを真剣に学びたい人向けの解説書で、HTML Living Standardに準拠したHTMLとCSSの基礎から実践的な知識までしっかり学べます。
Kindle版も発売されています。
版元様より許可をいただいたので、紙面のキャプチャを少しだけご紹介。
本書は正統派のHTMLとCSSの解説書です。入門書ですが、初心者向けではなく、プロを目指す人向けで、中級者以上の人にも学びがたくさんある解説書です。
用語も一つひとつがしっかりと解説されています。
dlはdefinition list（定義リスト）ではなく、descripition list（用語説明型リスト）に変更されたことは知っていました？
本書では2022年春時点でのHTML Living Standardの仕様に合わせて解説されています。HTML 5やHTML 5.2の頃は1,2年周期のアップデートでしたが、HTML Living Standardでは日々更新され続けており、予想をはるかに超えて多くの箇所が仕様変更されています。
たとえば、hgroup要素やslot要素などの新しい要素の追加、一旦は削除されたmenu要素の復活、またグローバル属性の数は倍増された一方で、複数の要素や属性が削除されています。ほかにも文字コードはUTF-8以外は指定できないなどもあります。
本書は12章構成で、HTMLとCSSの基礎知識から各要素・属性・プロパティの値などについてもしっかりした解説があります。実装における仕組みもていねいに解説されており、構造の組み立て方、FlexboxやCSS Gridを使用したレイアウト方法、ナビゲーションやフォームなどの実装など実践的なテクニックも学べます。
中級者以上の人でもふだん何気なく見ている一見普通のHTMLが、HTML Living Standardの文法に合致されていない旧式のものになっているかもしれません。HTML 5.2がリリースされてからすでに5年が経過され、多くの変更点があります。
たとえば、meta要素のcharsetで定義する文字コードは、HTML Living StandardではUTF-8以外の文字コードで保存することは禁止されています。また、文字コード以外の情報を定義する場合は、name属性またはhttp-equiv属性のいずれかで情報の種類を明示し、情報はcontent属性の値に設定します。
CSSはまさにこれからが転換期です。IEのサポートが2022年6月15日に終了し、CSSの新機能や新しいプロパティもどんどん増えています。
CSSで最初に躓くのが、セレクタという人もいると思います。本書では、実装によく使用するセレクタ、疑似クラス（:nth-childなど）、疑似要素（::beforeなど）、結合子（+など）、組み合わせ方までCSSのセレクタの指定方法についてひととおり学べます。
第1章から第6章までは基礎知識で、第7章からHTMLとCSSの各要素やプロパティや属性の使い方です。なぜそこにそのHTMLを使用するのか、そのCSSを使用するのかを理解できるようにしっかりと詳しく解説されています。
要素間のスペースをどう実装するか悩むことがあるかもしれません。marginを上につけるか、下につけるか、外側につけるか、内側にpaddingをつけるか。またマージンが隣接する場合は、相殺を考慮する必要があります。
第8章は、表示形式を設定するdisplayプロパティです。中級者の人はインラインやブロックレベルは手足感覚で使用できると思いますが、インライン要素のimgに謎スペースがなぜできてしまうのか、フローレイアウトとはどういことかなど、しっかりした知識を身につけておくと実装で困ることがなくなると思います。もちろん、それだけでなくFlexboxとCSS Gridなど、現在主要なレイアウト方法についてもていねいに解説されています。
media属性によるメディアクエリも今まではscreenで幅を定義してレスポンシブにすることが多かったと思いますが、これからはいろいろなメディア特性、さらにはコンテナクエリも登場します。
実務で役立つ知識も満載です。たとえば、ul要素で実装したナビゲーション。リストのアイテムを水平に配置し、リンクの範囲をクリックしやすいように拡張し、テキストの位置やスペースを調整し、カーソルが上にあるときのエフェクトを実装するといった感じです。
フォームやテーブルが苦手という人もいるでしょう。HTML Living Standardではフォームに関連する新しい要素がたくさん追加され、属性も大量に追加されました。本書では一般的なフォームで使用される要素や属性にフォーカスして、詳しく解説されています。
最後の第12章では、スマホ・タブレット・デスクトップ対応のWebページを実装するチュートリアルです。文章構造の設計からはじめ、モバイルファーストでスマホ向けから実装します。
本書の付録も注目です。
HTML Living Standardで定義されているHTMLの全要素と機能、全要素のカテゴリ、各要素の配置ルールがまとめられています。配置できる場所・子要素として直接入れられる要素などはすぐに確認できるように手元に置いておきたいですね。
プロを目指す人のための HTML&CSSの教科書の目次
プロを目指す人のための HTML&CSSの教科書の目次
プロを目指す人のための HTML&CSSの教科書の目次
プロを目指す人のための HTML&CSSの教科書の目次
プロを目指す人のための HTML&CSSの教科書の目次
プロを目指す人のための HTML&CSSの教科書の目次
本書は、すべてのページに学びがあります。一度目を通しただけでは、すべてを覚えることはできないと思います。あれは何だっけ？どうやれば？という時にすぐ手に取れる場所に置いておくことをお勧めします。
献本の御礼
最後に、献本いただいたマイナビ出版の担当者さまに御礼申し上げます。
当サイトでは随時、献本を受け付けています。
お問い合わせは下記よりお願いいたします。
sponsors
