見出し画像

「#」(半角)を入れるな!!

Webディレクターという仕事は、提案・サイトの設計・進行管理・制作物チェックなど多岐に渡ります。

プロジェクトの山場には公開前のデバック(チェック)工程が待っていますが、そこで陥りがちなワナを見つけてしまったので記しおきます。
※すべての環境で再現性があるかまでは不明です。

HTMLコーディングの際、リンク先が決まった状態から作業開始できるのはまれで、ひとまずは仮のリンク先として「#」を入れておき、リンク先が決定されたら、HTMLソースの「#」を全検索して後からリンクを挿入していくことが多いです。

上記の工程を経て、エンジニア作業でリンク先が正しく入っているかをチェックするのはディレクターの仕事だと思いますが、ひとつひとつのリンクをクリックして確認していたのは昔の話。昨今はHTMLブラウザのChromeやFirefoxなどの拡張機能でHTMLソースやリンクをチェックしてくれるツールでリンク切れを探すことが多いでしょう。
このリンクチェックツール、サーバー内でリンク先ファイルが無い(404エラー)状況などに効果を発揮してくれます。

しかし!

冒頭で触れた”仮のリンク先”のhtml記述が半角の「#」つまり<a href="#">と記載されていた場合、リンクをクリックすると現在のページに遷移します。これをリンクチェックツールをかけると”リンク先あり”と判断されます。

<a href="">のようにリンク先が入っていない、または<a href=" ">このように半角スペースが入っている場合のいずれも、自ページにリンクするため”リンク先あり”と判断されます。

これではせっかくチェックをしても、思ったような結果が得られずにリンク切れが見過ごされてしまいます。

結論!

リンクチェックツールが”リンク切れ”と判断する条件は、「全角の#」または「全角スペース」(厳密に言えば全角文字なら何でもOK)です。
もちろん、同一ドメイン内のリンク先にファイルが無いリンク先エラーは当然ながらエラーと判断してくれます。

よって、マークアップ時に仮のリンクとして半角「#」を入れることはやめましょう。
(※少なくとも僕の環境ではそうなりました)

この記事が気に入ったらサポートをしてみませんか?