05-11-2018 08:10

Как сделать значок для сайта

Содержание статьи:

Значок для сайта, или, как его чаще называют, иконка – это то, что можно увидеть в уголке возле названия вкладки в браузере. Также значок отражается напротив названия сайта в списке «Избранное», еще его можно увидеть, когда поисковая система показывает ваш сайт в выдаче. Как сделать значок для сайта

Вам понадобится

  • - логотип сайта,
  • - Photoshop,
  • - favicon-конвертер.

Инструкция

Как делать скрипт в 2018 годуВам будет интересно:Как делать скрипт в 2018 году

Откройте логотип вашего сайта в программе Adobe Photoshop. Если логотипа нет, можно взять любую другую картинку, важно лишь, чтобы она ассоциировалась с вашим сайтом. Обработайте изображение, убрав все лишние детали, а теперь уменьшите его размер до 32 или 16 пикселей по каждой стороне. Затем сохраните изображение как графический файл в формате png или gif.

Лучше всего, если вы создадите в итоге файл с разрешением 32х32 пикселя, так как пользователи иногда сохраняют ярлыки понравившихся сайтов на «Рабочем столе», а там картинки 16х16 пикселей выглядят недостаточно детализированными. Тем не менее, имейте ввиду, что в браузере ваша иконка все равно будет приведена к размеру 16х16 пикселей, именно такие картинки отображаются в «Избранном» и в заголовке.

Теперь нужно преобразовать картинку в ico-файл. Сделать это можно с помощью какого-либо плагина для Photoshop или, воспользовавшись бесплатным интернет-сервисом, например, http://favicon.ru/. И плагинов, и сервисов существует огромное множество, работают они практически одинаково, так что советовать какой-то конкретный нет смысла. Такие сайты называются favicon-генераторами.

Полученный в результате файл переименуйте, чтобы его имя было favicon.ico.

Теперь зайдите в панель управления вашим сайтом и найдите корневую директорию, где лежит первая страница. Обычно это index.html или другой файл, который генерирует система управления контентом. Там уже может лежать иконка с именем favicon.ico. В этом случае удалите старую иконку и поместите вместо нее свою.

Если корневая директория вам недоступна, а также в тех случаях, если код для сайта вы писали сами, то нужно отредактировать все страницы сайта, на которых должна появиться иконка. Откройте страницу в редакторе и в разделе head добавьте запись

Если иконка располагается не в корневой директории, а где-либо еще, то в параметр href пропишите полный путь файла.

Обратите внимание Если не создать иконку для своего сайта, то на ее месте будет либо отображаться логотип браузера, либо иконка системы управления контентом, или движка. Например, это может быть Wordpress или Joomla. Полезный совет Значок для сайта называют фавикон (favicon), что означает favorites icon, то есть, иконка для отображения в «Избранном». Ранние браузеры использовали иконку только для этого меню, а позднее добавилась функцию отображения иконки и в названии вкладки.

Источник