Books 書籍

トップページ書籍インクルーシブHTML+CSS & JavaScript

書籍基本情報

インクルーシブHTML+CSS & JavaScript

インクルーシブHTML+CSS & JavaScript

多様なユーザーニーズに応えるフロントエンドデザインパターン

発売日:2017年11月2日

著者:ヘイドン・ピカリング
監訳:太田良典、伊原力也
定価:本体2,800円 + 税

発行・発売:株式会社 ボーンデジタル
ISBN:978-4-86246-387-6
Cコード:C3055
総ページ数:264 ページ
サイズ:B5版、1色

書籍の購入はこちらから
  • WORKS
  • Amazon.co.jp
  • Yodobashi
  • Seven Shopping

※書店でお買い求めの際には、予め在庫をご確認ください。

※PDF書籍に関しては書店販売を行っておりません。

主要取扱い店舗>>

書籍サポート

多様なユーザーニーズや閲覧環境に応える、HTML+CSS & JavaScriptの実装をマスターしよう!

この書籍は、パソコン、スマートフォン、タブレット、時計、テレビなどのインターネットコンテンツの多様化が進む中で、あらゆる人・検索ロボットやユーザーエージェントなどのマシーンを含む、幅広いターゲットにとって使いやすいコンテンツやインターフェイスのデザインをどのように実現するのかを解説するものです。HTML5、CSS3、JavaScriptといったフロントエンド言語のデザインパターン(プログラムのパターン)を豊富なコンテンツやインターフェイスの実例とともに紹介します。

原書のInclusive Design Patterns – Coding Accessibility Into Web Designは2016年10月にドイツ Smashing Magazineから刊行され、高い評価とレビューを得ています。

この書籍は、上記書籍の日本語版として、プロフェッショナル/学生を問わず、今日のWebサイトやWebアプリケーションを設計、デザイン、実装(プログラミング)するあらゆる従事者の方をターゲットに制作しました。

既刊のデザイニングWebアクセシビリティ、コーディングWebアクセシビリティの実装面の理解を深めるために

HTMLやCSSに関する書籍は、主にレイアウトなどの見た目を実現するためのHTMLやCSSのパターン集が多くなりますが、本書はWebの本質に立った、「あらゆる環境やユーザーにとって使える(つまり除外しない)」WebサイトやWebアプリケーションの実装のアプローチ方法について解説しています。これは、弊社刊行のデザイニングWebアクセシビリティなど限られた書籍でしかアプローチされていません。

弊社既刊「デザイニングWebアクセシビリティ」や「コーディングWebアクセシビリティ」をお読みいただいた方は、豊富なコードパターン解説を通じて、実装面の理解をぜひ深めてみてください。

推薦コメント:株式会社サイバーエージェント Webフロントエンドディベロッパー 佐藤歩様

一見して見慣れない「インクルーシブ」という主題だが、フロントエンド開発の本質を実によくとらえている。利用環境がどのような条件下にあっても使用に耐えうる堅牢な実装は、サービスやコンテンツの価値を最大化するために不可欠である。本書が取り扱う事例は決して新奇なものではない。しかし、一般的な事例を「インクルーシブ」な視点から再考することによって、優れたフロントエンド開発者のみが実践してきた秘伝を学ぶことができるはずだ。

好評の既刊書籍の著者、監修者が再び集結!

ヘイドン・ピカリング
英国のインターフェイスデザイナー、イラストレーター、ライター。Web制作者向けの情報サイト「Smashing Magazine」のWebアクセシビリティ担当エディター。

太田良典(株式会社ビジネス・アーキテクツ)
2001年にBAに参加、ウェブアクセシビリティ基盤委員会(WAIC)の委員として活動。Web技術の分野で幅広い専門性を持ち、セキュリティ分野においては「第二回IPA賞(情報セキュリティ部門)」を受賞。著書(共著)に『デザイニングWebアクセシビリティ』など。

伊原力也(freee株式会社)
アクセシブルなインタラクションデザインの実践を標榜し、Webサービスやスマートフォンアプリの設計業務に従事。ウェブアクセシビリティ基盤委員会(WAIC)理解と普及作業部会委員としても活動。HCD-Net認定 人間中心設計専門家。クリエイティブユニットmokuva所属。共著書に『デザイニングWebアクセシビリティ』、監訳書に『コーディングWebアクセシビリティ』(ボーンデジタル)。

1章:はじめに
1.1 Webデザインを考え直す
1.2 インクルーシブデザイン
1.3 インクルーシブなボタン

2章:ドキュメント全体
2.1 DOCTYPE
2.2 lang属性
2.3 レスポンシブデザイン
2.4 フォントサイズ
2.5 プログレッシブエンハンスメント
2.6 アセットの管理
2.7 フォントのサブセット化
2.8 title要素
2.9 main要素
2.10 ページを見てみよう
2.11 フレームワーク、プリプロセッサ、タスクランナーについての注意

3章:パラグラフ
3.1 書体
3.2 組版
3.3 インラインリンク
3.4 自動化されたアイコン
3.5 パラグラフの記述
3.6 まとめ

4章:ブログ記事
4.1 main要素
4.2 見出しの構造
4.3 article要素
4.4 プログレッシブエンハンスメントと相互運用性
4.5 Flesch-Kincaidリーダビリティテスト
4.6 見出しとリンクテキスト
4.7 ビデオ
4.8 フローシステムの確立
4.9 まとめ

5章:パターンごとの評価
5.1 原則ごとの評価における問題点
5.2 Custom ElementsとShadow DOM

6章:ナビゲーション領域
6.1 ナビゲーションランドマーク
6.2 サイト内共通のナビゲーション
6.3 目次
6.4 まとめ

7章:メニューボタン
7.1 アイコンの表示方法
7.2 ラベルづけ
7.3 古いブラウザ
7.4 操作
7.5 タッチターゲット
7.6 まとめ

8章:インクルーシブ・プロトタイピング
8.1 ペーパープロトタイピング
8.2 紙からコードへ

9章:商品リスト
9.1 リストの長所
9.2 カギとなる情報
9.3 商品のサムネイル
9.4 「今すぐ購入」アクション
9.5 SERP
9.6 まとめ

10章:フィルターウィジェット
10.1 見た目の例
10.2 マークアップ
10.3 CSSによる拡張
10.4 JavaScriptによる拡張
10.5 検索結果をもっと読み込む
10.6 表示オプション
10.7 動的なコンテンツへの柔軟な対応
10.8 まとめ

11章:登録フォーム
11.1 コンテキストに応じたフォーム
11.2 基本のフォーム
11.3 必須フィールド
11.4 パスワードを表示する
11.5 フォーム検証
11.6 マイクロコピーライティング
11.7 まとめ

12章:テスト駆動マークアップ
12.1 セレクタのロジック
12.2 テスト駆動のタブインターフェイス
12.3 1つですべてを賄う必要はない

書籍の購入はこちらから
  • Born Digitalのオンラインショップはこちらから
  • ワークスコーポレーションのオンラインショップはこちらから

PAGE TOP

製品情報
書籍
セミナー・トレーニング
キャンペーン
サポート

会社概要 | アクセス | 採用情報 | プライバシーポリシー | お知らせ | サイトマップ