2015-11-10 27 views
11

Site simgemin varsayılan gri Safari simgesi/yer tutucudan ziyade iOS Safari Tarafından Önerilen Web Siteleri bölümünde görünmesini nasıl sağlamaya çalıştığımı anlamaya çalışıyorum. Diğer siteler bunu yapabilir, ancak nasıl olduğunu anlayamıyorum. favicon.ico veya apple-touch-icon.png dosyasının ilişkili olduğu varsay, ama bu nedenle ne kullanılmış olduğunu ya da sitem için işe nasıl gidileceğini edemiyoruz.IOS Safari'nin Önerilen Web Sitesi listesinde görünecek bir simge nasıl edinilir

arstechnica screengrab

aynı fikri ben "AmericanExpress" yazdığınızda:

benim Safari önbellek ve tarih, açık Safari, temizleyip "Arstechnica" yazmaya başlayın Örneğin

, bu alın

american express screen grab

Ve "cnn":

cnn screen grab

Ama gibi diğer siteleri çalıştığınızda "Wells Fargo", ben (aynı zamanda sitemin şey bu) yer tutucu olsun:

wells fargo screen grab

Benim apple-touch-icon.png değildi kök klasör, bu yüzden onu taşıdım ama bu herhangi bir fark yaratmadı. (My favicon.ico kök klasöründe zaten.)

bu sitelerden bazılarını inceledikten sonra, olması görünmüyor ya favicon.ico veya kullanılmakta olduğu apple-touch-icon.png dosyası. arstechnica, bir apple-touch-icon.png dosyasına (bir cdn yönlendirmesiyle) sahipti, ancak Önerilen Siteler için kullanılanla aynı görüntü değil. Eşleştiğine benzeyen bir favicon.ico var, ancak American Express favicon.ico, Önerilen Siteler simgesiyle de eşleşmiyordu. Her bir HTML dosyasının link etiketleri için incelenmesi, sonuçsuz sonuçlara neden oldu.

Önerilen Siteler simgesi için hangi resim dosyasının kullanıldığını ve web sitem için nasıl görünebileceğimi bilen var mı?

cevap

5

Web sitesinin kök klasörüne -> home_badge_64.png adlı bir dosya koymanız gerektiğini düşünüyorum.

Bu başınızı etiketinde giderdim:

<link href="/home_badge_64.png" rel="apple-touch-icon" /> 

Şu anda işe almaya çalışıyorum gerçek hayat örnek olarak ->http://www.sisltd.ca/home_badge_64.png

0

simge alınır gibi görünüyor OpenGraph og:image meta etiketi. Sadece web siteme koydum ve bu etiketin değerini değiştirmek önerilen web sitesi öğesinde gösterilen simgeyi değiştirdi.

<meta property="og:image" content="link_to_your_icon.ext" /> 

ben de diğer tüm OpenGraph etiketlerini vardı, bu yüzden sadece bu metaetiket çalışır ya da tüm diğerleri gerekirse ben test etmedi.