達成基準 4.1.1 の失敗例 - 開始タグ及び終了タグ、又は属性のマークアップを誤って使用している

達成方法に関する重要な情報

この達成方法 (参考) の使用法と、この達成方法が WCAG 2.1 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.1 を満たすコンテンツを作成するために使用できることを意味するものではない。

適用 (対象)

マークアップ言語: HTML、XHTML、及び他の SGML 又は XML ベースのウェブコンテンツ技術

これは達成基準 4.1.1: 構文解析 (失敗例) に関する達成方法である。

解説

この失敗例の目的は、要素タグにおいて、支援技術が満足できるページのモデルを生成できない原因となるマークアップの誤りの例を特定することである。ユーザエージェントは、エラーから復旧するために、異なる推測に基づいた方法をそれぞれ実装している。結果として、ユーザエージェント間で一貫性のないページのプレゼンテーションとなっている。

(これは完全なリストではないが) この失敗例の条件を生じさせる開始及び終了タグの一般的な問題:

事例

事例 1: XHTML の山形括弧が足りない

開始タグに山形括弧がなく、タグの意図する境界が不明瞭であるため、下記のコードは失敗となる。

<p This is a paragraph</p>

事例 2: XHTML の終了タグのスラッシュが足りない

終了タグにスラッシュがなく、事実上、別の開始タグのように見えるため、下記のコードは失敗となる。

<p>This is a paragraph<p>

事例 3: 均衡が取れていない属性の引用符づけ

属性値に終了の引用符がないことで、属性と値の対の境界が不明確となるため、下記のコードは失敗となる。

<input title="name type="text">

事例 4: 属性間の空白の欠如

属性間に空白がないことで、属性と値の対の境界が不明確となるため、下記のコードは失敗となる。

<input title="name"type="text">

事例 5: 空白スペースを含む値を持つ引用符がついていない属性

属性値に引用符がつけられておらず、値に空白が含まれていることで、属性と値の対の境界が不明確となるため、下記のコードは失敗となる。

<input title=Enter name here type=text>

事例 6: XHTML の終了タグが足りない

第 1 パラグラフの終了タグがないことで、第 2 パラグラフが第 1 パラグラフの子なのか兄弟なのかが不明確になるため、下記のコードは失敗となる。

<p>This is a paragraph
<p>This is another paragraph</p>

検証

手順

  1. ページのソースコードがマークアップ言語で実装されていることを確認する。
  2. 開始タグ、終了タグ又は属性で不正な形式になっているものがあるかどうかを確認する。

期待される結果

  • 手順 2.の結果が真である場合、この失敗例の条件は適用され、コンテンツは達成基準を満たしていない。