• このエントリーをはてなブックマークに追加

HTML5プロフェッショナル認定試験レベル1 サンプル問題

例題解説とその内容については、例題提供者の監修です。内容や試験問題に関わるお問い合わせにつきましては、LPI事務局ではお応えできませんのでご了承ください。
例題解説のご提供者さまを募集中です。LPI-Japan事務局までぜひご投稿ください。選ばれた方の例題解説は本サイトに掲載させていただきます。

1.3 要素

例題3.17 「1.3.3 インタラクティブ要素」
レベル1の出題範囲「1.3.3 インタラクティブ要素」からの出題です。
HTML5アプリを納品したが、スマホユーザーから「登録画面が使いにくい。」との苦情が多かったらしく、改善を要求された。
以下はそのコードの抜粋であるが、スマホへの改善策として最も適しているのは次のうちどれか。
      
 <html>
 <head>
  <meta charset="UTF-8">
 </head>
<body>
 <h1>登録</h1>
<form action="reg.pl" method="post">
 <table>
  <tr>
   <td> 氏名:
   <td><input name="name" placeholder="資格月斗">
  <tr>
   <td> メール:
   <td><input name="email" placeholder="shikaku@example.org">
  <tr>
   <td> 電話番号:
   <td><input name="tel" placeholder="09012345678">
  <tr>
   <td> 生年月日:
    <td><input name="birth" placeholder="1999/12/31">
  <tr>
   <td> URL:
   <td><input name="url" placeholder="http://example.org/">
 </table>
<input type="submit" name="register">
</form>
</body>
</html>
	 
     
  • autocomplete=“on”で入力を簡素化する。
  • kbd属性でキーボード配列(QWERTYまたは10キーなど)を指定する。
  • picker属性でカレンダーピッカーやスライダーを指定する。
  • pattern属性で受け付けない文字を入力できないよう指定する。
  • type属性で入力値の分類を指定する。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは E です。

スマホの文字入力は、画面の一部に表示されるソフトウェアキーボードを使用します。小さな画面スペースに指で押せるサイズを確保するため、キーの数が制限されます。そのため入力する文字列によってはキーボードの切り替えが頻発する場合があります。
HTML5 の input 要素には多くのtype 属性が追加され、適切な値を指定することで適したキーボードを表示する事ができ、キーボード切り替えの負担を軽減できます。

以下は主な type 属性の値と説明です。
text: デフォルト値です。アルファベット主体のキー配列が表示されます。
email: アルファベットの他に @ と . キーが表示されます。
url: アルファベットの他に / と . のキーが表示されます。iOSでは、さらに、.jp のキーが表示されます。
date: 年、月、日のドラムロールが表示されます。PCでは、カレンダーも利用できます。日付の入力は、予約など今日の前後数ヶ月を入力する場合と、生年月日のような何十年も前(^^;)の日付を入力する場合があるので、使い分ける検討も必要です。
time: 時、分のドラムロールが表示されます。
tel: 数字といくつかの記号のみのキーが表示されます。
number: 数字を主体とするキー配列が表示されます。

その他の選択肢については以下のとおりです。
A.のautocomplete属性は、入力を自動化する機能です。スマホ以外にも有効です。
B.のkbd属性はありませんが、kbd要素は存在し、キーボードで入力するテキストを指す場合に使用します。QWERTYは通常のキーボード配列で、最上段の左から6文字の並びから命名されています。10キーは0~9の10個の数字キーでしたが、文字入力も可能になり日本語テンキーとも呼ばれます。
C.のpicker属性はありません。
D.のpattern属性は入力制限を正規表現で指定する機能です。

type属性はブラウザにより実装やバリデーションが異なります。pattern属性を併用したり、動作の確認をしてから使用することをお勧めします。

参考コード:type属性を指定した例


 <html>
 <head>
  <meta charset="UTF-8">
 </head>
<title>登録</title>
<body>
 <h1>登録</h1>
<form action=reg.pl method=post>
 <table>
  <tr>
   <td> 氏名: 
   <td><input type="text" name="name" placeholder="資格月斗">
  <tr>
   <td> メール: 
   <td><input type="email" name="email" placeholder="shikaku@example.org">
  <tr>
   <td> 電話番号: 
   <td><input type="tel" name="tel"   placeholder="09012345678">
  <tr>
   <td> 生年月日: 
   <td><input type="date" name="birth" placeholder="1999/12/31">
  <tr>
   <td> URL: 
   <td><input type="url" name="url"   placeholder="http://example.org">
  <tr>
   <td> 時刻: 
   <td><input type="time" name="time" placeholder="09:00">
  <tr>
   <td> 検索: 
   <td><input type="search" name="search" placeholder="HTML5 認定">
  <tr>
   <td> 数字: 
   <td><input type="number" name="number"   placeholder="123456789">
 </table>
<input type="submit" name="register">
</form>
</body>
</html>			    
			    

出題範囲の詳細

LPI-Japan
中谷 徹

例題3.16 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
HTML5で、誤植を修正する際の記述として適切なのは次のうちどれか。
  • アーカイブを<ng>回答</ng><ok>解凍</ok>できない。
  • 私は<err>隠し事</err><corr>書く仕事</corr>が得意です。
  • 漢字の<del>返還</del><ins>変換</ins>ミスに気をつけよう。
  • 田舎町に有名歌手が<typo>音ずれ</typo><fix>訪れ</fix>た。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは Cです。
HTML5では、del要素で削除箇所をins要素で追記箇所がわかるように記述することができます。
多くのブラウザでは、削除箇所は取り消し線付きで表示し、追記箇所は下線付きで表示されます。
したがって、正解はCです。

del要素、ins要素ともにdatetime属性で修正日時を、cite属性で引用元のURLを記述することができます。

なお、A、B、Cの要素はありません。

出題範囲の詳細

LPI-Japan
中谷 徹

例題3.15 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
object要素は、画像、音声、HTML文書など様々な外部リソースを文書内に取り込む際に使用しますが、次のうち指定方法として適切なものを1つ選べ。
  • <object href="sample.svg" …>
  • <object data="sample.mpg" …>
  • <object embed="sample.swf" …>
  • <object src="sample.gif" …>

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは Bです。
object要素は、data属性でファイルを指定し、type属性でMIMEタイプを指定することで文書内に外部リソースを埋め込んで表示することができます。したがって正解は B です。

A.のhref属性は、a要素、area要素、link要素でのリンク先の指定や、base要素での基準となるURLを指定することに使用します。
C.のembedは要素で、src属性を指定して画像などの埋め込みに使用しますが、object要素の属性ではありません。
D.のsrc属性は、embed要素やimg要素で参照先を指定するときなどに使用しますが、object要素の属性としては使用できません。

出題範囲の詳細

LPI-Japan
中谷 徹

例題3.14 「1.3.3 インタラクティブ要素」
レベル1の出題範囲「1.3.3 インタラクティブ要素」からの出題です。
下記のように、画面に「▶︎詳細」と表示し、「詳細」をクリックすると「詳細な説明」を表示したり、非表示にしたりするHTML5の記述は次のうちどれか。余分な文字を表示せず、正しく動作するものをすべて選びなさい。
      ▶︎詳細
	 ⇅ 
	  ▼詳細
	  詳細な説明
     
  • <summary>詳細
    <details>詳細な説明</details>
    </summary>
  • <details>
    詳細な説明
    </details>
  • <details>詳細
    <summary>概要</summary>
    詳細な説明
    </details>
  • <details>
    詳細な説明
    <summary>詳細</summary>
    </details>

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは B、D です。
details要素は、<details>タグで囲われた部分を非表示にし、必要に応じて利用者がクリックすることで参照できるようにできます。summary要素は、details要素の子要素で、省略時に表示される「詳細」(ブラウザにより異なる)を別の文字列に置き換える。

出題範囲の詳細

LPI-Japan
中谷 徹

例題3.13 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
次の要素のうち、セクションに分類される要素をすべて選びなさい。
  • header
  • nav
  • main
  • aside
  • footer

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは B、D です。
HTML5の要素のうち、セクションに分類される要素(Sectioning content)は、「section」「article」「aside」「nav」の4種類のみです。
HTML5プロフェッショナル認定試験を受験するのであれば、この4種類の要素については、しっかりと確実に覚えておく必要があります。headerとfooterは、それらを含むもっとも近いセクション(またはセクショニング・ルート)のヘッダーとフッターとなります。
mainは(セクションではなく)文書全体におけるメインコンテンツの範囲を示す要素です。header・footer・mainは、要素のカテゴリーとしては Flow content に含まれます。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
 HTML5レベル1認定者 大藤 幹 氏

例題3.12 「1.3.2 メディア要素」
レベル1の出題範囲「1.3.2 メディア要素」からの出題です。
videoタグを使って動画圧縮規格がh.264の映像を表示する場合、sourceタグに設定する適切なtype属性を選びなさい。
  • video/mp4
  • video/ogg
  • video/h264
  • video/webm
  • video/264

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは A です。
A:コンテナフォーマットがmp4の場合に設定します。mp4コンテナフォーマットには動画圧縮規格h.264が使われていますので、Aが正解です。

B:コンテナフォーマットがogg/ogvの場合に設定します。ogg/ogvコンテナフォーマットにはTheoraという動画圧縮規格が使われています。
C:sourceタグのtype属性に設定できるものに、「video/h264」は存在しません。
D:コンテナフォーマットがwebmの場合に設定します。webmはVP8という動画圧縮規格が使われています。
E:sourceタグのtype属性に設定できるものに、「video/264」は存在しません。

出題範囲の詳細

例題解説の提供:株式会社 デジタル・ヒュージ・テクノロジー
 豊田 健次 氏

例題3.11 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
role属性の機能として正しいものを1つ選びなさい。
  • ユーザーが独自の属性を追加する。
  • 要素を回転させる角度を指定する。
  • 既存の要素の役割・意味を上書きして変更する。
  • ゲームキャラクターの特性を示す。
  • ユーザーインターフェイスの状態や特性を示す。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは C です。
role属性のroleは「役割」という意味で、既存の要素が持っている「役割・意味」とは異なる「役割・意味」を上書きして与えることのできる属性です。たとえば、既存のHTMLの要素にはユーザーインターフェイスとしての「タブ」や「ツリーウィジェット」をあらわす要素はありませんが、role属性を使用することでli要素やdiv要素などをタブ要素やツリーウィジェット要素に変更することができます(それによってスクリーンリーダーなどの支援技術がタブやツリーウィジェットを正しく認識できるようになります)。role属性の詳細な仕様は、HTML5とは別のWAI-ARIA 1.0という仕様書で定義されています。

Aはカスタムデータ(data-*属性)属性の説明です。BとDのような属性はHTML5にはありません。Eは、role属性と同じくWAI-ARIA 1.0の仕様書で定義されているaria-*属性の説明です。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.10 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
次のうち、mark要素としてマークアップするのにふさわしいものをすべて選びなさい。
  • 製品名やキーワード
  • 中国語の固有名詞
  • 検索結果の表示における検索語
  • スペルが間違っている単語
  • 引用文の中で読者に注目してもらいたい部分

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは C、 E です。
mark要素は、一般的なブラウザでは蛍光ペンでマークしたような表示となります。このことからもわかるように、オリジナルでは通常のテキストである部分を、そのWebページの読者に注目してもらうためにハイライト表示させるのがmark要素の役割です。

Aの製品名やキーワードについては、HTML5ではb要素を使用します。Bの「中国語の固有名詞」とDの「スペルが間違っている単語」については、HTML5ではu要素を使用することになっています。

テキスト関連の要素とその代表的な用途はしっかりと覚えておきましょう。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.9 「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
time要素で指定する日時の書式として間違っているものを1つ選びなさい。
  • <time>02:50</time>
  • <time>2時50分</time>
  • <time datetime="02:50">真夜中</time>
  • <time datetime="2015-12-24T02:50">2時50分</time>
  • <time datetime="2015-12-24 02:50:00">ニ時五十分</time>

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは B です。
time要素は、datetime属性が指定されている場合は、その値を仕様書で定められている機械読み取り可能な書式にする必要があります。datetime属性が指定されていない場合は、time要素の要素内容のテキストを機械読み取り可能な書式にする必要があります。

Bにはdatetime属性が指定されていないため、要素内容を機械読み取り可能な書式にする必要があります。しかし、「2時50分」というテキストは仕様書で定義されている機械読み取り可能な書式には含まれていません。よって、答えはBです。

C、D、Eについては、要素内容は機械読み取り可能な書式ではありませんが、datetime属性の値が正しい書式で書かれているため問題ありません。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.8「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
HTML5において、form要素の外部にあるフォーム関連要素をform要素と関連づける際に使用する属性はどれか。次の選択肢から1つ選びなさい。
  • for属性
  • form属性
  • rel属性
  • formlink属性
  • formassociate属性

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは B です。
フォーム関連要素にform属性を指定し、その値にform要素のid属性の値を指定することで、フォーム関連要素の配置場所にかかわらず特定のform要素と関連づけることができます。form属性が指定できるのは、input要素、textarea要素、select要素、button要素、output要素、keygen要素、label要素、fieldset要素、object要素です。
ただし、form属性を実際に使用する際は、ブラウザの対応状況に注意する必要があります。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.7「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
HTML5で「長万部」という漢字にルビをふる際のマークアップとして文法的に正しくないものをすべて選びなさい。
  • <ruby>長万部<rt>おしゃまんべ</ruby>
  • <ruby>長万部<rt>おしゃまんべ</rt></ruby>
  • <ruby>長万部<rp>(</rp><rt>おしゃまんべ</rt><rp>)</rp></ruby>
  • <ruby><rb>長万部<rp>(<rt>おしゃまんべ<rp>)</ruby>
  • <ruby><rtc><rb>長万部</rb><rt>おしゃまんべ</rt></rtc></ruby>

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えは E です。
ruby要素の最初の子要素には、ルビを振る対象となるテキスト(phrasing content)またはrb要素を配置する必要があります。したがって、最初の子要素としてrtc要素を配置しているEは文法的に正しくありません。ルビを振る対象となるテキストは、rb要素のタグを付けても付けなくても問題はありませんが、rb要素のタグを付けることでそこにCSSが指定しやすくなるなどの利点もあります。
ruby要素自体はタグを省略することはできませんが、その内容となるruby関連の各要素は終了タグを省略することが可能です。
ルビ関連の要素は、要素名が何の略なのかをおぼえておくと記憶しやすくなります。たとえばrtは「ruby text」の略で、それがルビのテキスト(振仮名となるテキスト)であることを示しています。rtcは「ruby text container」の略なので、そこにrt要素を入れるということがわかります。rb要素のbは「base text」を意味し、rp要素のpは「parentheses(パーレン=丸括弧)」を意味しています。
なお、XHTML1.1ではrbc要素が定義されていましたが、HTML5ではrbc要素は定義されていません。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.6「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
次の要素のうち、セクションを示す要素ではないものはどれか。1つ選びなさい。
  • nav
  • main
  • aside
  • article
  • section

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え B
HTML5の要素のうち、セクションを示す要素(カテゴリーが「Sectioning content」に該当する要素)は、nav・aside・article・sectionの4種類のみです。main はセクションとはならず、文書のアウトラインにも影響を与えない要素です。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 大藤 幹 氏

例題3.5「1.3.2 メディア要素」
レベル1の出題範囲「1.3.2 メディア要素」からの出題です。
動画ファイルの埋め込みに関係するHTML要素を次の選択肢から全て選びなさい。
  • source要素
  • video要素
  • movie要素
  • control要素
  • volume要素

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え A、B
動画ファイルの埋め込みは、video要素単独で記述する書式と、video要素とsource要素を組み合わせて記述する書式があります。
source要素を使う場合には、video要素の子として複数の動画ファイルを再生候補として指定できます。その場合、Webブラウザは上から順に利用可能なファイルをチェックします。
なお、他の選択肢は存在しない架空のものです。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル1認定者 林 拓也 氏

例題3.4「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの出題です。
ページのタイトルおよび本文に対してエンコードの種類を指定するcharset属性の記述位置として最も適切なものを選びなさい。

エンコード指定の記述:
<meta charset="UTF-8">

記述先のコード:
<!DOCTYPE html>
<html lang="ja">
(A)
<head>
	(B)
	<title>...</title>
	(C)
</head>
(D)
<body>
	(E)
 ...
</body>
</html>

  • (A)の位置に記述する
  • (B)の位置に記述する
  • (C)の位置に記述する
  • (D)の位置に記述する
  • (E)の位置に記述する

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答えB
meta要素のcharset属性は、本文だけではなくタイトルのエンコードに関する種類を指定できます。
この記述はコードの<head>内に記述する必要があります。
またタイトルに対しても指定する場合は、<title>より前に指定しなければなりません。
問題の選択肢では、<head>内にあり<title>より前に位置しているのは(B)のみです。
よって正解はBとなります。

出題範囲の詳細

例題解説の提供:メディアスケッチ株式会社
代表取締役 兼 株式会社コーデセブン 取締役CTO 伊本 貴士 氏
ITコンサルタント業を中心に、Webサービスの開発や、オープンソースシステムの構築・保守なども行っている。

例題3.3「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「1.3.1 要素と属性の意味(セマンティクス)」からの例題を解説します。
以下の説明に関する要素名の組み合わせで正しいものを選びなさい。

(1) コンピュータコードを表すために利用される要素である。
(2) コンピュータコードや数学における変数を示す場合に利用される要素である。
(3) コンピュータからの出力内容を示す場合に利用される要素である。
(4) コンピュータからの入力内容を示す場合に利用される要素である。

  • (1) pre (2) samp (3) var (4) kbd
  • (1) pre (2) var (3) samp (4) kbd
  • (1) pre (2) var (3) kbd (4) samp
  • (1) code (2) var (3) samp (4) kbd
  • (1) code (2) var (3) kbd (4) samp

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え D

HTMLには、コンピュータコードを表示するための要素があります。
コンピュータコードとは、XML要素名・ファイル名・プログラムのソースコードなどが含まれます。

プログラムのコードなどを表示する場合はcode要素を使って記述するのが適切です。
多くの主要なブラウザの場合、code要素を使って表示すると等幅フォントで表示されます。

ソースコードを表示する時にcode要素と合わせてpre要素がよく利用されますが、pre要素はフォーマット済みのテキストブロックを示すもの、つまり字下げや改行コードをそのまま表示するための要素であり、コンピュータコードを表すためのものではありません。
よって、A,B,Cは間違いです。

コンピュータコードの変数を示す要素はvar要素、コンピュータからの出力を示す要素はsamp要素、コンピュータからの入力を示す要素はkbd要素なので正解はDです。

出題範囲の詳細

例題解説の提供:メディアスケッチ株式会社
代表取締役 兼 株式会社コーデセブン 取締役CTO 伊本 貴士 氏
ITコンサルタント業を中心に、Webサービスの開発や、オープンソースシステムの構築・保守なども行っている。

例題3.2「1.3.2 メディア要素」
レベル1の出題範囲「1.3.2 メディア要素」からの例題を解説します。
HTML5におけるsource要素に関する説明として、正しいものを1つ選びなさい。
  • コンピュータのコードを表示するための要素である。
  • 文書内のコンテンツが他の情報源からの引用である事を示す要素である。
  • 文書内に、Javascriptやデータブロックを組み込むための要素である。
  • サイトの外部にある画像のURLを指定するための要素である。
  • 動画や音声に関するメディアファイルの種類やURLを指定するための要素である。

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え E
source要素は、video要素やaudio要素の子要素として、メディアファイルの種類やURLを指定するために使われます。よって正解はEです。
Dにある画像のURLに関してですが、ファイルがどこに存在するかに関わらずimg要素のsrc属性で指定します。
Aはcode要素、Bはq要素およびblockquote要素、Cはscript要素に関する説明です。

出題範囲の詳細

例題解説の提供:メディアスケッチ株式会社
代表取締役 兼 株式会社コーデセブン 取締役CTO 伊本 貴士 氏
ITコンサルタント業を中心に、Webサービスの開発や、オープンソースシステムの構築・保守なども行っている。

例題3.1「1.3.1 要素と属性の意味(セマンティクス)」
レベル1の出題範囲「要素と属性の意味(セマンティクス)」からの例題を解説します。
以下のようにHTML5の仕様でマークアップを行い、テキストの一部を“重要なテキスト範囲”として指定し、音声出力における強い表現などを期待したい。コード内の①に入る、最も適切な要素名を選択肢から一つ選びなさい。
<p> <①>重要なお知らせ!</①> 明日の集合時間は7時に変更となりました。</p>
  • mark
  • s
  • strong
  • b
  • i

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

答えはこちら

答え C
Aのmark要素は、ハイライト表示を行うために使う要素でテキストの重要性を指定するものではありません。Bのs要素は、正確でなくなった情報について指定し、一般的なブラウザでは打ち消し線が引かれますので不正解です。Cのstrong要素は、重要な部分を指定するために定義されているものなので正解です。Dのb要素で囲まれたテキストは、一般的なブラウザでは太字表示されます。しかし、これはHTML5においては文体を変えるために使うものであって、重要性を指定するためのものではないと明示されています。よって不正解です。Eのi要素は、一般的なブラウザでは斜体表示されるものですが、重要性を指定するためものではありません。HTML5でマークアップする際は、似たような表示を行う要素でも、それぞれ使用する場面の想定が違う場合があるので気をつけましょう。

出題範囲の詳細

例題解説の提供:メディアスケッチ株式会社
代表取締役 兼 株式会社コーデセブン 取締役CTO 伊本 貴士 氏
ITコンサルタント業を中心に、Webサービスの開発や、オープンソースシステムの構築・保守なども行っている。

このページの先頭へ