スキルテスト: 高度な HTML テキスト

このスキルテストの目的は、あなたが高度な意味的特徴をマークアップする有名ではない HTML 要素を使用する方法を理解しているかどうかを評価することです。

メモ: 以下の対話型エディターで解決に挑戦することができます。ただし、コードをダウンロードし、CodePenJSFiddleGlitch などのオンラインツールを使用して作業することが便利な場合もあります。

もし行き詰まった場合は、コミュニケーションチャンネルのいずれかから私たちに連絡することができます。

課題 1

この課題では、与えられた HTML に以下のような意味づけを追加していただきます。

  • 2 つ目の段落をブロックレベルの引用にし、その引用がアクセシビリティから引用されたものであることを意味づけしましょう。
  • "HTML" と "CSS" を頭字語として意味づけし、その展開形をツールチップとして提供しましょう。
  • 化学式や日付に正しい意味づけを行い、正しく表示させるように、添字や上付き文字を使用しましょう。
  • 機械読み取り可能な日付とテキストの日付を意味づけしましょう。

完成例はこのようになります。

下記のライブコードを更新して、完成例を再現してみてください。

自分のエディターやオンラインエディターで作業する場合は、この課題の開始時点のものをダウンロードしましょう。