Как сделать фавикон для сайта

     

     

    Создание favicon.ico. С помощью этого сервиса Вы сможете легко преобразовать любое изображение формата jpg, gif, png в favicon.ico . Стандартный размер изображения для favicon 16x16 пикселей. В режиме Эксперт Вы можете сделать иконки размером: 16x16, 24x24, 32x32, 48x48, 96x96, 128x128 и объединить их в один файл. Данный генератор фавикон поможет Вам сгенерировать иконку Favicon для Вашего сайта из изображения любого размера. На этой странице собраны примеры иконок сайтов: А это иконки сайтов которые анализировались и строились за последнее время: Что такое favicon? Favicon (англ. Favorite Icon) - это небольшая иконка (изображение, картинка) в специальном формате, которая отображается в адресной строке браузера при просмотре сайта, вкладке браузера или в его закладках (“Избранном”). favicon - это дополнительное украшение для Вашего сайта, Ваш мини логотип. Он также показывается при просмотре списка сайтов в поиске яндекса, гугла и выделяет Ваш сайт на фоне остальных. Зачем нужен favicon для сайта? favicon – товарный знак Вашего сайта. У многих компаний на сегодняшний день есть отличительный favicon значок, который выделяет их среди конкурентов. Чтобы иконка лучше запоминалась пользователями, компаниям следует отображать в ней свой логотип, который также должен быть одним из эллементов шапки сайта. Ещё одна положительная особенность использования favicon в том, что при просмотре большого количества сайтов в браузере, Вы не видите заголовка страниц полностью, а видите только иконку и вы сразу с легкостью можете определить ту вкладку, куда Вы хотели перейти. Что лучше изобразить на фавикон? Иконка должна соответствовать тематике сайта. бренд, если у Вас сайт связан с этим брендом. При этом для разных страниц можно отображать разные бренды; Применяйте фавикон, на который хочется кликнуть, это повысит кликабельность при просмотре в поиске Яндекса, Гугла; Сделайте несколько дизайнов фавиконок для различных разделов Вашего сайта. Сделайте несколько дизайнов фавиконок для различных событий (напр. Нового Года, Дня Святого Валентина или Дня космонавтики, :). Разместите полученный файл в корне вашего сайта, там где находится основной индексный файл(index.php). Для указания браузеру местонахождения иконки сайта(favicon) в секции заголовка страницы (head) вставьте следующую строку: Как сделать анимированный favicon? Формат ICO не поддерживает анимацию. Но современные браузеры позволяют использовать формат GIF для миниатюр. Возможно указать для современных браузеров один анимированный файл(favicon.gif), а для древних, типа Intertet Explorer, другой(favicon.ico). Для этого в секцию head внесите следующие две строчки: Естественно предварительно нужно поместить оба файла в корневую папку сайта. Как быть, если запрещен показ изображений в браузере? Если сделать favicon c внедренным изображением в код старницы: То иконка будет показываться в браузере даже тогда, когда картинки будут отключены. Как сделать внедренное изображение описано здесь. Как получить favicon с сайта. Не все вебмастера располагают favicon.ico в корне сайта. Для получения адреса favicon используйте следующий скрипт: Поисковые системы Google, Яндекс и favicon. Робот поисковых систем кешируют иконки сайтов. Закешированные иконки доступны по следующим запросам: Кроме этого, Яндекс может сделать Вам "спрайт" из иконок разных сайтов: Иконки для iPhone и iPad. Даже если Вы не указываете link-ссылку на картинку iphone все равно будет искать в корневой папке сайта файл с именем apple-touch-icon.png и если найдет, то Возьмет из него картинку, закруглит по углам и на нее будет наложен блик автоматически самоим устройством. Для избежания этого вместо apple-touch-icon.png следует написать apple-touch-icon-precomposed.png владельцы айфонов и точей, т.к. для них мы делаем красивую иконюшку размером 57x57 (можно кстати и больше, но это стандартный размер иконки на ланч-скрине), подключая ее так: Правильно опубликовать и объявить иконки для старых и новых Retina iPad: Как динамически менять favicon? HTML5 и favicon. В HTML5 был добавлен атрибут sizes, позволяющий объявить несколько различных версии одной и той же иконки, и это могут быть PNG файлы:

     

    Предыдущая страница   Следущая страница




Рейтинг@Mail.ru