関連サイト
本書の関連ページが用意されています。
内容紹介
本書は、LPI-Japanが主催する「HTML5プロフェッショナル認定試験」の「レベル1」に合格するための知識を身につけるための書籍です。
※「HTML5プロフェッショナル認定試験」は、HTML5やCSS3、JavaScriptなど、最新のマークアップに関する技術力と知識を認定するための資格試験です。デザイン、Web、開発に関わる幅広い職種を対象としています。
LPI-Japanによって公開されている出題範囲をしっかりと押さえつつ、関連する知識も含めて、読みやすく、覚えやすい形でまとめています。
試験に含まれる学習範囲を重要度順に前から並べているため、重要度の高いものから学習していけるようになっています。紙面では、「用語解説」や「注意するポイント」「補足説明」などを適切に切り分けて掲載し、重要な点がスムーズに学べるよう配慮しています。
また、各章の最後には、本番よりもやや難易度を高くした問題集を用意し、学習した内容の理解度を確認するとともに、しっかりと定着させていくことができます。
HTML5については、2014年10月に勧告されたHTML5に完全対応。試験対策のみならず、勧告されたHTML5について、短期間で学ぶのにも適した書籍です。
また、書籍のサポートサイトからは1回分の模擬試験のPDFをダウンロードできるようになっています。ダウンロードの際は、書籍に掲載されているIDとパスワードが必要になります。
書誌情報
- 著者: 大藤幹, NTTソフトウェア株式会社
- ページ数: 314ページ(PDF版換算)
- 対応フォーマット: PDF
- 出版社: マイナビ出版
対象読者
Web制作者、Webデザイナー、開発者
著者について
大藤幹
2015年3月より名古屋在住。国家検定ウェブデザイン技能検定特別委員(作問等を担当)、技能五輪全国大会ウェブデザイン職種競技委員(審査等を担当)。現在の主な業務は、ウェブデザインに関連する書籍の執筆のほか、全国各地での講演・セミナー講師など。著書は『よくわかるHTML5+CSS3の教科書』(マイナビ)、『詳解HTML&XHTML&CSS辞典』(秀和システム)、『10日でおぼえる CSS/CSS3入門教室』(翔泳社)、『XHTML+CSS 超高速コーディング術』(ソシム)など50冊を超える。LPI-Japan HTML5アカデミック認定校クリーク・アンド・リバー社の認定講師も務め、HTML5プロフェッショナル認定試験の公式サイトにおけるサンプル問題も多数提供している。
鈴木 雅貴
NTTソフトウェア株式会社主任エンジニア。学生時代にインターネットの世界に出会い、表現場所としての可能性を感じると共にこの世界にかかわりたいと考え、1999年に入社。数年間の開発経験の後、開発現場の生産性向上を目的として、継続的インテグレーションツールやビルドツールの社内普及活動を行うと共に、社内のWebアプリケーション構築アドバイザーとして活動。2010年よりHTML5関連の業務に従事し、現在は2012年に発足したHTML5推進室にて、技術支援や技術者育成に力を注いでいる。
目次
CONTENTS
Chapter1 HTMLの基礎知識
- 1-1 HTML5 の基本文法
- 1-1-1 基本的な書式と各部の名称
- 1-1-2 HTMLの全体構造
- 1-1-3 DOCTYPE宣言
- 1-1-4 文字参照
- 1-1-5 コメント
- 1-2 グローバル属性
- 1-2-1 グローバル属性とは
- 1-2-2 class属性
- 1-2-3 id属性
- 1-2-4 lang属性
- 1-2-5 title属性
- 1-2-6 dir属性
- 1-2-7 カスタムデータ(data-*)属性
- 1-2-8 WAI-ARIA関連の属性
- 1-3 HTML5 の要素とカテゴリー
- 1-3-1 HTML5の要素の種類
- 1-3-2 HTML5の全要素
- 1-3-3 各カテゴリーに含まれる要素
Chapter2 HTML5で追加された要素
- 2-1 セクション
- 2-1-1 セクションと見出しの関係
- 2-1-2 section要素
- 2-1-3 article要素
- 2-1-4 aside要素
- 2-1-5 nav要素
- 2-2 構造を示す要素
- 2-2-1 header要素
- 2-2-2 footer要素
- 2-2-3 main要素
- 2-3 テキスト
- 2-3-1 mark要素
- 2-3-2 data要素
- 2-3-3 time要素
- 2-3-4 wbr要素
- 2-3-5 bdi要素
- 2-4 ルビ
- 2-4-1 ruby要素
- 2-4-2 rt要素
- 2-4-3 rb要素
- 2-4-4 rp要素
- 2-4-5 rtc要素
- 2-5 動画・音声
- 2-5-1 video要素
- 2-5-2 audio要素
- 2-5-3 source要素
- 2-5-4 track要素
- 2-5-5 embed要素
- 2-6 フォーム
- 2-6-1 meter要素
- 2-6-2 progress要素
- 2-6-3 datalist要素
- 2-6-4 output要素
- 2-6-5 keygen要素
- 2-7 その他の新要素
- 2-7-1 figure要素
- 2-7-2 figcaption要素
- 2-7-3 template要素
- 2-7-4 canvas要素
Chapter3 HTML5で変更・廃止された要素
- 3-1 HTML5 で変更された要素
- 3-1-1 hr要素
- 3-1-2 small要素
- 3-1-3 strong要素
- 3-1-4 b要素
- 3-1-5 i 要素
- 3-1-6 s要素
- 3-1-7 u要素
- 3-2 HTML5 で廃止された要素
- 3-2-1 廃止された要素の一覧
- 3-3 HTML5 で廃止された属性
- 3-3-1 廃止された属性の一覧
Chapter4 HTML401以前からある要素
- 4-1 基本構造
- 4-1-1 html要素
- 4-1-2 head要素
- 4-1-3 body要素
- 4-1-4 title要素
- 4-1-5 base要素
- 4-1-6 meta要素
- 4-1-7 address要素
- 4-1-8 div要素
- 4-1-9 span要素
- 4-2 テキスト
- 4-2-1 h1~h6要素
- 4-2-2 p要素
- 4-2-3 blockquote要素
- 4-2-4 q要素
- 4-2-5 cite要素
- 4-2-6 ins要素
- 4-2-7 del要素
- 4-2-8 em要素
- 4-2-9 br要素
- 4-2-10 abbr要素
- 4-2-11 dfn要素
- 4-2-12 pre要素
- 4-2-13 code要素
- 4-2-14 samp要素
- 4-2-15 kbd要素
- 4-2-16 var要素
- 4-2-17 bdo要素
- 4-2-18 sup要素
- 4-2-19 sub要素
- 4-3 リスト
- 4-3-1 ul要素
- 4-3-2 ol要素
- 4-3-3 li要素
- 4-3-4 dl要素
- 4-3-5 dt要素
- 4-3-6 dd要素
- 4-4 リンク
- 4-4-1 a要素
- 4-4-2 link要素
- 4-5 画像とオブジェクト
- 4-5-1 img要素
- 4-5-2 map要素
- 4-5-3 area要素
- 4-5-4 object要素
- 4-5-5 param要素
- 4-6 フォーム
- 4-6-1 form要素
- 4-6-2 input要素
- 4-6-3 textarea要素
- 4-6-4 button要素
- 4-6-5 select要素
- 4-6-6 option要素
- 4-6-7 optgroup要素
- 4-6-8 label要素
- 4-6-9 fieldset要素
- 4-6-10 legend要素
- 4-7 テーブル
- 4-7-1 table要素
- 4-7-2 tr要素
- 4-7-3 th要素
- 4-7-4 td要素
- 4-7-5 thead要素
- 4-7-6 tbody要素
- 4-7-7 tfoot要素
- 4-7-8 caption要素
- 4-7-9 col要素
- 4-7-10 colgroup要素
- 4-8 その他
- 4-8-1 iframe要素
- 4-8-2 script要素
- 4-8-3 noscript要素
Chapter5 CSSの基礎知識
- 5-1 CSSの基本文法と組み込み方
- 5-1-1 基本的な書式と各部の名称
- 5-1-2 link要素でHTMLに組み込む
- 5-1-3 style要素でHTMLに組み込む
- 5-1-4 style属性でHTMLに組み込む
- 5-1-5 @importでCSSに組み込む
- 5-2 セレクタ
- 5-2-1 セレクタの種類と組み合せのルール
- 5-2-2 タイプセレクタ
- 5-2-3 ユニバーサルセレクタ
- 5-2-4 クラスセレクタ
- 5-2-5 IDセレクタ
- 5-2-6 属性セレクタ
- 5-2-7 リンク関連の疑似クラス
- 5-2-8 その他の疑似クラス
- 5-2-9 疑似要素
- 5-2-10 結合子
- 5-3 CSS適用の優先順位
- 5-3-1 CSSの指定元による優先順位
- 5-3-2 ! importantで優先順位を高くする
- 5-3-3 セレクタの詳細度による優先順位の計算方法
Chapter6 CSS3の主な新機能
- 6-1 色
- 6-1-1 色を示す値:16進数
- 6-1-2 色を示す値:キーワード
- 6-1-3 色を示す値:rgb( ), rgba( )
- 6-1-4 色を示す値:hsl( ), hsla( )
- 6-1-5 colorプロパティ
- 6-1-6 opacityプロパティ
- 6-2 背景
- 6-2-1 ボックスの構造
- 6-2-2 長さをあらわす単位
- 6-2-3 background-colorプロパティ
- 6-2-4 background-imageプロパティ
- 6-2-5 background-clipプロパティ
- 6-2-6 background-repeatプロパティ
- 6-2-7 background-sizeプロパティ
- 6-2-8 background-originプロパティ
- 6-2-9 background-positionプロパティ
- 6-2-10 background-attachmentプロパティ
- 6-2-11 backgroundプロパティ
- 6-3 アニメーション
- 6-3-1 回転・拡大縮小・移動など
- 6-3-2 transformプロパティ
- 6-3-3 transform-originプロパティ
- 6-3-4 CSS3のトランジションとは
- 6-3-5 transition-propertyプロパティ
- 6-3-6 transition-durationプロパティ
- 6-3-7 transition-timing-functionプロパティ
- 6-3-8 transition-delayプロパティ
- 6-3-9 transitionプロパティ
- 6-3-10 CSS3のアニメーションとは
- 6-3-11 @keyframes
- 6-3-12 animation-nameプロパティ
- 6-3-13 animation-durationプロパティ
- 6-3-14 animation-timing-functionプロパティ
- 6-3-15 animation-delayプロパティ
- 6-3-16 animation-iteration-countプロパティ
- 6-3-17 animation-directionプロパティ
- 6-3-18 animation-play-stateプロパティ
- 6-3-19 animation-fill-modeプロパティ
- 6-3-20 animationプロパティ
- 6-4 マルチカラムとフレキシブルボックス
- 6-4-1 マルチカラムレイアウト
- 6-4-2 column-countプロパティ
- 6-4-3 column-widthプロパティ
- 6-4-4 columnsプロパティ
- 6-4-5 column-gapプロパティ
- 6-4-6 column-ruleプロパティ
- 6-4-7 column-spanプロパティ
- 6-4-8 フレキシブルボックスレイアウト
- 6-5 その他の新機能
- 6-5-1 border-radiusプロパティ
- 6-5-2 box-shadowプロパティ
- 6-5-3 text-shadowプロパティ
- 6-5-4 直線状のグラデーション
- 6-5-5 放射状のグラデーション
Chapter7 CSSの各種プロパティと値
- 7-1 フォント
- 7-1-1 Webフォント
- 7-1-2 font-familyプロパティ
- 7-1-3 font-sizeプロパティ
- 7-1-4 font-weightプロパティ
- 7-1-5 font-styleプロパティ
- 7-1-6 font-variantプロパティ
- 7-1-7 fontプロパティ
- 7-2 テキスト
- 7-2-1 text-decoration関連のプロパティ
- 7-2-2 word-breakプロパティ
- 7-2-3 hyphensプロパティ
- 7-2-4 white-spaceプロパティ
- 7-2-5 text-alignプロパティ
- 7-2-6 vertical-alignプロパティ
- 7-2-7 line-heightプロパティ
- 7-2-8 text-indentプロパティ
- 7-2-9 letter-spacingプロパティ
- 7-2-10 word-spacingプロパティ
- 7-2-11 text-transformプロパティ
- 7-2-12 directionプロパティ
- 7-2-13 unicode-bidiプロパティ
- 7-3 ボックス
- 7-3-1 margin関連プロパティ
- 7-3-2 padding関連プロパティ
- 7-3-3 border関連プロパティ
- 7-3-4 幅と高さを設定するプロパティ
- 7-3-5 floatプロパティ
- 7-3-6 clearプロパティ
- 7-3-7 displayプロパティ
- 7-3-8 visibilityプロパティ
- 7-3-9 overflowプロパティ
- 7-3-10 clipプロパティ
- 7-4 その他
- 7-4-1 リスト関連のプロパティ
- 7-4-2 テーブル関連のプロパティ
- 7-4-3 内容を追加するプロパティ
Chapter8 レスポンシブWebデザイン
- 8-1 レスポンシブWebデザインと関連技術
- 8-1-1 レスポンシブWebデザインとは
- 8-1-2 レスポンシブWebデザインのメリットとデメリット
- 8-1-3 レスポンシブWebデザインに必要な技術
- 8-1-4 メディアクエリ(Media Queries)
- 8-1-5 Fluid Grid(可変グリッド)
- 8-1-6 Fluid Image(可変イメージ)
- 8-1-7 ビューポート
- 8-1-8 リセットCSS
- 8-2 スマートフォン最適化
- 8-2-1 CSSスプライト
- 8-2-2 高解像度画面向け対応
- 8-2-3 ホーム画面ショートカットアイコン
- 8-2-4 スタンドアローンモード
- 8-2-5 a要素での電話発信
- 8-2-6 async属性/defer属性
Chapter9 オフラインWebアプリケーション
- 9-1 オフラインWebアプリケーション
- 9-1-1 オフラインWebアプリケーションの概要
- 9-1-2 キャッシュマニフェストの記述方法
- 9-1-3 HTMLファイルからの指定方法
- 9-1-4 キャッシュファイルの更新
- 9-1-5 アプリケーションキャッシュの確認・削除
Chapter10 Web関連の規格と技術
- 10-1 HTTP・HTTPSプロトコル
- 10-1-1 HTTPプロトコル
- 10-1-2 HTTPSプロトコル
- 10-1-3 HTTPのメッセージ構造
- 10-1-4 HTTPのリクエストメッセージ
- 10-1-5 HTTPのレスポンスメッセージ
- 10-1-6 HTTPのヘッダフィールド
- 10-1-7 HTTPでの認証
- 10-1-8 HTTP cookie(クッキー)
- 10-2 ネットワーク・サーバ関連技術
- 10-2-1 OSI参照モデル
- 10-2-2 TCP/IP
- 10-2-3 ドメイン
- 10-2-4 Webサーバ関連技術
- 10-2-5 データベース関連技術
- 10-3 Web関連技術の概要
- 10-3-1 文書の構造
- 10-3-2 データの操作
- 10-3-3 通信
- 10-3-4 Webサイトへの不正な攻撃手法
- 10-3-5 ネットワーク上の脅威対策
- 10-3-6 Webサイトやアプリケーションの制作
- 10-3-7 画像について
- 10-3-8 Webサイトの集客・収益
Appendix 巻末資料
- A-1 HTML5 の要素の配置ルール
- A-2 HTML5 の全属性一覧