2026/8/31 にチェック · https://www.spiegel.de/
重大な障壁 32 件n · さらに要確認 7 件。
スコアはどのように算出されますか？（開始点 100）
| {n} 件のフォームフィールドに認識可能なラベルがありません | -18 |
| HTML 内で認識可能な名前のないリンクが {n} 件 | -18 |
| HTML 内で名前のないボタンが {n} 件 | -18 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -18 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -6 |
| 配信された HTML に <h1> 見出しがありません | -7 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural} | -2 |
| 結果 | 0 / 100 |
知覚可能
{n} 件のフォームフィールドに認識可能なラベルがありません
JavaScript で設定された aria-label が存在するか確認してください。
input, select, textarea
対応すべきこと: 各フィールドを <label for> 要素と関連付けるか、aria-label / aria-labelledby を設定してください。placeholder だけでは不十分です。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.button-spon
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.button-effi
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.button-mmo
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.button-hbm
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
input::-moz-placeholder, textarea::-moz-placeholder
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
input::placeholder, textarea::placeholder
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
body .richtext--inverted p
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
body .richtext--inverted a
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
body .richtext--inverted a:focus
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.richtextcredit.richtextcredit--inverted a
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.richtextsystem.richtextsystem--inverted a
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.richtextsystem.richtextsystem--inverted a:hover
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.richtextsystem.richtextsystem--inverted a:focus
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-shade-base
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-shade-light
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-shade-lighter
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-shade-lightest
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-white
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.placeholder-shade-base::-moz-placeholder
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.placeholder-shade-base::placeholder
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.hover\:text-shade-lighter:hover
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.hover\:text-shade-lightest:hover
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.hover\:text-white:hover
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.focus\:text-shade-base:focus
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.focus\:text-shade-lighter:focus
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.focus\:text-white:focus
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.disabled\:text-shade-base:disabled
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.disabled\:text-shade-light:disabled
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.peer:disabled~.peer-disabled\:text-shade-base
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.debug.svelte-1x5iokp
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-effi-primary-base
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-elf-primary-base
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-shade-dark
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.text-spon-primary-base
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}
必要: 4.5:1（通常）または 3:1（大きいテキスト）。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの（一部）: {examples}
.disabled\:text-shade-dark:disabled
対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
操作可能
HTML 内で認識可能な名前のないリンクが {n} 件
空のリンク、または alt のないアイコン／画像のみ。JavaScript で設定された aria-label はここでは認識されません。
a
対応すべきこと: 可視のリンクテキストを追加するか、アイコンリンクには aria-label または alt 付きの画像を使用してください。
HTML 内で名前のないボタンが {n} 件
テキストも aria-label もないボタンは、名前が JavaScript で設定されない限り、スクリーンリーダーにとって無音です。
button
対応すべきこと: ボタンのテキストを追加するか、aria-label を設定してください。
配信された HTML に <h1> 見出しがありません
各ページは、ちょうど 1 つの h1 で始めるべきです。JavaScript で構築されるページでは h1 がブラウザーでのみ生成されることがあります — その場合はレンダリング後の DOM を確認してください。
body
対応すべきこと: 意味のある <h1> を最初の見出しとして挿入してください（できればサーバー側で）。
すでに正しく対応済み
- Textalternativen: keine automatisch erkennbaren Probleme
- コンテンツへのスキップリンクがあります
- <main> ランドマークがあります
次のステップ
- {n} 件のフォームフィールドに認識可能なラベルがありません. 各フィールドを <label for> 要素と関連付けるか、aria-label / aria-labelledby を設定してください。placeholder だけでは不十分です。
- HTML 内で認識可能な名前のないリンクが {n} 件. 可視のリンクテキストを追加するか、アイコンリンクには aria-label または alt 付きの画像を使用してください。
- HTML 内で名前のないボタンが {n} 件. ボタンのテキストを追加するか、aria-label を設定してください。
- テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}. テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
- テキストコントラストが不足している可能性のある CSS ルールが {n} 件{nPlural}. テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
毎週の再スキャン、JS レンダリング、新しい障壁が見つかった際のメール — 近日提供。
方法 & 限界
2026/8/31 に、www.spiegel.de がログインなしの初回アクセス時に配信する HTML と、同一ドメインのリンクされた CSS ファイル最大 4 件をチェックしました。チェック対象: 色コントラスト（CSS から）、テキスト代替、フォームのラベル付け、操作要素の名前、見出し構造、ページのタイトルと言語、ズームのロック、重複した id、正の tabindex 値、ランドマーク。
チェック対象外: JavaScript によって生成されるものすべて、キーボード操作性、可視のフォーカス、フォーカス順序、スクリーンリーダーの読み上げ、ログインの背後のコンテンツ、下位ページ。自動テストは WCAG 違反のおよそ 20〜35 % を検出します — 残りは手動チェックが必要です。スナップショットであり、法的判断ではありません。