はじめに

この記事は 2023 年の MDN 翻訳 Advent Calendar 向けに作成したものです。

こんにちは。debiru です。HTML のことを考えるのが趣味です。

今回は MDN に記載されている内容が正しいとは限らない、盲目的に信用してはいけない、Wikipedia と同じくらい誤りがある可能性があるものである、MDN というものは懐疑的に解釈すべきものであるということをお伝えしていきたいと思います。

h1 要素は複数使うべきではない？

ここでは「h1 要素は複数使うべきではない」という MDN の主張に対して私が殴りにいった話をしていきましょう。

ときどき、「h1 要素はページに1つだけにすべき」「h1 要素を複数使ってはいけない」という主張を Twitter 等で見かけます。そういう人に根拠を訊くと MDN を提示してくることが多いです。

この Togetter https://togetter.com/li/1058977?page=2 を御覧ください。

追記：2022年現在、状況は変わった

h1タグをページ内に複数記述していいか？

その答えがMDNに記載されています。

MDNの日本語版と英語版で温度感がやや異なりますが、いずれも複数h1タグはベストプラクティスではないとされています。

と結ばれています。MDN になんと書いてあったかを次に示します。

当時の MDN 日本語訳

使用上の注意

<h1> はページまたはビューにつき 1 つだけ使用してください。コンテンツの全体的な目的を簡潔に記載すべきです。

複数の <h1> 要素の使用

複数の <h1> を使用することは HTML の仕様では認められていますが、ベストプラクティスとは見なされていません。<h1> を 1 つだけ使用することは、スクリーンリーダーの利用者にとって有益です。

HTML の仕様には、<section> 要素で形成されるアウトラインという概念があります。もしこれが実装されれば、複数の <h1> 要素の使用が可能になり、スクリーンリーダーを含むユーザーエージェントが、セクションの中にネストされた <h1> が小見出しであると理解することができるようになります。しかし、この機能はまだ実装されていません。したがって、見出し要素を適切に使用して文書の概要を記述することが重要です。

アウトラインの状況については、以下の記事で詳しく解説しています。

Computer says no to the HTML5 outline

A decade + a year of heading backwards

当時の MDN 英語版（の日本語訳）

原文を見るよりもその意訳を読んだほうが意味が伝わると思うので、拙訳を載せます。

1つのページに複数の <h1> 要素を使うな

1つのページに複数の <h1> を使うことは、アウトライン・アルゴリズムの概念を含む HTML 仕様の古いバージョンでは許されていました。しかし、これはベストプラクティスとは考えられていませんでした。詳しくは There Is No Document Outline Algorithm をお読みください。

1つのページには <h1> は1つだけ使い、見出しを入れ子にするときは見出しレベルを飛ばさないようにします。

`<h1>` を複数使うことの何が問題なのでしょう

これを読んで、<h1> 要素を複数使ってはならない理由が分かるでしょうか。<h1> と 2 以上の <hn> の使い方を区別する必要性がどこにあるのでしょうか。「ベストプラクティスとは考えられていません」って何を根拠に言っているのでしょうか。アウトライン・アルゴリズムの話は関係ないのですよ？

どうして MDN は <h1> を1回しか使うべきでないと考えてしまっているのでしょうか。

その謎を解明すべく、我々はアマゾンの奥地へと向かった。

MDN に <h1> は1ページに1つしか使うべきでないと書かれています。

しかし、1つだとどのようなメリットがあるのか、2つ以上だと何が問題なのかについては説明がありません。また、ベストプラクティスであると説明されているが、その根拠は示されていない。

一体どうして、<h1> は1つだけが望ましいと言われるようになったのでしょうか？

と質問したものの、あまり良い回答は得られなかった。

それからどうした

"Do not use multiple <h1> elements on one page" とかいうこの Pull-Req によるアップデートは一体何なのか？

何か勘違いしていませんか？アウトライン・アルゴリズムの廃止と、同じページで複数の h1 を使用することの是非には、直接的な関連性はないはずです。

1ページに複数の <h1> 要素を使用しないでください。

この表現は誤解を招くので問題です。h1 の複数回出現を制限するものは仕様にはありません。

といった感じで「根拠は何なん？」と詰めたところ、「1つのページに <h1> は1つしか使うな」というのは言い過ぎた、といった感じのリアクションを得られ、少しだけ表現を弱くしてもらうような Pull-Req を英語版の方で作ってもらうことになった。

本当は抜本的に「<h1> は複数使うべきではない」という謎の主張をこの世から消し去りたかったのですが、私の質問トピックに好意的なコメントがつかない限り、MDN の英語版メンテナとこれ以上バトルしても改善される見込みはないだろうということで、2022年11月時点ではこのちょっとした修正を以て私の質問はクローズすることにしました。

現行版の MDN 日本語訳

1 つのページに複数の <h1> 要素を使用しない

これを読んで、何が言いたいのか理解できる人はいますか？

私は <h1> だろうが <h2> だろうが、見出しなんだから見出しとして何個でも書いていいと思っています。論文を書いたことがあれば、<h1> 見出しを文書中に1個しか使えないという制約が如何に無意味なものなのか想像できるのではないでしょうか。

さて、そんなわけで、MDN には盲目的に信用するとこの世の中に HTML の謎ルールを生み出してしまう可能性があることを指摘させていただき、この記事を終わりたいと思います。

お気づきの方もいるかと思いますが、この記事はだいぶ雑に書かれています。なぜならば、この記事は誰も参加者がいない 2023 年の MDN 翻訳 Advent Calendar の 3 日目の記事を急ごしらえしたものなのです。MDN 関係者、アドベントカレンダー書いてください！書かなきゃ私がまたこういう記事書いちゃうよ！！

おわり。