Geçerli bir apple-touch-icon sağlamıyor

iOS Safari kullanıcıları Progresif Web Uygulamaları (PWA) görünen simgeye Apple dokunmatik simgesi denir. Uygulamanızın kullanması gereken simgeyi belirtmek için Anahtar kelimelerinizin <head> içindeki <link rel="apple-touch-icon" href="/example.png"> sayfasını ziyaret edin. Sayfanızda bu bağlantı etiketi yoksa iOS, dokümanın ekran görüntüsünü alarak bir simge oluşturur. emin olun. Başka bir deyişle, iOS'a bir simge indirmesini söylemek daha gösterişli bir en iyi uygulamaları paylaşacağız.

Lighthouse Apple dokunmatik simgesi denetimi nasıl başarısız olur?

Lighthouse <link rel="apple-touch-icon" href="/example.png"> içermeyen sayfaları işaretler etiketi <head> içine bildirir:

Geçerli bir apple-touch-icon sağlamıyor

Lighthouse, simgenin gerçekten var olup olmadığını veya simgenin doğru boyut.

Apple Touch simgesi nasıl eklenir?

  1. Sayfanızın <head> bölümüne <link rel="apple-touch-icon" href="/example.png"> ekleyin:

    <!DOCTYPE html>
<html lang="en">
  <head>
    …
    <link rel="apple-touch-icon" href="/example.png">
    …
  </head>
  …

  2. /example.png kısmını, simgenize giden gerçek yolla değiştirin.

ziyaret edin.

İyi bir kullanıcı deneyimi sağlamak için aşağıdaki şartların karşılandığından emin olun:

  • Simge 180x180 piksel veya 192x192 pikseldir
  • Simge için belirtilen yol geçerli
  • Simgenin arka planı şeffaf değil

Kaynaklar