HTML スマホのブックマークなどで表示されるアイコン画像の設定方法
スマホのブックマークなどで表示されるアイコン画像はapple-touch-iconで設定できます。
以下は、apple-touch-iconを設定する方法です。
- 180ｘ180ピクセルのアイコン画像を用意する
apple-touch-iconには、180ｘ180ピクセルの画像を用意する必要があります。画像フォーマットは、PNG、JPEG、またはGIFを使用できます。 - HTMLヘッダー内にリンクタグを追加する
用意したアイコン画像を、HTMLのヘッダー内にリンクタグとして追加します。以下は、例として設定するコードです。
bash
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
この例では、アイコン画像のファイル名が「apple-touch-icon.png」であり、ルートディレクトリに置かれていると仮定しています。実際のファイル名や場所に合わせて適宜変更してください。
- キャッシュのクリア
apple-touch-iconの設定をした場合、キャッシュが残っている可能性があるため、キャッシュをクリアする必要があります。ブラウザのキャッシュをクリアする方法は、ブラウザによって異なりますが、通常は設定画面からキャッシュを削除することができます。
以上が、apple-touch-iconの設定方法です。
