Question

Как установить favicon 120 на 120px и какой формат, просто понять не могу. Решил поставить, но в сети по разному пишут, здесь нашел формат в неад ставить image/png, что создал изображение, также создал на формат SVG, И поместил его также, назве png заменил на svg в коде. Правильно это или нет, но по каталогу файлов разместил.

Спасибо

 <link rel="icon" href="/favicon.ico" type="image/x-icon">      <link type="image/png" sizes="120x120" rel="icon" href="/favicon.png">     <link type="image/svg" sizes="120x120" rel="icon" href="/favicon.svg">

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

   <link type="image/x-icon" rel="shortcut icon" href="/favicon.ico"> <link type="image/png" sizes="16x16" rel="icon" href="/favicon-16x16.png"> <link type="image/png" sizes="32x32" rel="icon" href="/favicon-32x32.png"> <link type="image/png" sizes="96x96" rel="icon" href="/favicon-96x96.png"> <link type="image/png" sizes="120x120" rel="icon" href="/favicon-120x120.png">  <link type="image/svg" sizes="120x120" rel="icon" href="/favicon.svg">

в моем случаи так идет на каталог файлов  и вот не знаю правильно это или нет.

в неад

   <link type="image/x-icon" rel="shortcut icon" href="/favicon.ico"> <link type="image/png" sizes="16x16" rel="icon" href="/favicon.png"> <link type="image/png" sizes="32x32" rel="icon" href="/favicon.png"> <link type="image/png" sizes="96x96" rel="icon" href="/favicon.png"> <link type="image/png" sizes="120x120" rel="icon" href="/favicon.png">  <link type="image/svg+xml" sizes="120x120" rel="icon" href="/favicon.svg"> 

И еще, здесь нужно выставлять так /favicon.png или все таки так favicon.png ведь / имеет значение, так как все файды в корне папки.

Answer 1

Вот прочтите: https://webmasterie.ru/articles/kak-sozdat-i-ustanovit-favicon-na-sajt.51/ все доступно описано как должно быть, а именно

Для IOS

<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">

И для Андроид:

<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="/favicon-192x192.png" sizes="192x192">

Comments

Но меня также яндекс интересует, так как вебмастер выдает ошибку, что нет 120 на 120 для корректного отображения в поиске.

 

как пример такт пойдет

 

   <link type="image/svg+xml" sizes="120x120" rel="icon" href="/favicon.svg">

и вообще этот нужен

 

<link type="image/x-icon" rel="shortcut icon" href="/favicon.ico">

 

я так поставлю правильно или нет, и чтоб яндекс также захватило

<link type="image/svg+xml" sizes="120x120" rel="icon" href="/favicon.svg"> 
<link type="image/x-icon" rel="shortcut icon" href="/favicon.ico">
<link rel="icon" type="image/png" href="/favicon.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon.png" sizes="96x96">
<link rel="icon" type="image/png" href="/favicon.png" sizes="192x192">

 

Вообщем каждый значок сделал под заданные размеры и проверил на приложение - то так показывает

 

 

---

Kosten Razvedos,

Мы вам выше сообщили как нужно. Для яндекс иконка в 120х120 сильно много, там нужно 16х16 или 32х32, но никак не 120

---

Yuri_Geruk,

Но 16 и 32 присутствует, у меня здесь другой вопрос, если читать вебмастер Яндекса, то там форат svg, может мне просто данный формат , который идет на 120 сделать под другие значение, подскажите под какие, это может 32 или 46 не png а svg, хотя как понял они оба подойдут.  Но на сотовом проверил, там отличная иконка получилась, не то что была от 16px и на комп поставил, аналогично, четко и корректно , а ранее расплывчатая была. Подскажите какой формат и размер сделать для яндекс, хотя там говорится про 210. 

 

---

Kosten Razvedos,

Прочтите: https://dzen.ru/a/X3NfashZ5k2A6Aci и пост и комментарии и вам будет полезно, вы сделали все необходимое, но пытаетесь угодить всем рекомендациям вебмастера, когда уже в этом нет необходимости.

---

Yuri_Geruk,

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

 

image/svg+xml — для формата SVG;

 <link type="image/svg+xml" sizes="120x120" rel="icon" href="/favicon.svg"> 

остальные идут в png кроме первой

<link type="image/x-icon" rel="shortcut icon" href="/favicon.ico">
<link rel="icon" type="image/png" href="/favicon.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon.png" sizes="96x96">

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

 

---

Kosten Razvedos,

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

---

Yuri_Geruk,

Спаибо вам!