瀏覽代碼

favicon revisité

Après une abondante lecture sur le sujet, voici ma tentative pour
apporter une meilleure qualité de favicon sur différentes plateformes et
cas, sans mettre trop de code HTML.
http://www.w3.org/TR/html5/links.html#rel-icon
https://github.com/audreyr/favicon-cheat-sheet

http://msdn.microsoft.com/en-us/library/windows/desktop/jj673981%28v=vs.85%29.aspx

https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

Il y a maintenant un favicon.ico contenant les tailles 16, 32, 48, 64,
et un PNG en 256 soit la première taille standard supérieure à la
meilleure résolution demandée par Android, iOS, et IE.

favicon.ico généré à partir de PNGs optimisés par PNGOUT, avec la
commande :
`icotool -c favicon-16.png favicon-32.png favicon-48.png favicon-64.png
-o favicon.ico`
http://manpages.ubuntu.com/manpages/hardy/man1/icotool.1.html

À tester un peu.

Voir aussi
https://github.com/marienfressinaud/FreshRSS/issues/264#issuecomment-29618845
Alexandre Alapetite 12 年之前
父節點
當前提交
1d3ff88ae6
共有 11 個文件被更改,包括 6 次插入2 次删除
  1. 3 1
      app/layout/layout.phtml
  2. 二進制
      p/favicon.ico
  3. 二進制
      p/favicon.png
  4. 3 1
      p/index.html
  5. 二進制
      p/themes/icons/favicon-128.png
  6. 二進制
      p/themes/icons/favicon-16.png
  7. 二進制
      p/themes/icons/favicon-256.png
  8. 二進制
      p/themes/icons/favicon-32.png
  9. 二進制
      p/themes/icons/favicon-48.png
  10. 二進制
      p/themes/icons/favicon-512.png
  11. 二進制
      p/themes/icons/favicon-64.png

+ 3 - 1
app/layout/layout.phtml

@@ -16,7 +16,8 @@
 ?>
 		<link id="prefetch" rel="next prefetch" href="<?php echo Minz_Url::display (array ('c' => Minz_Request::controllerName (), 'a' => Minz_Request::actionName (), 'params' => $params)); ?>" />
 <?php } ?>
-		<link rel="icon" href="<?php echo Minz_Url::display ('/favicon.ico'); ?>" />
+		<link rel="shortcut icon" type="image/x-icon" sizes="16x16 64x64" href="<?php echo Minz_Url::display('/favicon.ico'); ?>" />
+		<link rel="icon msapplication-TileImage apple-touch-icon" type="image/png" sizes="256x256" href="<?php echo Minz_Url::display('/themes/icons/favicon-256.png'); ?>" />
 <?php if (isset ($this->rss_url)) { ?>
 		<link rel="alternate" type="application/rss+xml" title="<?php echo $this->rss_title; ?>" href="<?php echo Minz_Url::display ($this->rss_url); ?>" />
 <?php } ?>
@@ -24,6 +25,7 @@
 		<link rel="prefetch" href="<?php echo FreshRSS_Themes::icon('non-starred', true); ?>">
 		<link rel="prefetch" href="<?php echo FreshRSS_Themes::icon('read', true); ?>">
 		<link rel="prefetch" href="<?php echo FreshRSS_Themes::icon('unread', true); ?>">
+		<meta name="msapplication-TileColor" content="#FFF" />
 		<meta name="robots" content="noindex,nofollow" />
 	</head>
 	<body>

二進制
p/favicon.ico


二進制
p/favicon.png


+ 3 - 1
p/index.html

@@ -5,8 +5,10 @@
 <meta name="viewport" content="initial-scale=1.0" />
 <meta http-equiv="Refresh" content="0; url=i/" />
 <title>FreshRSS</title>
+<link rel="shortcut icon" type="image/x-icon" sizes="16x16 64x64" href="favicon.ico" />
+<link rel="icon msapplication-TileImage apple-touch-icon" type="image/png" sizes="256x256" href="themes/icons/favicon-256.png" />
+<meta name="msapplication-TileColor" content="#FFF" />
 <meta name="robots" content="noindex,nofollow" />
-<link rel="icon" href="favicon.ico" />
 <style>
 body {
 	font-family: sans-serif;

二進制
p/themes/icons/favicon-128.png


二進制
p/themes/icons/favicon-16.png


二進制
p/themes/icons/favicon-256.png


二進制
p/themes/icons/favicon-32.png


二進制
p/themes/icons/favicon-48.png


二進制
p/themes/icons/favicon-512.png


二進制
p/themes/icons/favicon-64.png