2017年に受験した時の記録です。
HTML5の資格を取った時のメモ
- HTML ←この記事
- CSS
- その他範囲、試験対策
- サンプルコード、問題
レベル1の申し込み、本を買う。
HTML5プロフェッショナル認定試験 レベル1 対策テキスト&問題集 Ver2.0対応版
目次などを除いて約270ページ。
出題範囲の比率は
・HTML:5
・CSS:3
・その他:2
1日目
目標:土日でHTMLを一通り見る
結果:40ページぐらい読んだ。所用時間2時間程度。
本のボリュームは多いけど読むところは少ない+ほぼ読み流し。
明日の目標:80ページ+演習問題。
土日でHTMLパートを終わらせれば合格射程内に入りそう。
2日目
HTMLパート読了
食事、洗濯、昼寝に5時間ぐらい費やしたので所要時間2hぐらい。
演習問題が簡単すぎるので他の問題集も欲しい。
一回の読了で理解度は実感的に2割ぐらい、勉強するための素地が少し固まったという程度。
imgあたりは別途勉強が必要。
1章
1-2-1 HTML5.1の要素とカテゴリー
従来のインライン要素=フレージングコンテンツ
http://scene-live.com/page.php?page=7
カテゴリーは、その要素がどこのカテゴリーに属しているか示したもので、
コンテンツ・モデルは、その要素がどのカテゴリーの要素を含んでよいか
1-2-2 HTMLの全要素
参考サイト
1-3 グローバル属性
列挙属性/論理属性
1-3-6 dir属性
dir属性 →右寄せ
<bdo>タグ →文章を右から始める(dirと違う)
1-3-7 tabindex属性
指定するとインタラクティブコンテンツに成る
1-3-8 カスタムデータ属性(data-*)
英大文字は使えない
1-4-5 meta要素
http-equiv【equivalent】(同等)
タグ一覧
ルート要素
<html>【HyperText Markup Language】 文書のルート要素
文書のメタデータ
<head> メタデータの集まりを表す
<title> 文書にタイトルを付ける
<base> 相対リンクの基準となるURLを指定する
<link> 別の文書類と関連付ける
<style> スタイルシートを指定する
<meta> 文書に関する様々なメタデータを表す
セクション
<body> 文書の本体を表す
<article> 自己完結したセクションを表す
<section> 一般的なセクションを表す
<nav>【navigation links】 ナビゲーションを表す
<aside> 補足的なセクションを表す
<h1>-<h6>【heading*】 見出しを付ける
<hgroup>【heading group】 見出しをグループ化する (廃止)
<header> ヘッダを表す
<footer> フッタを表す
<address> 連絡先を表す
コンテンツのグループ化
<p>【paragraph】 段落を表す
<hr>【horizontal rule】 テーマの区切りを表す
<pre>【preformatted text】 整形済みのテキスト
<blockquote> 引用セクションを表す
<ol>【ordered list】 順序付きのリストを作る
<ul>【unordered list】 順不同のリストを作る
<li>【list item】 リストの項目を表す
<dl>【description list】 記述リストを作る
<dt>【description term】 記述リストの名前部分を表す
<dd>【description description】 記述リストの値部分を表す
<figure> 参照される図版を表す
<figcaption> 図版にキャプションを付ける
<main> 文書のメインコンテンツを表す
<div>【division】 特定の範囲をグループ化する
テキストの意味
<a>【anchor】 リンクを設定する
<em>【emphasis】 強調を表す
<strong> 重要性を表す
<small> 細目のような注釈を表す
<s>【strike】 すでに正確ではない内容を表す
<cite>【citation】(引用) 作品のタイトル・著者名・URLを表す
<q>【quotation】 引用フレーズを表す
<dfn>【definition】 定義される用語を表す
<abbr>【abbreviation】(略語) 略語や頭字語を表す
<code> ソースコードを表す
<var> 変数を表す
<samp>【sample】 プログラムの出力サンプルを表す
<kbd>【keyboard】 ユーザーが入力する内容を表す
<data> コンピュータ向けのデータを指定する
<sub>【subscript】(添字) 下付き文字を表す
<sup>【superscript】 上付き文字を表す
<time> 日付や時刻を表す
<i>【italic】 他と区別されるテキストを表す(思考・専門用語 等)
<b>【bold】 他と区別されるテキストを表す(キーワード・製品名 等)
<u>【underline】 軽めのラベル付け
<mark> テキストのハイライト表示
<ruby> ルビ(ふりがな)を振る
<rb>【ruby base】 ルビの対象テキストを表す
<rt>【ruby text】 ルビテキストを表す
<rtc>【ruby text container】 ルビテキストのコンテナ(※rbc(ruby body container)はHTML5で廃止)
<rp>【ruby parentheses】 ルビテキストを括弧で囲む
<bdi>【bi-directional isoration】 隔離されたテキストを表す
<bdo>【bi-directional override】 書字方向を指定する
<span>【span】(幅、架橋) 特定の範囲をグループ化する
<br>【break】 改行する
<wbr>【word break】 改行位置の候補を表す
訂正
<ins> 追加された部分を表す
<del> 削除された部分を表す
コンテンツの埋め込み
<img> 画像を表示する
<picture> レスポンシブイメージ(画像内容の最適化) (HTML 5.1)
<iframe> インラインフレームを作る
<embed> プラグインデータを埋め込む
<object> 外部リソースを埋め込む
<param> パラメータを指定する
<video> プラグインを使わずに動画を再生する
<audio> プラグインを使わずに音声を再生する
<track> 動画・音声と同期するテキストトラック
<source> メディアリソースの候補を指定する
<map> イメージマップを作る
<area> イメージマップのリンク領域を設定する
テーブル
<table> 表を作る
<caption> 表にキャプションを付ける
<colgroup> 表の列をグループ化する
<col> 表の列を表す
<tbody> 表の行をグループ化する(本体部分)
<thead> 表の行をグループ化する(ヘッダ部分)
<tfoot> 表の行をグループ化する(フッタ部分)
<tr>【table row】 表の行を表す
<td>【table data cell】 データセルを表す
<th>【table header cell】 見出しセルを表す
フォーム
<form> 入力フォームを作る
<fieldset> フォーム部品をグループ化する
<legend>【legend】(凡例(可算名詞)) 部品グループにキャプションを付ける
<label> フォーム部品とラベルを関連付ける
<input> 入力欄・選択肢・ボタンを作る
<select> プルダウンメニューを作る
<option> プルダウンメニューや入力候補の選択肢を作る
<optgroup> プルダウンメニューの選択肢をグループ化する
<textarea> 複数行のテキスト入力欄を作る
<button> 内容を持つボタンを作る
<datalist> 入力候補のリストを作る
<keygen> 暗号鍵を生成する (廃止予定)
<output> 計算結果の出力欄を作る
<progress> 作業の進捗状況を示す
<meter> 特定範囲内の数量や割合を示す
スクリプティング
<script> JavaScriptを埋め込む
<noscript> スクリプトが利用できない環境用の内容
<template> スクリプトで利用するHTMLコードのテンプレート
<canvas> スクリプト使ってグラフィックスを描く
インタラクティブ
<details> リクエストに応じて詳細情報を提供する (HTML 5.1)
<summary> 詳細情報のキャプションや要約を表す (HTML 5.1)
<menu> ポップアップメニューを表す (HTML 5.1)
<menuitem> ポップアップメニューの項目を表す (HTML 5.1)
<command> コマンドを表す (廃止)