HTML5の勉強で、多くの人が最初につまずくのが専門用語です。「HTML・タグ・メタ情報」など、意味があいまいなまま問題を解いても、選択肢の正誤がなかなか判断できません。逆に言えば、頻出用語の意味を先に押さえてしまえば、問題文の理解スピードは一気に上がり、得点も安定します。

この記事では、HTML5でくり返し問われる用語を30個厳選し、分野別に意味つきでまとめました。通勤・通学のスキマ時間にざっと目を通すだけでも、学習効率が変わってきます。記事の後半では、こうした用語をスマホでテンポよく暗記できる無料アプリ「単語なう」も紹介します。

目次 [ open ]

HTML5合格は「用語の理解」から始まる

HTML5の試験では、用語や制度の意味を正しく理解しているかが問われます。定義をあいまいに覚えていると、ひっかけの選択肢に引っかかりやすくなります。

まずは用語の意味を一通りインプットし、そのうえで過去問を解くと、理解の定着が早くなります。以下の30語は、いずれも本試験でくり返し登場する基礎用語ばかりです。一語ずつ「自分の言葉で説明できるか」を意識しながら読んでみてください。

HTML5の頻出用語30選（分野別まとめ）

HTML基礎

  • HTML：タグを使ってWebページの構造や要素を記述するマークアップ言語の総称。
  • タグ：要素の開始と終了を示す山括弧で囲まれた記述。開始タグと終了タグの対で使う。
  • メタ情報：head内で文書の文字コード、説明、表示設定などを記述する付加情報。
  • p要素：段落を表すブロック要素。まとまった文章を囲んで構造化する。
  • img要素：src属性で画像ファイルを指定し、alt属性で代替テキストを設定して画像を埋め込む。
  • ol要素：順序付きリストを作る要素。li要素で各項目を記述し番号が自動付与される。

HTML5セマンティクス

  • セマンティクス：見た目ではなく意味や役割を持たせてマークアップする考え方。
  • nav要素：サイトの主要なナビゲーションリンクのまとまりを表すセマンティック要素。
  • aside要素：本文と間接的な関連しかない補足コンテンツを表す要素。サイドバーなどに用いる。
  • figure要素：図表や写真などの独立したコンテンツをまとめる要素。
  • figcaption要素：figure要素内の図表に付ける説明文やキャプションを表す要素。
  • details要素：クリックで開閉できる折りたたみ可能な情報領域。summary要素で見出しを付ける。

フォーム

  • input要素：type属性で入力形式を切り替える。テキスト、日付、チェックボックスなど様々な入力欄が作れる。
  • input type=date：日付選択用のinput要素。ブラウザがカレンダー型のUIを自動で提供する。
  • textarea要素：複数行のテキスト入力を受け付けるフォーム要素。改行を含めたコンテンツが入力できる。
  • required属性：フォーム送信時に入力が必須であることを示す属性。未入力ではブラウザが送信を防ぐ。

メディア・グラフィックス

  • video要素：動画ファイルを埋め込むHTML5要素。controls属性で再生ボタンなどのUIが表示される。
  • canvas要素：JavaScriptから図形やグラフィックスを動的に描画するための領域を提供する要素。
  • WebGL：canvas上でGPUを活用し3Dや高度な2Dグラフィックスを描画するJavaScript API。

CSS基礎

  • class属性：要素をグループ化してCSSやJavaScriptで対象を指定しやすくする属性。複数値の指定も可。
  • プロパティ：CSSで指定するスタイルの種類。color、font-sizeなどが該当し値とセットで宣言する。
  • 子孫セレクタ：スペースで区切ってある要素の中に含まれる要素を選ぶセレクタ。階層的な選択ができる。
  • 擬似要素（ぎじゅんそ）：::beforeや::afterのように要素の仮想的な部分にスタイルを適用する機能。
  • 継承（けいしょく）：親要素に指定したスタイルが子要素に引き継がれるCSS仕組み。色やフォントなど一部で働く。
  • border：要素の枠線を指定するプロパティ。太さ、線種、色を設定できる。

CSSレイアウト

  • position：要素の配置方法を指定するプロパティ。static、relative、absolute、fixed、stickyがある。
  • Flexbox：display:flexで有効になる1次元レイアウト。要素を行または列に柔軟に並べられる。
  • CSS Grid：display:gridで有効になる2次元レイアウト。行と列の格子状にコンテンツを配置できる。

レスポンシブ

  • レスポンシブWebデザイン：PCからスマホまで複数の画面幅に対応させる設計手法。メディアクエリで対応する。
  • ブレークポイント：レスポンシブデザインでレイアウトを切り替える境界となる画面幅の値。

HTML5の用語が覚えられないときの3つのコツ

  1. 意味を一言で言い換える：長い定義を丸暗記せず、自分の言葉で短く要約すると記憶に残ります。
  2. 対になる用語をセットで覚える：似た用語や反対の用語をペアで覚えると、違いが整理され混同しにくくなります。
  3. 毎日少しずつ反復する：一度に詰め込むより、毎日数分の反復が効果的です。間隔をあけて繰り返す「分散学習」を意識しましょう。

とはいえ、毎日コツコツ反復するのは、紙の参考書だけだとなかなか続きません。なぜ「アプリ」が用語暗記に向いているのか、少し掘り下げて説明します。

なぜHTML5の用語暗記に「アプリ」が効くのか

HTML5に挑む人の多くは、仕事や家事と両立しながら学習を進めています。まとまった勉強時間を取りにくいなかで、合否を分けるのはスキマ時間をどれだけ学習に変えられるかです。

人は覚えた用語をすぐ忘れる

心理学者エビングハウスの「忘却曲線」が示すとおり、人は一度覚えたことの多くを数日のうちに忘れます。用語暗記でつまずく人の多くは、記憶力が悪いのではなく、忘れる前に復習するタイミングを逃しているだけです。これを防ぐのが、間隔をあけて何度も思い出す「分散学習（間隔反復）」です。一夜漬けよりも、少ない総時間で記憶が長持ちすることがわかっています。

「いつ復習するか」をアプリが肩代わりする

分散学習が効果的でも、紙の参考書では「どの用語をいつ復習すべきか」を自分で管理する必要があり、これが独学最大のハードルになります。暗記アプリは、間違えた用語を自動でくり返し出題してくれるため、復習スケジュールの管理を丸ごと肩代わりしてくれます。学習者は「今日の数分を解く」ことに集中するだけで、効率のよい反復が自然に回り続けます。さらにスマホなら、1日5分を朝・昼・夜に分けて積み上げる「マイクロラーニング」も無理なく実践できます。

スキマ時間で用語を覚えるなら暗記アプリ「単語なう」

単語なうは、資格や試験の用語を「見て覚える」ことに特化したiPhone向けの暗記アプリです。HTML5をはじめ、TOEICや英検などの単語・用語を、カードをめくる感覚でテンポよく学習できます。机に向かう時間がとれなくても、通勤電車やちょっとした待ち時間で気軽に進められるのが特長です。

単語なうのHTML5カード画面イメージ。用語の意味を〇×で判定する
用語と意味が表示され、合っていたら「〇」、違ったら「×」をタップ（またはスワイプ）するだけ

単語なうの3つの特長

  • ① 用語と意味を見て〇×で判定するだけ
    カードの用語と意味を見て、自分が「合っていた」か「違った」かを〇×で答えます。一問数秒で進むので、リズムよく大量の用語に触れられます。
  • ② 間違えた用語は自動でくり返し復習
    「×」をつけた用語は復習モードで自動的にくり返し出題されます。苦手な用語だけを効率よくつぶせます。
  • ③ HTML5・TOEIC・英検など資格別に収録
    いまの学習に必要なデッキを選んで、その日の気分に合わせて進められます。

HTML5学習にどう役立つ？

HTML5の用語は、一度読んだだけではなかなか定着しません。この記事で紹介した頻出用語を、スキマ時間に何度も「見て・判定して」を繰り返せます。間違えた用語は自動で復習に回るため、参考書を最初から読み直す手間もかかりません。「参考書での学習＋アプリでの反復」の組み合わせで、用語の暗記がぐっと楽になります。

「単語なう」で得をするのはこんな人

単語なうは、次のような「まとまった勉強時間を取りにくい人」ほど効果を実感しやすいアプリです。自分に当てはまるか、チェックしてみてください。

  • 働きながら独学でHTML5を目指す社会人
    平日に机に向かう時間がほとんど取れなくても、通勤電車や昼休みの数分が学習時間に変わります。
  • 家事や育児の合間に勉強したい人
    一問あたり数秒で進むので、細切れの時間でも一語でも前に進められます。
  • 参考書だと三日坊主になりがちな人
    〇×で答えるテンポと、間違いがつぶれていく手応えが、続けるモチベーションになります。
  • 通学・通勤時間が長い学生や受験生
    毎日の移動時間を、まるごと用語暗記の時間に変えられます。
  • 直前期に苦手な用語だけ詰めたい人
    間違えた用語が自動で復習に回るため、弱点だけを集中的につぶせます。

逆に言えば、「勉強時間が足りない」「覚えてもすぐ忘れる」という悩みを持つ人すべてに、単語なうは効きます。空いた数分を得点力に変える習慣を、今日から始めてみてください。

暗記アプリ「単語なう」をApp Storeで無料ダウンロード
App Storeで「単語なう」を無料ダウンロード

iPhone対応／基本無料でご利用いただけます。

用語を使ったHTML5学習の進め方

  1. まず用語をインプット：この記事の用語のように、頻出語の意味をざっと頭に入れます。
  2. アプリで反復：単語なうで毎日数分、用語と意味を〇×で確認し、記憶を定着させます。
  3. 過去問で確認：用語が頭に入った状態で過去問を解くと、選択肢を判断しやすくなります。
  4. 間違えた用語に戻る：迷った用語は、アプリの復習でもう一度つぶしておきます。

よくある質問

HTML5の用語はどのくらい覚えればいい？

まずは本記事のような基礎用語を確実に押さえましょう。そのうえで過去問を解きながら、わからない用語が出てきたら都度覚えていくのが効率的です。

アプリと参考書、どちらで勉強すべき？

両方の併用がおすすめです。参考書でじっくり理解し、アプリでスキマ時間に反復する役割分担にすると、限られた時間でも効率よく学習を進められます。

まとめ

HTML5合格の近道は、頻出用語の意味を早い段階で固めてしまうことです。まずは今回の30語から押さえ、過去問演習と並行して語彙を増やしていきましょう。スキマ時間の反復には、暗記アプリ「単語なう」をぜひ活用してみてください。