の Apple タッチ アイコン apple-touch-icon.webp ファイルとしても知られるこのファイルは、Favicon と同様に、Apple iPhone、iPod Touch、iPad の Web ページ アイコンとして使用されます。このシンボルは、ユーザーが Web サイトをブックマークしたりホーム画面に追加したりするたびに使用されます。これらの Apple 製品は Web サイトのスナップショットを使用しますが、このファイルが見つからない場合、Web サイトは多くの場合、単なる白い四角形に過ぎません。
HTML で場所が指定されていない限り、このファイルは 57 x 57 の寸法の .webp であり、ホーム ディレクトリに配置される必要があります。このタグが HTML 内でどのように表示されるかを以下に示します。
|_+_|レスポンシブ Web サイトの Apple Touch アイコンを作成するには?
Apple Touch アイコンは、消費者がデータを保存するときに使用されます。 Webサイト iOS タッチ スクリーン デバイスのホーム画面に移動するか、ブックマークします。ユーザーが指定しない場合、Apple は Web サイトのスクリーンショットをアイコンとして使用しますが、その場合、認識できない四角形が表示されることがよくあります。顧客に標準以下の Apple アイコンを強制的に表示させないよう、ユーザーフレンドリーな Web サイト用に独自の Apple Touch アイコンを開発する方法を説明します。
Apple Touchアイコンを作成する
Apple Touch アイコンは、初期段階で Photoshop または別の画像エディターで作成する必要があります。ファイルは「apple-touch-icon.webp」という名前で保存し、サイズは 180 x 180 ピクセルにする必要があります。
Web サイトの Apple Touch アイコン ファイルを追加します。
次のステップは、Apple Touch Icon ドキュメントを Web サイトにアップロードすることです。好きな場所に保存できますが、メインの写真フォルダーに保存することをお勧めします。次のフェーズで使用するため、ファイルの保存場所を記録しておいてください。
Link 要素を利用して、Apple Touch アイコンを定義します。
最後のステップは、ページの HEAD 要素に追加するリンク要素で最新の Apple Touch アイコンを特定し、名前を付けることです。