Panduan Ikon Sentuh Apple
Saat seseorang menambahkan situs Anda ke layar beranda iOS, Safari menggunakan apple-touch-icon — bukan favicon.ico. Kirimkan 180×180 PNG (atau kotak lebih besar yang diperkecil dengan rapi) dan tautkan ke <head> Anda.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Apple tidak menerapkan penyembunyian pada iOS modern untuk klip web seperti pada aplikasi asli, namun ikon Anda harus tetap berbentuk persegi dengan margin yang aman — pertahankan sisipan logo ~10% sehingga sudut membulat tidak akan memotong karya seni.
Gunakan <link rel="apple-touch-icon" size="180x180" href="/apple-touch-icon.png">. Satu file 180×180 mencakup semua iPhone saat ini; entri opsional 152×152 dan 167×167 membantu tata letak iPad lama.
Cara kerjanya
- 1
Ekspor 180×180 PNG
Dari generator favicon atau pengubah ukuran gambar kami.
- 2
Unggah ke root situs
/apple-touch-icon.png bersama favicon.ico.
- 3
Tambahkan tag tautan
<link rel="apple-touch-icon" size="180x180" href="/apple-touch-icon.png"> di <head>.
Coba sekarang
Hasilkan apple-touch-icon
Pembuat FaviconFAQ
Berapa ukuran apple-touch-icon?+
180×180 piksel untuk iPhone saat ini. Ekspor dari master 512×512 atau 1024×1024.
PNG atau ICO untuk iOS?+
PNG saja. iOS mengabaikan .ico untuk ikon layar beranda.
Apakah saya masih memerlukan favicon.ico?+
Ya — tab dan browser lain masih menggunakan .ico. Ikon sentuh Apple bersifat tambahan.