Web sitelerinde, tarayıcı başlığında görüntülenen ve favicon dediğimiz site logoları Apple’ın IOS işletim sistemlerinde görüntülenmiyor. Ama bu tarz logo görüntüleri, sitemizin markalaşması için önemli bir etki taşıyor. Dolayısıyla, örneğin bir iphone kullanıcı, sitemizin kısayol bağlantısını anasayfasına eklediğinde, marka bilinirliği açısından kendi logomuzun görünmesinin çok etkili olacağını düşünüyorum. Zaten SEO testlerinde de sitenizde Apple için bir ikon ayarlaması yapıp yapmadığınıza göre de puanlanlama değişiyor. IOS için, sitenize ait bir uygulama geliştirmemişseniz, sitenize bir Apple ikon eklemeyi düşünebilirsiniz.
Web Sitesine Apple İkonu Eklemek
Burada sizlerle, kendi sitemde, hazırladığım diğer sitelerde ve wordpress tema çalışmalarımda kullanmaya başladığım siteye Apple ikonu ekleme yöntemini paylaşmak istiyorum.
Öncelikle logo için fazla ayrıntılı ve karmaşık olmayan ama markanızı/sitenzi doğrudan yansıttığına emin olduğumuz bir png resmi seçmelisiniz.
Sitenize Apple ikonu olarak ekleyeceğiniz resmi retina ekranlar için en iyi sonucu elde etmek üzere 144×144 ölçülerinde boyutlandırın.
Resminizi “apple-touch-icon.png” adıyla kaydedin.
İkon olarak belirlediğiniz bu resmi, sitenizin tercihen ana dizinindeki resim klasörüne (çoğu kez images) atın.
Sayfanızın <head></head> etiketleri arasına (resmi yerleştirdiğiniz dizini de gözeterek) şu tanımlama kodunu yerleştirin: <link rel=”apple-touch-icon” href=”images/apple-touch-icon.png”>
Hepsi bu kadar. Artık sitenize IOS ikon desteği de vermiş oldunuz.Eklediğiniz bu ikon, standart olarak köşeleri yuvarlatılmış ve üst tarafı parlatılmış olarak görüntülenecektir. Eğer bu şekilde standart görüntüleme yöntemi uygulanmasını istemiyorsanız, tanımlama kodunda şöyle kullanabilirsiniz: <link rel=”apple-touch-icon-precomposed” href=”images/apple-touch-icon.png”>
Eğer farklı platformlar için farklı Apple ikonu eklemek isterseniz, yine aşağıdaki yapıda tanımlama kodları da kullanabilirsiniz:
