Как создать и установить Favicon на сайт? 3 причины, почему favicon должен быть на вашем сайте + советы. Как добавить фавикон в яндекс директ без изменения кода

Как установить фавикон на сайт за одну минуту

Быстрая навигация по этой странице:

Вопрос о том, как установить фавикон на сайт, является достаточно простым, однако почему-то многие вебмастера этим вопросом пренебрегают и не устанавливают иконку для своего сайта. О том, почему все-таки это важно и как это правильно сделать — читайте ниже.

Зачем нужен favicon?

Favicon — это иконка, которая по умолчанию имеет формат 16 на 16 пикселей и отображается в верхней части вкладки браузера рядом с названием сайта/страницы. Если иконка не задана или задана не правильно, то тогда в браузере рядом с названием сайта просто рисуется значок самого браузера (например, значок Firefox или Google Chrome).

Однако в действительности роль этой картинки состоит не только в украшении браузера. Дело в том, что эти картинки выводятся в поисковой выдаче Яндекса (если иконка не задана — показывается пустое место). Представьте ситуацию, что Яндекс предложит пользователю на его запрос два примерно одинаковых сайта, но к одному из них будет дополнительно проставлена иконка — на какой сайт более вероятно перейдет пользователь? Конечно, в первую очередь он перейдет на сайт, предложенный первым по списку, но как раз именно наличие картинки, которая всегда более приятна пользователю, чем текст, может привлечь посетителя именно на ваш сайт.

Кроме того, нельзя исключать и того обстоятельства, что наличие или отсутствие фавиконки может учитываться Яндексом как один из незначительных факторов ранжирования. Достоверно это неизвестно, но если Яндекс учитывает более 300 различных факторов при ранжировании сайтов в поисковой выдаче, то, быть может, наличие иконки также может учитываться при определении качественности ресурса.

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

Про то, как сделать иконку ico, у нас есть отдельная статья (ссылка), потому перейдем сразу к рассмотрению вопроса о том, каким должен быть фавикон.

Каким должен быть файл с иконкой и где он должен находиться?

Исторически сложилось, что для сайтов используется формат .ico. Особенность этого формата состоит в том, что внутри одного .ico-файла может храниться несколько картинок размером от 16х16 до 64х64 (размер должен быть кратным восьми). Правда, для веб-сайтов в действительности используется только формат 16х16 — ни Яндекс, ни браузер не будут показывать другой размер иконки.

Соответствующий Файл в формате .ico можно создать с помощью графического редактора или множества доступных в сети онлайн-сервисов. Важно, чтобы данный файл имел название favicon.ico.

Теоретически, сохранить файл можно в любой папке с файлами сайта, но крайне рекомендуется сохранять его именно в корневой директории вашего ресурса — чтобы он всегда был доступен по адресу vash-site.ru/favicon.ico, так как по умолчанию именно там его ищут поисковики и браузеры.

Как добавить на сайт?

Добавление иконки для вашего ресурса является очень простым: достаточно лишь прописать необходимый html-код между тегами <head></head< вашего сайта.

Для добавления favicon html код является следующим:

После того, как добавите этот код на страницы своей странички, обновите кэш своего браузера (его нужно полностью стереть), и, если все сделано правильно и файл с картинкой загружен на сайт, то картинка начнет отображаться в браузере.

Правда, не ждите ее мгновенного отображения в поисковой выдаче Яндекса. Дело в том, что у этой поисковой системы для фавиконок существует отдельный робот, который может обновлять свою базу иконок на протяжении нескольких месяцев. В этой связи, ваша иконка может появиться в выдаче Яндекса как через две недели, так и через пару месяцев, волноваться по этому поводу не стоит.

www.runcms.org

Как установить Favicon на сайт быстро и легко

Доброго времени суток, друзья!

Я долго думал, о чем бы написать следующую статью и на ум пришла очень простая тема в техническом плане, но не менее важная чем все остальные.

В данной статье я расскажу все, что знаю о Favicon и покажу процесс создания иконки, которая будет отображаться во вкладке вашего браузера при нахождении на вашем сайте. Также покажу, как установить Favicon на сайт.

Расскажу все, что знаю о данной иконке. На что она влияет, как ее лучше создать и так далее.

Прежде, чем начать обсуждать данные вопросы я хотел бы разъяснить вопрос: "Что же вообще такое Favicon и где его можно увидеть?".

Все проще некуда. Favicon - иконка, которая отображается, когда вы находитесь на каком-то сайте. Также она отображается и в поисковой системе Яндекс, что очень даже хорошо. Почему это так, мы рассмотрим далее.

Вот, как выглядит моя иконка во вкладке браузера.

А вот, как та же иконка отображается в выдаче поисковой системы Яндекс.

Когда вы знаете, что это за зверь такой, можно приступить к рассмотрению всех вопросов сегодняшнего материала.

Честно говоря, сам процесс установки иконки на сайт очень простой, но я не смог удержаться и не рассказать обо всем, что только возможно. Надеюсь, данная информация будет вам очень полезна.

Зачем нужен Favicon

Постараюсь объяснить все в виде чек-листа. Кстати, приготовил простенькую инфографику на этот счет.

Продвижение и узнаваемость бренда.

Не секрет, что задачей любого сайта является продвижение своего бренда (имени) в некой мере. Если мы берем во внимание личный блог, то данный момент является чуть ли не самым главным, так как мы формируем себя, как личность и доносим свое мнение в определенные массы.

За продвижение бренда отвечает отображение фавикона в выдаче Яндекс. Чем больше видят ваш фавикон, тем больше на него будут кликать, так как это свидетельствует, что ваша информация ценная и, вероятнее всего, она пользуется спросом.

Узнаваемость же бренда - процесс аналогичный, который будет в то же время способствовать его продвижению, а также продвижению самого блога, так как чем известней ваш favicon, тем лучше будут заходить именно на ваш сайт из поисковой выдачи, чем на другие.

Данные 2 фактора из первого пункта взаимосвязаны. Без одного не будет второго.

Увеличение количества кликов из выдачи, а соответственно и прирост трафика.

Каким боком связан Favicon с количеством переходов на ваш сайт? Дело в том, что очень важным моментом при предварительной оценке вашего сайта посетителем, является анализ внешнего вида вашего сниппета в выдаче поисковой системы. Только использованием фивикона вы уже увеличиваете один из важнейших поведенческих факторов - CTR (кликабельность) в выдаче.

Отличаться вы можете, как угодно - делать броский заголовок и описание. Делать расширенное описание в выдаче и так далее. Но все это имеет меньшее значение, если у вас совершенно нет фавикона или же он некачественный.

Тут опять же играет роль первый фактор, влияющий на продвижение бренда. Чем круче ваша иконка, тем больше переходов на сайт и тем более успешней продвигается бренд.

Увеличение конверсии сайта.

Каждый сайт должен иметь свою конверсию вне зависимости от его типа. Блог, интернет-магазин, одностраничный сайт, страница подписки, контентный сайт - не важно. У каждого ресурса есть своя задача, эффективность которой измеряется конверсией.

В конверсии важна каждая мелочь. Даже расположение слов и их длина. Фавикон - не исключение. Чем он качественней и более лучше описывает вид деятельности сайта или компании, тем больший процент он придает общей конверсии.

Для страниц подписки и продающих сайтов данный фактор очень важен. Как правило, такие сайты рекламируется напрямую и посетители, которые на них заходят, в большинстве случаев, не знают автора. Глаза таких посетителей нередко сразу идут смотреть на favicon.

Эти 3 причины я бы выделил в качестве основных. Может вы еще что-то добавите в комментариях. Будет интересно узнать больше.

Ну, а теперь пришло время приступить к самому процессу создания и установки данной иконки. Начнем с создания.

к содержанию ↑

Как создать Favicon

Сейчас мы поговорим о создании фавикона с точки зрения 2х моментов:

Создание самого дизайна и оформления;
Создание самой иконки.

Процесс создания иконки я покажу немного ниже, а вот о прорисовке иконки собственными силами мне не хотелось бы много говорить, так как фавикон - это, пожалуй, один из сложнейших элементов в дизайне, который нужно сделать. Почему, спросите вы?

Да потому, что он влияет на конверсию и отображается не только во вкладке, а и на странице сайта. Это и есть первый совет при создании фавикона. В иконе должен быть ваш логотоип, который будет абсолютно везде. А это очень ответственный процесс, ведь можно и хуже сделать, использовав некачественный логотип, а соответственно и фавикон.

Поэтому, если вы не обладаете хорошей фантазией и хорошими навыками фотошопа, как минимум, то вариантов в данном случае 2:

Много париться и сделать самому;
Обратиться к профессионалам.

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

Человек, имеющий опыт в создании дизайнов запросто вам его сделает, но не бесплатно ясень пень. Зато качество будет радовать всех и вся. Поэтому, я и рекомендую 2й вариант.

Если же все таки вы человек-самоучка, то вот вам несколько советов, о которых стоит помнить при создании иконки:

Не копируйте никого - будет хуже только вам, а конкуренту будет плюс, так как вы его в некой мере пропиарите;
Иконка должна быть простая, чтобы во вкладке было четко понятно, что там нарисовано. Поэтому, чем меньше в ней элементов, тем лучше. Многие делают ее из своей фотографии, которую абсолютно не видно в таком размере. Не повторяйте данной ошибки;
Favicon должен давать понятие области вашей деятельности или же брендировать ваше имя. Если область деятельности, то постарайтесь что-то придумать интересное. Например, если сайт о заработке, то логично сделать иконку в видео каких-то монет или купюр. Но таких умников уже пруд пруди, поэтому нужно обыгрывать все по-своему. Почему я выше и писал, что необходима фантазия и умение ее воссоздать в дизайне. Если же это личный блог, то очень распространенный вариант - обыграть первую букву своего имени или фамилии. Я так и сделал. Это самый простой путь.

Теперь можно перейти и к процессу создания самой иконки с технической точки зрения.

к содержанию ↑

Создаем иконку

Так как Favicon - иконка, то и расширение у нее должно быть соответствующее - ico. Чтобы сделать такое расширение, мы будем пользоваться сервисом. Можно конечно сделать это и какими-то программами, но я сталкивался с проблемой, что такие иконки некорректно отображаются на выходе. С сервисом же все ок.

Также нам потребуется изображение маленького размера (32х32 или 16х16 пикселей) с нашей иконкой. Именно в таком размере и отображается фавикон. Во вкладке браузера он имеет размер 16х16 пикселей.

Будем считать, что изображение вы создали. Можно двигаться далее. Переходим на сервис (кликните сюда) и оказываемся на странице, где можем выбрать наш файл изображения любого из 2х размеров выше.

Когда выбрали иконку, мы можем нажать на кнопку "Create icon", после чего сервис автоматически преобразует наше изображение в иконку нужного формата (ico) и придаст ей размер 16х16 пикселей.

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

После скачивания иконки она будет в месте сохранения файла с нужным расширением и форматом. Можете в этом удостовериться.

Можно идти дальше и сделать так, чтобы иконка отображалась на сайте.

к содержанию ↑

Устанавливаем Favicon на сайт

Ни в коем случае не пытайтесь произвести подключение фавикона к сайту с помощью какого-то плагина. Это совершенно бесполезная процедура, так как все делается руками проще некуда. Информация ниже вам в этом поможет.

Процесс установки состоит из 2х этапов:

Загрузка иконки на сайт;
Подключение вывода иконки на всех страницах.

Кстати, показывать я все буду на примере установки для WordPress блога, но для всех сайтов принцип один и тот же.

Начнем с первого варианта. Загрузить иконку на сайт можно в любое место, где вам будет угодно. Но самые часто используемые варианты - в корень сайта и в папку с темой.

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

Покажу так, как сделал я. Для загрузки файлов на сайт и использую ftp клиент FileZilla (тут подробная инструкция). Фавикон в моем случае лежит в папке с моей темой оформления, то есть в папке шаблона, где лежат все его файлы и папки (см. ниже).

Как видим, имеются все файлы и папки шаблона и среди них находится иконка.

После загрузки иконки на хостинг, необходимо сделать ее загрузку на всех страницах сайта. Для этого нужно добавить определенную строчку кода в файл header.php вашей темы в область между открывающим и закрывающим тегами <head></head>.

Берем следующий код. В нем лишь подставьте имя своего домена и название темы.

Идем в файл header.php и копируем в вышесказанное место эту строчку с вашими данными. В моем случае получилась следующая ситуация.

строчка кода за вывод favicon на сайте

После этого вы перезаписываете старый файл на хостинге и иконка уже должна отображаться во вкладке браузера. Но может и не отображаться сразу. Если имеется такая ситуация, то попробуйте перезапустить браузер, почистить его кэш или же перезагрузить компьютер. После этого должно быть все нормально.

Иконка во вкладке браузера отображается сразу после проделанных действий. А вот в выдаче она появляется не сразу, так как Яндекс должен проиндексировать сайт заново, увидеть изменения в коде, после чего он подгрузит иконку. На это может потребоваться некоторое время. Все зависит от того, насколько часто робот Яндекса посещает сайт.

Как вы увидели, процесс установки Favicon настолько простой, что его сделает даже младенец. Тем более, что по традиции прилагаю видео-урок.

После этого все в ваших головах должно стать на свои места.

В завершение статьи я попрошу вас оставить свои вразумительные комментарии с новыми идеями для контента. Будем все разбирать, что непонятно.

На этом все. До связи

С уважением, Константин Хмелев.

kostyakhmelev.ru

Помощь по сайту - Установка, замена фавикона

Фавикон — небольшая картинка (значок сайта), которая показывается рядом с сайтом в результатах поиска Яндекса, рядом с адресом сайта в адресной строке браузера и рядом с названием сайта в «Избранном» или в «Закладках» вместо стандартной, общей для всех картинки.

Все сайты, созданные на конструкторе Energy автоматически получают в качестве фавикона оранжевую молнию.

Как изменить фавикон?

Для удобства работы, мы разместили возвожность замены фавикона прямо в настройках сайта. Зайдите в личный кабинет пользователя, в раздел "Мои сайты" и нажмите на кнопку "Настройки" (значок шестеренки) напротив имени сайта, у которого нужно сменить иконку.

Найдите пункт "Favicon" и загрузите нужное изображение. Мы рекомендуем загружать квадратные изображения в формате png с прозрачным фоном - так качество отображения значка будет лучше.

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

Индексация фавикона в Яндекс.

Очень часто возникает вопрос: почему я сменил(а) фавикон, а в яндексе так и показывается старый или показывается молния Energy?

В случае внесения изменений на сайт, в работу вступает робот Яндекса. Робот, индексирующий сайты и робот, индексирующий фавиконы - решают разные задачи и работают отдельно друг от друга. Индексация фавикона проводится не каждый раз когда сайт проходит индексацию - гораздо реже. Потому что при индексации, иконка загружается на сервер поисковика и занимает дополнительное место, соответственно предаврительно значок должен пройти проверку.

Как правило, от момента узнавания роботом об изменении до появления данного изменения в результатах поиска проходит от нескольких дней до нескольких недель. Если же изменения затягиваются - рекомендуем задать вопрос в техподдержку Яндекса.

После удаления фавиконки с сайта она исчезнет из результатов поиска Яндекса по прошествии примерно трех недель в том случае, если ваш сайт показывается на страницах результатов поиска Яндекса.

energy-bm.ru

Настройка контекстных объявлений рекламной сети Яндекса для повышения числа кликов (CTR) и дохода

Обновлено: 14 декабря 2015

В этой статье мы продолжим тему того, как заработать денег в интернете, начатую тут (ну, и как легализовать доходы с помощью открытия ИП читайте), и начнем разбираться в тонкостях и нюансах работы с контекстной рекламой Яндекса (вам платят за показы на своем сайте объявлений из Яндекс.Директа на примере центра обслуживания партнеров Profit Partner.

Работать с РСя удобнее все же именно через ЦОП, т.к. в этом случае вы получите ряд дополнительных бонусов и возможностей, которых у вас не будет при работе напрямую.

Например, заработанные деньги в Профите вы можете вывести как на кошелек Яндекс Деньги (здесь описаны плюсы и минусы этой платежной системы), так и на кошелек WebMoney (читайте про работу с Вебмани через Кипер Классик), причем без всякой дополнительной комиссии.

В предыдущих статьях мы успели рассмотреть следующие вопросы:

Как стать участником рекламной сети Яндекса (РСЯ)
Регистрация в центре обслуживания партнеров (ЦОП) Profit Partner

Сегодня, как я и обещал ранее, мы подробно рассмотрим настройки кода рекламных объявлений, с помощью которых можно будет изменять их внешний вид уже после размещения на сайте, для повышения их эффективности и доходности (увеличения CTR).

Изменения внешнего вида блоков Рся прямо в коде

Работа с рекламными объявлениями Яндекса существенно отличается от работы с аналогами от Google. В Адсенсе вам нужно было зайти в свой аккаунт Google AdSense (тут все подводные камни Адсенса рассмотрены), перейти на вкладку управления и выбрать пункт «Изменить настройки».

И только на этой странице настроек вы сможете внести нужные коррективы и сохранить изменения. Результат через некоторое время вы сможете увидеть на страницах своего ресурса.

Изменять внешний вид рекламного объявления Яндекса вы сможете, просто редактируя параметры его кода (Адсенс же не допускает такой возможности). Набор переменных в коде позволят вам изменять его внешний вид в достаточно широких пределах.

В связи с этим хочу отметить гораздо более гибкие настройки внешнего вида блоков в Рся по сравнению с AdSense. В этой статье я как раз и собираюсь рассказать о работе с кодом блоков для придания им наиболее подходящего для вашего ресурса внешнего вида, что в свою очередь приведет к их большей эффективности и доходности.

Итак, допустим вы выбрали, настроили и получили код рекламного объявления. Затем вставили его в шаблон своего сайта (для доступа к сайту по FTP, наверное, использовали FileZilla — тут ее можно скачать), но поняли, что внешний вид блока не совсем вписывается в окружающие элементы дизайна.

Что же теперь, опять идти на сайт Профит Партнера для подкрутки настроек с помощью имеющегося там конструктора?

Вовсе не обязательно, хотя, конечно же, можно и так сделать, но это будет достаточно трудозатратно и неудобно. Гораздо проще открыть на редактирование через ФайлЗилу файл шаблона вашего сайта, в который вы вставили блок РСя и внести изменения непосредственно в его код.

Он может выглядеть, например, так:

Вот так выглядело это рекламное объявление на страницах моего блога:

На данном рисунке обведены те элементы, внешний вид которых можно поменять прямо в коде. Так же в коде можно будет изменить его фон и добавить, при желании, вокруг него рамку. В общем, настроить можно практически все и в очень широких пределах. Но обо всем по порядку.

Не во всех типах блоков будут работать все переменные, которые мы рассмотрим ниже. Например, при выборе фиксированного размера вы не сможете изменить размер шрифта.

Но тем не менее я постараюсь осветить все возможности настройки кода.

Настройка кода объявлений контекстной рекламы Яндекса

Для редактирования внешнего вида блоков РСЯ вы можете изменять следующие переменные в его коде:

yandex_direct_type — в этой переменной задается тип рекламного блока, но вы его можете так же изменить прямо в коде блока, прописав данной переменной другое значение:
1. vertical — для создания вертикального блока
2. horizontal — горизонтальный блок
3. flat — плоский
4. для создания фиксированного блока заданных размеров (160×600, 240×400, 200×300, 300×300, 300×250, 250×250, 728×90)
5. auto — элементарный блок
yandex_site_charset — задаем кодировку русского языка (koi8-r, windows-1251 или utf-8 — читайте про кодировки и кракозябры, возникающие из-за их неправильного использования):
1. windows-1251
2. utf-8
3. koi8-r
yandex_direct_title_font_size — размер заголовка может меняться теперь отдельно от размера всего текста. Возможны значения
1. 1 — мелкий, но жирный шрифт
2. 2 — средний, но не жирный
3. 3 — самый большой и не жирный
yandex_direct_title_color — цвет заголовка (выбор правильного цвета может существенно повысить количество кликов по рекламе). Он задается в виде Html кода цвета (здесь читайте про палитры и подбор цвета ), без знака # впереди, например, yandex_direct_title_color = '187298'. Для подбора нужного цвета перейдите по приведенной в предыдущем предложении ссылке.
yandex_direct_text_color — цвет текста объявления
yandex_direct_url_color — цвет ссылки на сайт рекламодателя
yandex_direct_border_color — цвет рамки
yandex_direct_border_type — вы можете задать с помощью этой переменной тип рамки (не сработает в элементарном и фиксированном блоках):
1. ad – каждое контекстное объявления будет обведено в отдельную рамочку
2. block– в рамку будет взят весь рекламный блок Яндекса
yandex_direct_bg_color — задает оттенок фона
yandex_direct_header_bg_color — с помощью этой переменной можно задать цвет фона так называемой плашки, где написано слово «Директ»

yandex_direct_all_color — цвет ссылок «Все» и «Дать объявление»
yandex_direct_hover_color — цвет ссылок при наведении (под курсором мыши заголовок объявы будет менять свой цвет на тот, который вы укажете в данной переменной)

yandex_font_size — размер используемого в объявлении шрифта. Изменяться будут пропорционально все шрифты — и заголовка, и текста, и служебных надписей. Не работает в элементарном и фиксированном блоках РСЯ. Цифры задают увеличение или уменьшение относительно размера шрифта, используемого у вас на сайте.

Т.е. если вы напишите yandex_font_size = 1, то размер текста будет равен размеру, используемому у вас на сайте. Если напишите yandex_font_size = 1.4, то размер будет в 1.4 раза больше базового. Тоже самое и в сторону уменьшения размера шрифта — yandex_font_size = 0.8
yandex_font_family — с помощью этой переменной вы сможете выбрать тип шрифта для объявлений (не сработает в элементарном и фиксированном блоках). Вы сможете использовать один из следующих параметров для этой переменной:
1. arial
2. courier new
3. tahoma
4. times new roman
5. verdana
yandex_direct_limit — количество объявлений в данном блоке (кроме элементарного и фиксированного)
yandex_stat_id — очень полезная переменная (называемая срез), позволяющая отслеживать эффективность рекламного блока Яндекса. Вы просто прописываете в эту переменную и присваиваете ей цифровое значение (например, как в приведенном выше примере, yandex_stat_id = 1). А затем, при просмотре статистики кликов по блокам (например, все в том же Профите, ну, или на официальном сайте РСЯ), вы сможете поставить фильтр по этому номеру (срезу) и посмотреть статистику кликов по нему.
yandex_direct_favicon — если вы пропишите в коде эту переменную со значением TRUE (yandex_direct_favicon = 'true'), то слева от заголовка объявления РСЯ будет выводиться иконка под названием favicon (читайте тут про то, как создать фавикон для своего сайта). Эта иконка берется с сайта рекламодателя и иногда может повышать CTR рекламы.

yandex_direct_header_position — данная переменная используется только в фиксированных объявлениях и позволяет задать расположение плашки с надписью «Яндекс Директ» относительно текста. Можно использовать следующие варианты:
1. right
2. left
3. bottom
4. top
5. top+bottom
6. top+right

Установка Favicon на сайт

Вы здесь: Главная - HTML - HTML Основы - Установка Favicon на сайт

Favicon - это небольшая картинка размером 16x16 (или 32x32) пикселя, которая находится в браузере слева от адресной строки. Почему-то не так много людей добавляют favicon на свои сайты. На мой взгляд, они многое теряют. Например, в Yandex отображаются иконки сайтов, и люди переходят по таким сайтам гораздо чаще, чем по тем, на которых нет favicon. Также, на мой взгляд, это немного повышает авторитетность сайта. В общем, в этой статье мы установим favicon на сайт.

Для начала как найти favicon. Во-первых, Вы можете создать самостоятельно. Очень хороший сервис favicon.cc. На нём Вы прямо в онлайне создадите себе favicon. Также Вы можете воспользоваться уже готовыми коллекциями и выбрать себе подходящий. Самый простой способ - это воспользоваться поиском и запросом: "коллекция favicon". Думаю, что уже первый сайт покажет Вам тысячи различных favicon, и Вам останется его только выбрать.

Теперь второй шаг - установка favicon на сайт. Для этого добавьте внутри тега <head> следующую строку:

Советую разместить favicon прямо в корень сайта. Если же Вы решили разместить его в другом месте, то, соответственно, измените значение атрибута "href".

После обновления страницы, Вы увидите Ваш favicon рядом с адресом Вашего сайта.

Иногда favicon появляется не сразу. Как правило, виновато кэширование браузера. Поэтому если картинка отсутствует, то попробуйте очистить кэш браузера (в настройках это должно быть). Также может помочь перезапуск браузера. Но ещё раз говорю: если Вы всё сделали правильно, то favicon на Вашем сайте появится.

Вот и всё, что хотелось рассказать об установке favicon на сайт.

Если Вы хотите узнать больше по HTML, то посмотрите мой бесплатный курс с примером создания сайта на HTML: http://srs.myrusakov.ru/html

Создано 05.12.2010 10:17:20
Михаил Русаков

Предыдущая статья Следующая статья

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

Кнопка: <a href="https://myrusakov.ru" target="_blank"><img src="/800/600/https/myrusakov.ru//images/button.gif" alt="Как создать свой сайт" /></a>
Она выглядит вот так:
Текстовая ссылка:<a href="https://myrusakov.ru" target="_blank">Как создать свой сайт</a>
Она выглядит вот так: Как создать свой сайт
BB-код ссылки для форумов (например, можете поставить её в подписи): [URL="https://myrusakov.ru"]Как создать свой сайт[/URL]

myrusakov.ru

У Вас пропал фавикон? | Блог Николая Иванова

Маленький человек может сделать многое.

Здравствуйте коллеги!

Сегодня пост блога вновь о фавиконе.

Об установке фавикона на сайте я уже рассказывал.

Но ко мне в комментариях обращаются с вопросами о том, что пропал фавикон в выдаче Яндекса, как восстановить фавикон, исчезла эмблема яндекса.

Так было и у меня. После всех действий, необходимых для установки иконки, он появился в браузере практически сразу. В Яндексе я ждал появление фавикона около недели, пока специальный робот не произвел очередную индексацию.

Но через месяц я сделал обновление темы и забыл сохранить код для вывода иконки. Поэтому мой фавикон выпал из выдачи Яндекса , хотя в браузере отображался, так как не был очищен кэш.

А бывает и так, что иконки исчезают в Яндексе по неизвестным причинам. Ответы поддержки поисковика просто отписки типа: «Запаситесь терпением и подождите, пока робот посетит и проиндексирует вашу иконку.»

Другого выхода нет, только ждать. Главное не унывать. Нужно сначала проверить видят ли иконку вашего сайта поисковики. Для этого вставьте в поисковую строку вашего браузера:

1. Yandex — http://favicon.yandex.net/favicon/www.mysite.ru (меняем на свой домен).

2. Goole — http://www.google.com/s2/favicons?domain=www.mysite.ru

Не забудьте внести URL своего сайта.

Проделав эти два шага, я понял, что при обновлении темы в файле header.php, я потерял код вывода фавикона. Поэтому Яндекс перестал его показывать в выдаче.

Поиск фавикона в Яндексе

А в Google фавикон отражается через тему, при ее настройке. Поэтому здесь мы видим картинку иконки.

Как выглядит фавикон в Google

Как восстановить пропавший фавикон?

Для браузера:

— проверить установку фавикона в шаблоне темы

— удалить кэш в браузере и на сайте

— обновить страницу браузера

Для поисковиков:

— скопируйте и вставьте в файл header.php перед тегом </head> код

Не забудьте указать URL своего сайта вместо mysite. Сохраните изменения в файле. Но перед этим сделайте резервную копию файла.

Фавиконом могут быть картинки с расширениями png, jpg, gif, тогда расширение ico следует заменить на одно их трех.

Например, у меня фавиконом является изображение с расширение jpg, следовательно код выглядит так:

Проверив и поправив ошибки на своем блоге, через неделю мой фавикон вновь появился в Яндексе.

Хочу посоветовать. Для того, чтобы ваши изменения не пропадали при обновлении темы, прочтите статью «Как упростить обновление темы WordPress?».

На этом у меня все.

Пока.

До встречи в статье «Как установить фавикон на сайте».

С уважением, Николай Иванов.

ЕСЛИ НЕ ЛЕНЬ, ОСТАВЬ КОММЕНТАРИЙ ИЛИ РАССКАЖИ ДРУЗЬЯМ.

Поделиться ссылкой:

Понравилось это:

Нравится Загрузка...

somemoreinfo.ru

Пошаговая инструкция: Как добавить Favicon?

Favicon называют специальную иконку, которую видно вверху страницы интернет-обозревателя при открытии того или иного сайта. Это очень удобно, когда по такой иконке пользователь сразу узнает сайт. Ее видно и в списке закладок, и при выдаче поисковой системой сайтов по запросу. Использование Favicon давно стало стандартом, а сайт без этой иконки сразу показывает, что его разработчики — не особо опытные специалисты. В общем и целом наличие этого элемента повышает доверие и узнаваемость проекта. Здесь мы разберем самый простой способ создания Favicon.

Для начала необходимо сделать изображение, которое, собственно, и будет иконкой вашего сайта. Для этого нужно запустить приложение для работы с графикой (Paint.net, Photoshop, Gimp или любое другое). В нем вам нужно создать картинку размером 16×16. Правильнее всего использовать формат ico. Многие современные браузеры распознают фавикон и в других графических форматах, но во избежание конфликта версий лучше все же использовать родной для такого рода изображений формат.
Некоторые простейшие графические редакторы не поддерживают работу с ico файлами. В таком случае вы можете создать изображение в любом другом формате, а затем использовать соответствующий веб-сервис для преобразования файла. Таких сервисов достаточно много и все они имеют простой интерфейс и не требуют особых навыков для конвертации. Также, при желании, некоторые из этих сервисов можно использовать для всех этапов разработки нужной вам иконки.
Тут важно сказать пару слов о выборе изображения для Фавикон. Рекомендуем провести исследование среди сайтов, похожих на ваш по тематике или направлению деятельности. Это важно для того, чтоб, во-первых, не повторяться, а, во-вторых – нащупать идею для своей иконки. Изображение должно, в целом, отображать тематику, но при этом не дублировать по цвету и схеме подобные проекты. Также не стоит выбирать слишком мелкое изображение, которое не может быть понятно с первого взгляда.
Варианты изображений для Фавикон
После того, как ваша иконка готова, остается залить ее на сервер с сайтом. Имя файла должно быть favicon.ico. Это поможет избежать путаницы при обработке браузерами. Лучше сразу поместить файл в корневую папку. Другой вариант – явно указать в коде сайта ссылку на место размещения файла. Теперь остается разместить следующую строчку (<link rel=»shortcut icon» type=»image/x-icon» href=»favicon.ico»>) в код сайта (в заголовок html документа).
Для большинства популярных систем управления сайтами существуют специальные плагины по управлению иконками Favicon. Если вы используете одну из таких CMS, то попробуйте этот способ. Он сравнительно легче и позволяет быстро менять иконку без необходимости открывать исходные файлы сайта.