2019年04月25日カテゴリ:Webサイト運用

こんなHTMLファイル名は嫌だ!知らないと恥ずかしい「名付け」の問題(前編)

こんなHTMLファイル名は嫌だ!知らないと恥ずかしい「名付け」の問題(前編)

Webサイトを運用・運営しているWeb担当者にとって、決して離れられないタスクとして「ファイルの名前付け」(以下「名付け」)があります。

Webサイトに掲載する素材として集まってくるものの中には、さまざまな様式のファイルがバラバラな名前で集まってきたりするので、きちんと管理をしておかねばなりません。
思いつきや行き当たりばったりで適当な名前をつけてしまうと、後から面倒な問題がおきてしまうこともしばしば。

今回はWeb担当者にとって、そんな「名付け」を巡る問題をご紹介します。

誰にとっての「名前」?

「名前」と一口に言っても、Webサイトの管理上はいくつかの切り口があります。

ここでは、特に「ファイル名」について説明するのですが、Webコミュニケーションの中ではそのほかの「名前」として、「ページの名称」や「URLの文字列」なども関連してきます。

  • たどり着いてもらうための名前

    検索エンジン経由の場合、検索結果に青いリンクの文字で表示されている「ページの名前」は対象ページのHTMLファイルのソースの中の「title タグ」の文字列であることがほとんどです(最近の Google は勝手に最適化をするため100%とは言い切れませんが)。

    これは「ファイル名」とは別に、適切な「ページの名前(title タグに指定する文字列)」を決めてあげなくてはなりません。
    他にもSNSにシェアされた時、そのページのタイトル(こちらはog:title)が「ページの名前」として、ユーザーがたどり着けるための手がかりになります。

    そのため客観的に見てわかりやすく、予備知識がなくても「何についてのページか?」がわかるようにしておかなくてはなりません。

  • ページを閲覧している人のための名前

    一方で、そのページ自体を今閲覧している人にとっては、titleタグはあまり認知の対象にはなりません。

    ソースコードの中のtitle タグは、タブブラウザのタブに表示されているはずですが、多くても18文字程度しか表示されません。タブをたくさん開いている状態ではそもそも表示すらされません。

    そんな状態にいるユーザーにとっては、そのページのh1要素(一番大きな見出し要素)が、その「ページの名前」として認識されます。

    SEO(検索エンジン最適化)の観点から、一つのページは一つのテーマに絞った方がよいため1ページにh1が一つ(h要素は検索エンジンが内容を解析する中で重要な要素)で、それがtitle要素と同じ成分を含んでいることがよくあります。

    ただ、titleとh1では、それを目にするユーザーの現在地が違うので、その視点に立ってそれぞれ最適化する(もちろん共通でもそれが最適なら問題なし)必要があります。

  • サイトを管理していく人のための名前

    そして、もう一つの視点としてサイトの管理者としての視点があります。

    企業のWebサイトの場合、人事異動によって管理者は交代することがよくあります。また、ページ数が数百の単位を超えてくると、どんなに優秀な管理者でも記憶に頼る運用が破綻し始めます。

    そのため、ユーザーへのわかりやすさに配慮した上で、管理の上でも引継ぎ可能で理解しやすい、ファイル名にもページ名にも体系的なネーミングルールを持つことが望まれます。

    そして「HTMLファイル名」は、ダイレクトにURLに反映されるため、実はとても重要なのです。よく考えずに適当な名前をつけていると痛い思いをしかねません。

巷で見かける残念なHTMLファイル名日本語のファイル名

さすがに見かけることが少なくなってきましたが、ファイルの確認・修正・再確認などを繰り返している間に「****_mmdd_最終.html」みたいに突如として漢字が紛れ込んでこないとも限りません。

システムによってはエラーを起こさずにきちんと動作できますが、URLとしてはエンコードされて記号だらけの文字列になってしまいます。
原稿をやりとりする段階ではファイル名に痕跡を残していくのも(当事者間では)有効な手段ですが、Webに公開するファイルは名前をきちんと整えてから公開しましょう。

  • 意味がわからないファイル名

    複数のページが階層構造を持っている場合、インデックスページ(カテゴリーとか、なにかの目次やTOPページなど)は、index.htmlというファイル名だけでも役目も意味もわかります。

    しかし、対象のページが下層の詳細ページである場合、その内容を反映したファイル名にしてあげるべきです。

    会社情報の配下に、「代表からのメッセージ」というページがあったとして、「company_02.html」よりは「top_message.html」のほうが、ユーザーにも内部の管理においてもわかりやすく、うっかり何かに書き換えてしまうような(内部事情を考えるとすごく恐ろしい)問題の発生を軽減できるでしょう。

  • 自動命名のワナ

    最近のクラウド化されたファイルシステムは「ファイル名」とは別にIDを持っていて、名前の重複を許容するシステムも出てきていますが、多くのシステムでは名前の重複を許さないために、自動的に別名をつけるような仕組みが働きます。

    CMSの場合も、自動的に「article***」(***は数値)のようにファイル名のデフォルト値をセットしてくれたりします。たまたまシステムの設計上の役割とページの内容がマッチしていればそれでもいいのですが、既存のページをテンプレートがわりにコピーして下敷きにして利用するような場合にワナが潜んでいます。

    コピーした瞬間にファイル名のデフォルト値にコピーであることがわかるような文字列を追加することが多いようです。「_copy_cpoy2_copy3」みたいなのには要注意です。「〜〜のコピー」なんて、日本語ファイル名とのコンボ技で、非常に厄介です。

恥ずかしい以上にやっかいな問題

ファイル名が不適切なまま公開してしまったとしても、リネームしてリダイレクトすればアクセスの経路は保たれます。

しかし、本質的な問題はリダイレクトだけでは解決しません。ファイル名を改めても過去は書き換えられれないのです。

仮にリダイレクトで途中からHTMLファイル名を変更すると、当然URLは変わるので、それまでのアクセスログとは分断されてしまいます。

Webは未来に対してはかなり便利だけど、実は過去に対しては意外と不便なのです。(だからこそデータに価値があり、「データは21世紀の石油」とまで言われる所以がそこにあるとも言えます。)

というわけで、「名付け」は慎重かつ大胆に扱う必要がある重要なタスクなのです。
後編では具体的なネーミング方法をご紹介します。

Getting Betterとは

企業の忙しいWeb担当者(Web担当者)の方のために、コーポレートサイトやオウンドメディアの運営に欠かせない情報やトレンド・ノウハウを解説するブログです。

日々のサイト運営のご参考になれば幸いです。

IMAGICA Lab.のWebサイト構築サービスについてはこちら
https://www.imagica-imageworks.co.jp/web/

「株式会社IMAGICAイメージワークス」は、2018年10月1日に「株式会社IMAGICA Lab.」となりました。

トップへ