意味のある順序（HTML）
各ページは、基になるコードの上から下へ、コンテンツを一直線に読み進めた場合でも意味が通るようにしてください。Silktideではこれを自動的に判定できないため、このチェックでは自分で確認するよう求めます。
ページの視覚的なレイアウトとは一致しないことがあります。スタイルによって要素を画面上のどこにでも配置できますが、はに記述されている順序でページを読み上げます。両者が異なる場合、たとえば、内容より前にサイドバーが記述されていたり、価格が対応する商品から離れていたりすると、ページを順番に体験する人にとって、内容が誤解を招く可能性があります。
重要な理由
多くの訪問者は、レイアウトではなく一連の流れとしてページを体験します。スクリーンリーダーで聞いている人、キーボードで操作している人、コンテンツが再配置されるデバイスを使っている人などです。意味が視覚的な配置だけに依存していると、そうした訪問者には、適用すべき手順の後に説明が読み上げられたり、質問から切り離された回答が読み上げられたりする可能性があります。コンテンツ自体はすべて存在していても、そこから伝わる話の流れが正しくなくなります。
修正方法
これは手動で確認します。ページを確認するには、次の手順に従います。
- スクリーンリーダーでページを読み上げるか、ブラウザーのリーダービューを使用し、聞こえてくる内容が目で見た内容と同じ流れになっていることを確認します。
- または、ブラウザーの開発者ツールでスタイルを無効にし、ページを上から下へ通常のコンテンツとして読みます。
- 順序が正しくない場合は、HTML内の要素を並べ替えて、ソースコードの順序が意味の流れと一致するようにし、視覚的な配置にはCSSを使用します。flexboxの
orderなど、コンテンツを視覚的に並べ替えるCSSには注意してください。これは見た目を変えますが、音声で読み上げられる順序は変えません。
Silktideによるテスト方法
Silktideでは、ページの読み上げ順序が意味の流れと一致しているかどうかを自動的に判定できません。そのため、このチェックでは、手動で確認するためのレビュー項目をページごとに1つ作成します。ページを確認したら、レビューを完了としてマークしてください。