仕様と根拠

照合の規則

リンクの # の後ろ(フラグメント)が空なら、ページの先頭に届きます。そうでなければ、まず同じ文字列の id を持つ最初の要素を探し、なければ name が同じ a 要素を探します(WHATWG HTML)。大文字・小文字は区別します。どちらもなければパーセントデコード(UTF-8)した文字列で同じ照合をし、それでもなければ届きません。

特別な名前

デコード後の文字列が大文字・小文字を無視して、ページの先頭を表す 3 文字の名前(t・o・p)に一致し、同名の id もなければ、先頭に届く扱いです。同名の id があるときは、その要素が優先されます。

固定ヘッダーの目安

固定ヘッダーの高さを入力すると、html の scroll-padding の上側と、飛び先の要素の style 属性にある scroll-margin の上側の合計が、ヘッダーの高さ未満の飛び先を警告します(MDN)。ピクセル以外の単位は判定できません。目安であり、実際の表示は確認してください。

根拠にした仕様・資料

指摘の段階

• エラー: 仕様に反していて、正しく読めない・処理できない入力です。
• 警告: 読めるものの、仕様の推奨に反する・矛盾する・意図と違う結果になりやすい入力です。
• 情報: 誤りではありませんが、知っておくとよい扱い(読み飛ばした部分や解釈)です。

入力の扱い(送信しない仕組み)

処理はすべてお使いのブラウザの中で行います。処理の本体はこのサイトから配信する小さなスクリプト(/app.js)で、外部のサービスやライブラリを読み込みません。ページはブラウザに通信を禁止させる設定(Content-Security-Policy の connect-src)つきで配信しており、入力した内容がサーバーや第三者へ送られることはありません。ファイルを選んだ場合も、端末の中で読み込むだけです。

このツールでできないこと(制約)

• 貼り付けた HTML の中だけを照合します。別のページの id へのリンクや、外部のアドレスへの問い合わせはしません。
• JavaScript で後から作られる要素の id や、フレームワークが実行時に付ける id は読み取れません。
• 固定ヘッダーの点検は、style 要素の html・:root の指定と、飛び先の style 属性だけを読む簡易的なものです。外部の CSS ファイルは読めません。
• HTML の構文の誤りを補う複雑な解釈(ブラウザの修復)には対応しません。