МоёМесто.ru :: Как добавить иконку сайта в адресную строку браузера?

Закладка "Как добавить иконку сайта в адресную строку браузера?"

Как добавить иконку сайта в адресную строку браузера?

Как добавить иконку сайта в адресную строку браузера?

Раздел: Сайт http://htmlbook.ru/

При загрузке сайта, в адресной строке браузера можно иногда увидеть небольшую картинку, которая связана с тематикой сайта. Тот же рисунок отображается рядом со ссылкой при добавлении ее в закладки браузера.

Отображение иконки в строке браузера

Чтобы установить подобную «фичу», необходимо нарисовать изображение размером 16х16 пикселов и сохранить его в формате ICO в корне сайта под именем favicon.ico.

Adobe Photoshop не понимает формат ICO и не сохраняет в нем рисунки, так что для этой цели требуется дополнительный плагин.

Для работы плагина файл необходимо распаковать и сохранить в папке Plug-Ins∖File Formats. По умолчанию программа Photoshop CS под Windows устанавливается в папке c:∖Program Files∖Adobe∖Photoshop CS. Тогда полный путь для файла плагина будет c:∖Program Files∖Adobe∖Photoshop CS∖Plug-Ins∖File Formats.

Размещение плагина для сохранения файлов в формате ICO

После добавления плагина, при сохранении рисунка в списке доступных форматов появляется новый пункт «Windows Icon».

Тип файла для сохранения иконки

Остается сделать желаемую иконку 16х16 пикселов и сохранить ее под именем favicon.ico в корне сайта. Браузер автоматически ищет этот файл и добавляет его в адресную строку, а также закладки.

Файл не обязательно должен располагаться в корне сайта, но тогда следует указать браузеру, где он находится. Это делается через тег <link>, как показано ниже.

<head>
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">
</head>
<head>
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">
</head>
Атрибут href задает расположение и имя файла.

Формат рисунка не обязательно должен быть ICO, также допускается использование GIF и PNG. При этом необходимо сменить значение атрибута type на image/gif или image/png, в зависимости от типа изображения.

<head>
<link rel="shortcut icon" href="/images/favicon.png" type="image/png">
</head>
<head>
<link rel="shortcut icon" href="/images/favicon.png" type="image/png">
</head>
Вложение Размер
icoformat.8bi 16 КБ

добавил: Живой журнальчег

7 октября 2010

комментировать

метки:

сохранили 3 раза

Привет!

Похоже, вы зашли сюда первый раз, и еще не знаете что такое МоёМесто.ru? Это сервис интернет закладок. Для чего он может вам пригодится?

Здесь вы можете хранить все свои закладки

Просто зарегистрируйтесь, установите панель МоёМесто::Панель в свой браузер, и вы сможете сохранить любую страницу в Интернете в один клик. А если у вас уже есть коллекция любимых ссылок в браузере — вы можете импортировать их в МоеМесто.

Здесь вы можете хранить любые файлы

Картинки, фотографии, документы, музыку и даже видео — все что угодно. 500 Мегабайт дискового пространства предоставляется бесплатно. Время хранения файлов не ограниченно.

Зарегистрируйтесь

прямо сейчас, и уже через несколько секунд вы сможете хранить свои закладки в Интернете!