Favicon и заголовок окна

[rumkin]

Я не ставил перед собой цель открыть Америку, всё-таки, правила не за один день появляются, я их собрал вместе для наглядности… В любом случае пожалуйста :)

[maxic]

Очень грамотные замечания, если бы к ним еще прислушивались

[sashakissel]

Рюмкин, вы, в который раз, пишете отличную статью! Спасибо :-)

Впервые заметил грамотное использование фавиконки… Во «Вконтакте».

[gopal]

Отличные статьи!

[almalexa]

Вспомнил игру по обороне фавикона…

[tgm]

А ссылочу можно?

[almalexa]

Пожалуйста
habrahabr.ru/blogs/games/29316/

[unst]

Отличная статья.

Если в заголовоке отражается иерархия, то порядок должен быть от меньшего к большему, например:
«Favicon — Типографика — Хабрахабр»

Почему то всегда считал наоборот, приму к сведению, спасибо.

[zerkms]

вероятно потому, что проводил аналогию с фс :-)

[Osaka]

Вообще, это скорее это вопрос юзабилити, нежели типографики.
Но, если в табе написано «Favicon...», его действительно проще асоциировать с данной статьёй, чем если куча табов представляется как «Хабрахабр...». Пока основное преимущетсво вижу в этом, если абстрагироваться от споров о правильности с точки зрения неких правил.

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

[zencd]

Легко же вы меняете убеждения…

[zencd]

Хотя «к сведению» это ещё не смена…
Наверное, это было что-то моё :-))

Вообще, «icon — site — page» выглядит логичнее: site логично группируется с icon. Но найти нужное окно в таскбаре/таббаре проще если делать наоборот: иконка скажет о ресурсе, начало названия статьи — об открытой статье. Иначе была бы куча таких табов:

Хабрах… | Хабрах… | Хабрах… | Хабрах….

[McSimych]

…чтобы пользователь знал «в каком ухе у него жужжит»!

Золотые слова!

[xamelion]

Очень хороший фавикон у нешионал географик. Это анимированный gif и он очень хорошо смотрится. Смотрел в огнелисе

[zencd]

Очень отвратительный фавикон у cult-cinema.ru — эта бесконечная, неостанавливаемая никакими средствами в файрфоксе анимация, дико надоедает.

[ganzer]

Сайт начинается с иконки.

[kulikoff]

С фавиконки тогда уж :)

[zencd]

/* Следует отметить, что Firefox, Safari и Opera (в IE не проверял) поразному понимают и интерпретируют слеш идущий перед адресом иконки */

Не останавливайтесь, продолжайте!

[gigigi]

и я не понял. у картинок, ссылок, скриптов, css значит одинаково понимают, а у фавиконки по разному? :)

[rumkin]

У меня на моём компьютере каждый браузер по-разному отнёсся к ссылке на favicon с идущим впереди слешем: FF и Safari не показали ничего, а Opera вместо /favicon/favicon.ico обратилась к favicon.ico. Когда убрал слеш всё нормально заработало.

[Timon]

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

[dinis]

Добавлю еще с точки зрения веб-сервера — все браузеры опрашивают наличие favicon, причем отдельным запросом. Поэтому если у сайта она есть, и браузер ее закешировал, лишнего запроса к веб-серверу не будет, а еррор-логи сервера не будут замусорены отсутствием фавиконки :).

[devenge]

Картинок не видно. Только у меня одного?

[Killy]

Send Referrer Information ):

[alexxxst]

Service Unavailable

[Richard_Ferlow]

В ИЕ6ть отображение favicon еще бы хоть каким-то способом можно было привести к логичному порядку — было бы замечательно.

[LevaniD]

спасибо, замечательная статья

[Loengreen]

Хорошая статья. Но причем тут типографика?
Типогра́фика — графическое оформление печатного текста посредством набора и вёрстки с использованием норм и правил, специфических для данного языка.

Вы же говорите о необходимости favicon (о том что она должна уникально идентифицировать сайт) и обсуждаете логическое оформление заголовка окна.

[Halt]

Ну, частично типографика была все же затронута =) Когда автор писал о заголовке :)

[rumkin]

Я объяснил в предисловии к статье почему отнёс её именно в типографику. Для меня типографика — печатное юзабилити.

[Loengreen]

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

Еще раз повторюсь. Статья неплохая, но к типографике никакого отношения не имеет.

[maxk]

Хорошо, что кто-то собрал все правила в одном месте. Спасибо.

[kortunov]

Категорически не согласен с использованием Favicon как индикатора каких-то событий или статусов. Иконка должна быть на сайте только одна. На то она и Favicon — Favorites Icons (икона для закладок). Ни входящую почту, ни тип контента иконка отражать не должна, это все делается другими способами.

[rumkin]

Долго думал указывать этот пункт или нет… Мне всё-таки кажется, что на сайтах для «быстрого» обмена информацией такое использование допустимо, например «в контакте» или на ютубе…

[kortunov]

А ты уверен, что оно будет работать как надо? Чесно сказать, я не видел такой подход «в деле». Но у меня есть подозрение, что браузер не так часто запрашивает favicon и активно использует кешированную картинку.

[rumkin]

При добавлении в избранное сохранится та иконка которая отображалась в момент добавления. А посмотреть в действии можно в том же контакте.

[rumkin]

Подправил статью для ясности!

[zencd]

Если иметь два файла /favicon.ico и /favicon-mod.ico то пусть хоть закешируется — нам-то какая разница? Нам главное указать нужный вариант в HTML или JavaScript, а браузер её покажет, никуда не денется.

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

[kortunov]

Хмммм… Нынче я — лошара в CSS и HTML. Но я думал, что никак нельзя повлиять на favicon из веб-странички. Завтра проконсультруюсь с нашим веб-технологом, возможно я безнадежно отстал.

[rumkin]

повлиять можно прописав в <link rel="shortcut icon" … /> нужный адрес, можно и через JS влиять.

[zencd]

Вы хоть обоснуйте… То что цель достигается «другими способами» ещё не значит что этот подход нельзя использовать.

А иконка и так по сути одна — имелись ввиду вариации основной иконки с добавлением незначительных элементов. Узнавание остаётся (если об этом позаботиться).

[kortunov]

Так вроде-бы обосновал. Что favicon даже не по названию не для этих дел. Можно же на самой страничке как-то намекать о том, что будет происходить. Плюс, если уж делать все по-взрослому и аппелировать к user experience, то едва ли кто-то будет наблюдать за иконкой рядом с адресом сайта — это брендинг, но не статус.

[zencd]

Ну придумывали его не для этого, наверное :-)
Конечно — это в первую очередь брендинг и можно другими средствами.

Но вот такой юзкейз — сейчас многие слушают музыку вконтакте; открыто несколько вкладок, в одной из них играет музыка; понадобилось поменять песню… Каким бы суперинформационным ни был заголовок окна, гораздо быстрее выцепить мигающий фавикон. Да и ширина табов нынче невелика чтобы что-то среди них что-то эффективно находить.

Вообщем не просто так появился этот мигающий фавикон вконтакте…

[kortunov]

Не-не-не! Только не мигающий favicon, Девид Блейн!

[rumkin]

))))

[rumkin]

Мигающий? Анимации в фавиконе быть не должно!

[zencd]

Дык я ж не знал — вы ведь в статье не упомянули :-))

(Кстати это я слажал — не мигает она.)

[rumkin]

Спасибо. Стоит указать.

[denisx]

good text. but «в IE не проверял» — funny =) up to 85% in some places…

[Zaandr]

а можно поподробнее как изменять фавикон при проигрывания аудио на странице? может получиться отличная статья!

[onthefly]

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

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

[rumkin]

Типографика и есть юзабилити, только печатное!

[ppbimix]

красиво когда фафикон является первой буквой названия сайта

[yaroslavpat]

Спасибо, хорошая статья и хорошие ссылки.