概要
すべてのWebページは、見た目がどうであれ、その裏側は「タグ」と呼ばれるラベル付きの区画からなるHTMLで構成されており、ページの各部分が何であるかをブラウザに伝えています。すべてのページが持つべき骨格を作るのが3つのタグです。<html>(文書全体をWebページとして示す)、<head>(ページ内には直接表示されない、タイトルや説明文などの裏方情報を格納する)、<body>(訪問者が実際に目にしてクリックできるすべてを格納する)です。
この基本HTML構造のチェックは、単にこの3つのラップ用タグが存在し、正しく使われているかを確認するものです。この骨組みなしにページの内容がそのまま出力されていないかを見ています。
重要な理由
ブラウザは非常に寛容で、この構造が欠けていたり壊れていたりしても、たいていはページを表示してしまいます。そのため、この問題は長期間気づかれずに残ることがあります。しかし、検索エンジンやスクリーンリーダー、翻訳ツール、ブラウザ拡張機能は、実際のコンテンツがどこから始まり、裏方情報がどこにあるのかを把握するためにこの構造に依存しています。これがないと、それらは推測に頼るしかなく、その推測が外れることもあります。
この基本的な骨組みが欠けているページは、途中で失敗したビルドプロセス、壊れたテンプレート、あるいはコンテンツ管理ソフトウェアが完全なページではなく断片を出力しているといった、より深い問題の兆候であることもよくあります。
修正方法
- ページの生のHTMLを表示します(ほとんどのブラウザでは、ページを右クリックして「ページのソースを表示」を選ぶか、
Ctrl+UまたはCmd+Option+Uを押します)。 - 最初のタグが
<html>であり、その後に<head>セクション、続いてすべての表示コンテンツを包む<body>セクションがあることを確認します。 - Squarespace、Wix、Webflow、WordPressなどのWebサイトビルダーを使っている場合、この構造は自動的に生成されます。構造が欠けている場合は、追加したカスタムコードの埋め込みやテンプレートが干渉していることが多いので、追加したカスタムHTMLブロックを確認してください。
- 自分でテンプレートや静的サイトジェネレーターを管理している場合は、ベースとなるテンプレートファイルが各ページのコンテンツをこの3つのタグで包んでおり、誤って編集されていないか確認してください。
- 変更後にLaunch Readinessのチェックを再実行し、構造が正しく検出されるようになったか確認しましょう。