Обзор интернета - Lite Веб-мастеру Графика Игры, Спорт Программы Рецепты Время Рождество Библия
Свой сайт Хостинг Облака Домены Ресурсы Формы на сайт Раскрутка
ASCII HTML robots.txt SEO Справка Ссылки

Favicon

Favicon
(анг. Favorites iconбукв. иконка любимой вещи, означает значок для закладок)
Значок веб-сайта или веб-страницы. Отображается браузером в адресной строке перед URL страницы, а также в качестве картинки рядом с закладкой, во вкладках и в других элементах интерфейса.

Форматы иконок

  • image/x-icon для формата ICO;
  • image/gif для формата GIF;
  • image/jpeg для формата JPEG;
  • image/png для формата PNG;
  • image/bmp для формата BMP.
На самом деле, везде работают иконки формата ICO, PNG и GIF. Остальные форматы, включая анимированный GIF не везде отобразятся, потому не имеет смысл их использовать.

Ну и размер должен быть 16X16 пикселей. Так будет корректно отображаться.
Формат ICO позволяет делать прозрачный фон.

Код простых иконок для браузера

<link rel="icon" href="http://имя сайта/favicon.ico" type="image/x-icon">

или

<link rel="shortcut icon" href="http://имя сайта/favicon.ico" type="image/x-icon">

Мобильные иконки

Дело в том, что сегодня ситуация усложнилась благодаря большому распространению планшетов и смартфонов.

Код мобильных иконок

Такой код подойдет для iPhone, Android ...

<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
<link rel="icon" type="image/png" href="/favicon-196x196.png" sizes="196x196">
<link rel="icon" type="image/png" href="/favicon-160x160.png" sizes="160x160">
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-TileImage" content="/mstile-144x144.png">

Веб мастеру Учебники-справочники htaccess CHMOD ERROR - таблица кодов возврата 404 МЕТА-теги CSS MySQL шпаргалки robots.txt Защита от авто-заполнения форм Redirect Валидность

Софт
Web soft Лучшие веб-утилиты Онлайновые WYSIWYG WAP софт
Favicon
Редакторы иконок Генераторы иконок онлайн Генератор иконок для смартфонов онлайн
RSS
RSS Примеры RSS Пример Atom-документа