Cara menambahkan ikon website untuk iPhone, iPad dan iPod Touch

Favicon.ico - Ikon Situs Web di Browser

Sebelum meluncurkan sebuah situs web dan menambahkan file grafis, favicon, untuk ditampilkan di browser, di bilah alamat. Dalam kebanyakan situasi, favicon adalah gambar mini logo grafik atau inisial situs web masing-masing. Favicon ini ditambahkan untuk membantu pengguna mengidentifikasi alamat web di bookmark dengan cepat.

Stealth Settings Favicon

Stealth Settings Favicon di Safari

Favicon di Opera

Favicon di Opera

Sampai saat ini, file ini harus dalam bentuk "favicon.ico", Untuk diidentifikasi oleh browser web. Chrome, Internet Explorer, Opera, Safari, Firefox, dll.
Selama beberapa tahun, dengan memajukan bahasa web baru, HTML5 si CSS3, Favicons bisa menjadi png file atau . Jpg. Kondisi ini bahwa header dari situs, sebelum, Jadilah baris ini:

Ikon Situs Web untuk iOS - iPhone, iPad, dan iPod Touch

In iOS kita dapat menambahkan pintas halaman web pe Home ScreenBPK iPhone, iPad si iPod Touch.

Cara menambahkan shortcut situs di iPhone, iPad dan iPod Home Screen

Kami melakukan ini dengan membuka halaman web di iPhone (Safari, Chrome, browser internet dll), mengklik kotak dengan panah (tanda untuk "berbagi" di iOS), lalu opsiTambahkan ke Layar".

Jika website telah menetapkan favicon untuk browser Anda, tetapi tidak diatur situs ikon khusus perangkat iOS, Layar akan muncul ikon yang terdiri dari pratinjau gambar Halaman web.

Bagaimana menambahkan ikon web untuk iPhone, iPad dan Android.

Langkah pertama adalah untuk membuat gambar ikonYang muncul di Home Screenkomunitas iDevice BPK. Untuk icon web kompatibel pada semua perangkat dan melihat dengan jelas, kita harus membuat gambar untuk semua resolusi iPhone dan iPad.

Resolusi ikon standar dan ukuran untuk iPhone, iPad, iPod dan Android

  • Model iPhone / iPod klasik = 57 × 57
  • iPad = 76 × 76
  • iPhone / iPod Retina = 120 × 120
  • iPad Retina = 152 × 152
  • iPhone 6 / 6S Plus = 180 × 180

Apple diperbarui secara berkala Ukuran icon direkomendasikanURL aplikasi si Halaman Web pe halaman ini.

Untuk perangkat Android, ikon dua dimensi:

  • Android klasik = 128 × 128
  • Android dengan resolusi tinggi (resolusi tinggi) = 192 × 192

ikon

Setelah gambar dibuat, kemudian diunggah ke web server, dan di sumber HTML situs web, sebelum ditutup , baris berikut ditambahkan:

<link href="/apple-touch-icon.png" rel="apple-touch-icon" /> <link href="/apple-touch-icon-76x76.png" rel="apple-touch-icon" sizes="76x76" /> <link href="/apple-touch-icon-120x120.png" rel="apple-touch-icon" sizes="120x120" /> <link href="/apple-touch-icon-152x152.png" rel="apple-touch-icon" sizes="152x152" /> <link href="/apple-touch-icon-180x180.png" rel="apple-touch-icon" sizes="180x180" /> <link href="/icon-hires.png" rel="icon" sizes="192x192" /> <link href="/icon-normal.png" rel="icon" sizes="128x128" />

Untuk perangkat Apple,. Nama gambar .PNG dan "rel =" harus berisi awalan "apple- ". Untuk Android, nama file adalah "icon hires.png"Dan"icon normal.png”Dengan ikon rel =” ”.

Anda tidak perlu membuat gambar untuk setiap resolusi. Anda dapat membuat gambar untuk resolusi tertinggi, dan perangkat dengan resolusi lebih rendah akan mengidentifikasinya dan menetapkannya sebagai ikon.

iPhone Icon Situs Web

Ikon pintasan ke situs web akan terlihat serupa dengan yang lainnya aplikasi untuk iOS.

Cara menambahkan ikon website untuk iPhone, iPad dan iPod Touch

Tentang Penulis

Stealth

Bergairah tentang segala hal gadget dan IT, saya menulis dengan senang hati secara sembunyi-sembunyisettings.com sejak 2006 dan saya ingin menemukan hal-hal baru bersama Anda tentang komputer dan sistem operasi macOS, Linux, Windows, iOS dan Android.

Tinggalkan Komentar