日本語
a11yglass · ウェブサイトのアクセシビリティチェック

2026/9/24 にチェック · https://www.heise.de/

F
0 / 100
重大 5 件 · 要確認 2 件

重大な障壁 5 件n · さらに要確認 2 件。

前回のスキャン以降: 変更なし。

スコアはどのように算出されますか?(開始点 100)
519 件中 40 件の画像に alt 属性がありません-18
4 件のフォームフィールドに認識可能なラベルがありません-18
HTML 内で認識可能な名前のないリンクが 16 件-18
HTML 内で名前のないボタンが 6 件-18
テキストコントラストが不足している可能性のある CSS ルールが 5 件n-18
配信された HTML に <h1> 見出しがありません-7
重複した id 属性が 6 件-7
結果0 / 100
✕コントラスト (1)✕テキスト代替 (1)✕ラベル (3)?構造 (1)✓言語✓ズーム?堅牢性 (1)

知覚可能

重大WCAG 1.1.1 非テキストコンテンツ

519 件中 40 件の画像に alt 属性がありません

JavaScript で後から読み込まれる画像はここには含まれません。

  • <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3377" height="1898">
  • <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1920" height="1079">
  • <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3200" height="1798">
  • <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">

対応すべきこと: 各 <img> に alt を付与してください: 意味のある画像には短い説明、純粋に装飾的なものには alt=""。

重大WCAG 1.3.1 情報及び関係性 / 4.1.2 名前・役割及び値

4 件のフォームフィールドに認識可能なラベルがありません

JavaScript で設定された aria-label が存在するか確認してください。

  • <input type="text" name="q" placeholder="Suchen">
  • <input type="text" name="q" placeholder="Suchen">
  • <select name="in">
  • <input type="text" name="fs" placeholder="Im Preisvergleich suchen">

対応すべきこと: 各フィールドを <label for> 要素と関連付けるか、aria-label / aria-labelledby を設定してください。placeholder だけでは不十分です。

重大WCAG 1.4.3 コントラスト(最低限)

テキストコントラストが不足している可能性のある CSS ルールが 5 件n

必要: 4.5:1(通常)または 3:1(大きいテキスト)。「想定されるページ背景」の場合、実際の背景を確実に判別できませんでした — 疑わしい場合はブラウザーで確認してください。検出されたもの(一部): `.dark a-gift-link dialog`: #e0e0e0 auf #fff (Vorfahren-Hintergrund) = 1.32:1 · `.a-android-native-app-prompt__close-banner`: #323232 auf rgba(0,0,0,0) = 1.64:1 · `a-opt-in[is-active] .opt-in__footnote`: #959595 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 3.00:1 · `.a-android-native-app-prompt__load-app`: #fff auf #27a209 = 3.36:1 · `a-topic .topic-label`: #fff auf #ed3725 = 4.06:1

.dark a-gift-link dialog, .a-android-native-app-prompt__close-banner, a-opt-in[is-active] .opt-in__footnote, .a-android-native-app-prompt__load-app, a-topic .topic-label

対応すべきこと: テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。

操作可能

重大WCAG 2.4.4 リンクの目的 / 4.1.2 名前・役割及び値

HTML 内で認識可能な名前のないリンクが 16 件

空のリンク、または alt のないアイコン/画像のみ。JavaScript で設定された aria-label はここでは認識されません。

  • <a-click-performance>
  • <a name="topnavi.ho.magazine-nav.ct" class="hover:bg-brand dark:hover:
  • <a name="topnavi.ho.magazine-nav.ix" class="hover:bg-brand-alternative
  • <a name="topnavi.ho.magazine-nav.foto" class="hover:bg-brand dark:hove

対応すべきこと: 可視のリンクテキストを追加するか、アイコンリンクには aria-label または alt 付きの画像を使用してください。

重大WCAG 4.1.2 名前・役割及び値

HTML 内で名前のないボタンが 6 件

テキストも aria-label もないボタンは、名前が JavaScript で設定されない限り、スクリーンリーダーにとって無音です。

  • <button class="scroll-left text-ho-text">
  • <button class="scroll-right text-ho-text">
  • <button class="scroll-left text-ho-text">
  • <button class="scroll-right text-ho-text">

対応すべきこと: ボタンのテキストを追加するか、aria-label を設定してください。

要確認WCAG 1.3.1 情報及び関係性 / 2.4.6 見出し及びラベル

配信された HTML に <h1> 見出しがありません

各ページは、ちょうど 1 つの h1 で始めるべきです。JavaScript で構築されるページでは h1 がブラウザーでのみ生成されることがあります — その場合はレンダリング後の DOM を確認してください。

body

対応すべきこと: 意味のある <h1> を最初の見出しとして挿入してください(できればサーバー側で)。

堅牢

要確認WCAG 4.1.1 構文解析(廃止済みだが、関連付けについては依然として重要)

重複した id 属性が 6 件

例: heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle。label-for および aria の関連付けを壊します。

[id]

対応すべきこと: 一意の id を割り当ててください。

次のステップ

  1. 519 件中 40 件の画像に alt 属性がありません. 各 <img> に alt を付与してください: 意味のある画像には短い説明、純粋に装飾的なものには alt=""。
  2. 4 件のフォームフィールドに認識可能なラベルがありません. 各フィールドを <label for> 要素と関連付けるか、aria-label / aria-labelledby を設定してください。placeholder だけでは不十分です。
  3. HTML 内で認識可能な名前のないリンクが 16 件. 可視のリンクテキストを追加するか、アイコンリンクには aria-label または alt 付きの画像を使用してください。
  4. HTML 内で名前のないボタンが 6 件. ボタンのテキストを追加するか、aria-label を設定してください。
  5. テキストコントラストが不足している可能性のある CSS ルールが 5 件n. テキストの色を暗くするか背景を明るくして、それぞれの最小値に達するようにしてください。色を唯一の識別手段として使用しないでください。
このページを自動で監視しますか?

毎週の再スキャン、JS レンダリング、新しい障壁が見つかった際のメール — 近日提供。

アクセシビリティ宣言を作成 →

方法 & 限界

2026/9/24 に、www.heise.de がログインなしの初回アクセス時に配信する HTML と、同一ドメインのリンクされた CSS ファイル最大 4 件をチェックしました。チェック対象: 色コントラスト(CSS から)、テキスト代替、フォームのラベル付け、操作要素の名前、見出し構造、ページのタイトルと言語、ズームのロック、重複した id、正の tabindex 値、ランドマーク。

チェック対象外: JavaScript によって生成されるものすべて、キーボード操作性、可視のフォーカス、フォーカス順序、スクリーンリーダーの読み上げ、ログインの背後のコンテンツ、下位ページ。自動テストは WCAG 違反のおよそ 20〜35 % を検出します — 残りは手動チェックが必要です。スナップショットであり、法的判断ではありません。

オーバーレイ型ウィジェット(コントラストや文字サイズを切り替えるアクセシビリティボタン)では適合になりません。見つかったバリアはソースコードで修正する必要があります。 オーバーレイが役に立たない理由

別のウェブサイトをチェック