Site simgeleri, Dokunmatik simgeleri ve şimdi Karo simgeleri için de gerekli olan tüm bu farklı boyutları ve biçimleri etrafında başımı almak için çalışıyorum.

Bu yazı okudum: http://www.jonathantneal.com/blog/understand-the-favicon ama hala cihazlar ve tarayıcılar ^ üzerinde oldukça iyi görüneceğini bir bit kullanmak için tam olarak anlayamadım . = IE8.

Aşağıdaki oluşturmak gerektiğini düşünüyorum

ICO
favicon.ıco (32 x 32)

PNG
favicon.png (96x96)

Karo Simgesi
tileicon.png (144x144)

Apple Dokunmatik Simgesi
apple-touch-icon-precomposed.png (152x152)
https://github.com/h5bp/html5-boilerplate/issues/1367 Bu dayalı

...ve ardından bu kodu kullanın 'em up? hizmet

<link rel="apple-touch-icon" href="path/to/touchicon.png">
<link rel="icon" href="path/to/favicon.png">
<!--[if IE]><link rel="shortcut icon" href="path/to/favicon.ico"><![endif]-->
<!-- or, set /favicon.ico for IE10 win -->
<meta name="msapplication-TileColor" content="#D83434">
<meta name="msapplication-TileImage" content="path/to/tileicon.png">

Bir şey mi kaçırdım?

Bu IE 10 örtbas edip etmeyeceği belli değil miyim?

İşte mobil ve tablet için favicon (bildiğim gibi) tam örnek:

<!-- non-retina iPhone pre iOS 7 -->
<link rel="apple-touch-icon" href="icon57.png" sizes="57x57">
<!-- non-retina iPad pre iOS 7 -->
<link rel="apple-touch-icon" href="icon72.png" sizes="72x72">
<!-- non-retina iPad iOS 7 -->
<link rel="apple-touch-icon" href="icon76.png" sizes="76x76">
<!-- retina iPhone pre iOS 7 -->
<link rel="apple-touch-icon" href="icon114.png" sizes="114x114">
<!-- retina iPhone iOS 7 -->
<link rel="apple-touch-icon" href="icon120.png" sizes="120x120">
<!-- retina iPad pre iOS 7 -->
<link rel="apple-touch-icon" href="icon144.png" sizes="144x144">
<!-- retina iPad iOS 7 -->
<link rel="apple-touch-icon" href="icon152.png" sizes="152x152">
<!-- Win8 tile -->
<meta name="msapplication-TileImage" content="favicon-144.png">
<meta name="msapplication-TileColor" content="#B20099"/>
<meta name="application-name" content="name" />

<!-- IE11 tiles -->
<meta name="msapplication-square70x70logo" content="tile-tiny.png"/>
<meta name="msapplication-square150x150logo" content="tile-square.png"/>
<meta name="msapplication-wide310x150logo" content="tile-wide.png"/>
<meta name="msapplication-square310x310logo" content="tile-large.png"/>

İE11, here için bir SSS