この投稿は公式のWebflow Universityを元に作成しました。翻訳したテキストと画像は引用元のものを使用する場合があります。
引用元ウェブサイトを公開する際、ブラウザのUIやモバイルのホーム画面でサイトをどのように表現するかは、最も重要な仕上げの要素の1つです。
このレッスンで学ぶこと
ファビコン Favicon
ファビコンは、ほとんどのブラウザで、ブラウザのタブやブックマークでウェブサイトを表現するために使用されます。
タッチアイコン Touch icons
タッチアイコンまたはWebclipは、Safariのブックマークなどで使用されます。
これらは、ウェブサイトへのリンクがスマートフォンのホーム画面に保存されたときにも表示されます。
画像アセット
ウェブアイコンの画像アセットを準備する際、ファビコンとして使用する32x32ピクセルの画像と、Webclipまたはタッチアイコンとして使用する256x256ピクセルの画像を作成してください。
これらの画像アセットで使用するファイル名は、HTMLで表示されるため、検索エンジンにインデックス化されたくない内容をファイル名に含めないように注意してください。
アイコンのアップロード
画像アセットの準備が完了したら：
- Project Setting > General tab > Icons
- 準備した画像をアップロード
- 変更を反映するためにサイトを公開
- ブラウザでライブサイトを更新して、更新されたファビコンを確認します
目次
トップへ