avoid-inline-spacing
インラインスタイルでテキストの間隔をWCAGの基準値未満に固定してはいけません
インラインスタイルで!importantを使ってline-height、letter-spacing、word-spacingを固定している場合に、その値がすでにWCAG 1.4.12を満たしていて、ユーザーが上書きする必要がないことを確認します。
適用範囲：独自の可視テキストを持つレンダリングされた要素のうち、style属性でline-height、letter-spacing、word-spacingを実際の値付きの!importantとして宣言しているものに適用されます。CSS全体キーワード（inherit、initial、unset、revert）は独自の間隔を指定しないため対象外です。
期待される結果：そのような宣言はいずれも、そのプロパティについてWCAG 1.4.12が定める基準値（フォントサイズに対する倍率）をすでに満たしています。line-heightは1.5以上、letter-spacingは0.12以上、word-spacingは0.16以上です。固定された値が達成基準をすでに満たしていれば、ユーザーが上書きする必要はありません。
検出結果が報告する内容：
properties：検出結果の対象となる間隔のプロパティです。各項目はline-height、letter-spacing、word-spacingのいずれかです。failの場合や、折り返さない可能性のあるテキストの場合は、指標を下回る値が強制されているプロパティです。INLINE_SPACING_NOT_RESOLVABLEの場合は、値を求められなかったプロパティです。
これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。
例
<p style="letter-spacing:2px !important">Spaced text</p>
固定されたletter-spacingは、WCAG 1.4.12の最小基準値を上回っています。
<p style="line-height:1.2 !important">The toy brought back fond memories of being lost in the rain forest.</p>
!importantによってline-heightが最小値の1.5未満に固定されており、ページ側のスタイルでは上書きできません。
<p style="line-height:1 !important">Opening hours</p>
テキストが1行に収まるほど短いため、折り返すことがない可能性があり、この達成基準は折り返すテキストだけに適用されます。
確認方法
このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。
INLINE_SPACING_NOT_RESOLVABLE
- レポートに示された要素を調べ、style属性にある!importantの間隔の値を読んでください。
- 開発者ツールの[Computed]タブで、結果として得られるline-height、letter-spacing、またはword-spacingをピクセル単位で読み、フォントサイズの1.5倍、0.12倍、または0.16倍と比べてください。
- WCAG 1.4.12のテキスト間隔（line-height 1.5、letter-spacing 0.12em、word-spacing 0.16em、段落の間隔2em）を、ユーザースタイルシートやブックマークレットなどを使って!importantで適用してください。要素自身の!importantのインラインスタイルが優先されるため、要素が保持する値も控えてください。
- 幅を320 CSSピクセルまで狭め、テキストが切れたり重なったりしていないか確認してください。
満たす場合：強制された値がWCAG 1.4.12の指標を満たしているか、テキストが折り返さないか、間隔を適用しても失われるものがありません。
満たさない場合：折り返すテキストで強制された値が指標を下回り、利用者による間隔の変更を損失なく受け入れられないため、WCAG 1.4.12を満たしません。
INLINE_SPACING_NO_SOFT_WRAP
- レポートに示された要素を調べ、style属性が!importantで強制している間隔のプロパティを控えてください。
- ウィンドウの幅を320 CSSピクセルまで狭め（または400%にズームし）、テキストが2行目に折り返すことがあるか確認してください。
- WCAG 1.4.12のテキスト間隔（line-height 1.5、letter-spacing 0.12em、word-spacing 0.16em、段落の間隔2em）を、ユーザースタイルシートやブックマークレットなどを使って!importantで適用してください。要素自身の!importantのインラインスタイルが優先されるため、要素が保持する値も控えてください。
- テキストが切れたり、重なったり、隠れたりしていないか確認してください。
満たす場合：テキストは折り返さない（1行のままか、スクロールする）うえ、切れたり重なったりしているものもないため、この達成基準は適用されません。
満たさない場合：テキストが実際に折り返し、強制された間隔によって行が重なるかテキストが切り取られるため、WCAG 1.4.12を満たしません。
INLINE_SPACING_SHORT_TEXT
- レポートに示された要素を調べ、style属性が!importantで強制している間隔のプロパティを控えてください。
- ウィンドウの幅を320 CSSピクセルまで狭め（または400%にズームし）、短いテキストが2行に折り返すか確認してください。
- WCAG 1.4.12のテキスト間隔（line-height 1.5、letter-spacing 0.12em、word-spacing 0.16em、段落の間隔2em）を、ユーザースタイルシートやブックマークレットなどを使って!importantで適用してください。要素自身の!importantのインラインスタイルが優先されるため、要素が保持する値も控えてください。
- テキストが切れたり、重なったり、隠れたりしていないか確認してください。
満たす場合：テキストはどの幅でも1行のままか、行が重なったりテキストが失われたりすることなく折り返します。
満たさない場合：テキストが折り返し、強制された間隔によって行が重なるかテキストが切り取られるため、WCAG 1.4.12を満たしません。