HTMLが強みになる解説書、アクセシビリティやユーザビリティに配慮したコーディングを学べる -武器になるHTML
Post on:2022年12月2日
sponsors
Webページを実装する際に重要なのは、HTMLです。しっかりと確かなHTMLが書けないと、CSSやJavaScriptにも影響を与えてしまいます。
HTML Living Standardに基づいた知識、アクセシビリティやユーザビリティに配慮したコーディングを学べる、HTMLのみに特化された解説書を紹介します。
本書は仕事としてWeb制作に携わっている人、真剣に取り組んでいる人向けの解説書。確かなコーディング力を身につけるためのHTMLのみに特化されています。私の見落としがなければ、CSSに関して本書は0です。
HTMLの基礎知識から、文章構造、ページ構造、アクセシビリティやユーザビリティに配慮したマークアップについてしっかりと学べ、スキルアップになる一冊です。
Kindle版も発売されています！
版元様より許可をいただいたので、紙面のキャプチャを少しだけご紹介。
本書は全6章＋アルファで構成されており、2022年8月1日現在のHTML Living Standardの仕様に基づいてマークアップ、HTMLについて学べます。
第1章は、HTMLの全体構造と基本ルール。全体構造をマークアップするためには、要素の配置ルールとカテゴリを理解しておくことが重要です。たとえば、セクショニング・コンテンツには、article, aside, nav, sectionがあります。そしてセクショニング・コンテンツは、フロー・コンテンツに含まれています。
第2章からは、要素ごとのマークアップについて学びます。第2章は見出し・テキスト・リストのマークアップ。第3章はリンク、埋め込みコンテンツのマークアップ。
解説はリファレンス的なものとは異なります。もちろん、カテゴリや属性やサンプルコードも掲載されていますが、たとえば画像を埋め込むimg要素だと、代替テキストののポイント、高解像度ディスプレイへの対応方法、描画処理と読み込みのタイミング、デバイスによって画像を切り替えるpicture要素の使い方など、詳しく解説されています。
実際のコード、テキストや画像などの素材はサポートサイトからダウンロードできるので、すぐに始められると思います。
画像を配置する場合、本文から独立したコンテンツであればfigure要素の使用が推奨されます。figure要素は画像だけでなく、イラスト・図・写真・動画・コードなどにも使用できます。
第4章は、テーブルとフォームのマークアップ。ここらへんの実装を苦手にしている人には、必読かもしれません。一度しっかりと学べば、苦手意識はなくなります。
第5章は、セクションとページ構造について。Webページを実装する際には、セクションの位置づけと意味を理解しておく必要があり、section,要素などのセクショニング・コンテンツを適切に使い分けて実装します。
コラムも充実しており、マークアップのスキルを磨くためには必読のものばかりです。
マークアップは個々の要素ごとだけでなく、ページ全体でどのように構造をつくり、実装するかが重要です。
第6章はmeta要素、ページ情報やファビコンや検索エンジン用です。ここらへんはコピペで使用できるので、便利です。
- head内に記述する要素の総まとめ -meta要素、link要素、ソーシャルサービス用の要素、ブラウザやスマホアプリ用の要素など
- 2022年版、HTMLによるファビコン設定方法、さまざまなブラウザやデバイスに対応させる最小限のセットは6種類のファイルが必要
最後は＋アルファの第7章、ページをまるごとマークアップする練習問題。全体構造をどのように把握し、マークアップするのかまでていねいに解説されています。
武器になるHTMLの目次
武器になるHTMLの目次
武器になるHTMLの目次
HTMLについて改めて見直してみたい人にお勧めの解説書です。本書を読むと、今まで以上にHTMLを書きたくなり、HTMLを書くのが楽しくなると思います。
献本の御礼
最後に、献本いただいた技術評論社の担当者さまに御礼申し上げます。
当サイトでは随時、献本を受け付けています。
お問い合わせは下記よりお願いいたします。
sponsors
