ファビコン(favicon)

概要と技術的な仕組み

ブラウザのタブ・ブックマーク・閲覧履歴などで、サイトを識別するために表示される小さなアイコン（「Favorite Icon」の略）。

一般的に 16×16〜512×512px の正方形画像で、SVG・PNG・ICO 形式などで用意し、HTML の <link rel="icon"> タグで指定する。

現場の核心：ブランドの最小単位と CTR（クリック率）への影響

担当者が持つべきポイントは「ファビコンはブランドの最小単位である」という意識。

現代ではブラウザのタブ切り替え時の目印になるだけでなく、「Google の検索結果一覧（SERP）にもファビコンが表示される」ようになっている。そのため、視認性の高い魅力的なファビコンが設定されているかどうかで、検索結果からのクリック率（CTR）が大きく変動する。ユーザー体験とアクセス数の両方を支える重要な要素である。

実務での手配と実装のリアル

• デザイナーへの先回り発注：新規サイト構築やリニューアルの際、ロゴ制作と同時に「ファビコン専用デザイン（＋ Apple Touch Icon などのスマホホーム画面用アイコン）」を一緒に手配しておくと取りこぼしがない。
• CMS での実装：昔は複数解像度（16 / 32 / 192 / 512px）を個別に用意するのが面倒だったが、現代の実務では、WordPress 等の CMS の標準機能（サイトアイコン設定）を使い「512×512px の高解像度画像を 1 枚アップロードして自動生成・リサイズさせる」のが主流かつ手軽である。

やってはいけない「現場の落とし穴」と防衛策

• ロゴの「そのまま縮小」による潰れ：横長のコーポレートロゴや、複雑な文字が入ったロゴをそのまま縮小して設定してしまい、16×16px の小さなタブで見たときに「ただのモヤモヤした汚れ」のような何だか分からない画像になる。※必ず、ブランドの頭文字 1 文字やシンボルマークのみを抽出した「シンプルな図案」にデザインし直すこと。
• 初期設定の放置：設定を忘れ、ブラウザ標準の「地球儀マーク」や、レンタルサーバー会社のロゴ（WordPress の W マークなど）がそのまま表示され、検索結果でユーザーに「怪しい・素人っぽいサイト」という不信感を与えてしまう。