Откуда взялся favicon

Dmitry Manannikov
Jul 27, 2017 · 4 min read

Перевод статьи How We Got the Favicon от Jay Hoffmann.

Изображение предоставлено Muhammad Rehan Saeed

В 1999 году, два самых больших браузера, Netscape Navigator и Microsoft Internet Explorer, были в состоянии войны за контроль над рынком. Близится момент выпуска Internet Explorer 5. В марте 1990го Microsoft предоставит пользователям беспланый браузер, глубоко интегрированный в систему, что станет решающим ударом по рыночной доле Netscape Navigator. В последующие годы это будет одним из решающих фактов в антимонопольном деле против Microsoft.

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

Именно такое экспериментирование побудило разработчика Бхарат Шьям (Bharat Shyam) в Microsoft сделать довольно простое дополнение, работая над функцией «Избранное» Internet Explorer. Уже в IE 4 пользователи могли добавлять сайты в список избранного, который по по сути был скопирован из фичи «закладки» Netscape. Но чего не хватало обоим браузерам, так это простого способа находить нужные сайты в этом длинном списке.

Поэтому, чтобы сделать сайты в списке различающимися, Shyam добавил небольшую иконку рядом с каждым сайтом в списке избранных. Картинка размером 16 x 16px, которая могла помочь пользователям отличать один веб-сайт от другого. Он назвал это незначительное улучшение favicon, что является комбинацией “favorite” (избранный) и “icon” (иконка). Сегодня слово favicon существует почти за пределами его этимологии в нашем языке, но его происхождение почти обманчиво просто.

Чтобы включить значки для сайта, Shyam сделал это так, чтобы разработчикам просто нужно было создать файл с именем favicon.ico и поместить его в корневой каталог своего веб-сервера. Internet Explorer будет знать, где искать возможный значок, прежде чем добавлять сайт в список избранных ссылок.

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

Как гласит легенда, поздно ночью, Шьям работал над своей новой фичей. Он обратился к младшему менеджеру проекта Рэй Сан (Ray Sun), чтобы показать ему результат.

Шьям прокоменнтировал «Это хорошо, правда? Проверь сам.», запросив разрешение вливание кода в кодовую базу Internet Explorer, чтобы он мог быть выпущен в следующей версии. Сан не слишком долго раздумывал, функция была классной и явно давала IE преимущество. Поэтому он дал свое согласие на добавление. И именно так, favicon пробился в Internet Explorer 5, который станет одним из самых больших релизов, которые когда-либо видели в Интернете.

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

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

Однако это не длилось слишком долго. Через некоторое время (что часто бывает) веб-стандарты начали догонять. И они взяли более взвешенный и доступный подход. Во-первых, были случаи, когда добавление файла favicon в корневой каталог сервера было затруднительным или даже невозможным. Таким образом, появившееся предложение в W3C указывало использовать элемент link с новым атрибутом, который позволил разработчикам точно определить, где можно найти изображение favicon. Это также дало разработчикам возможность использовать формат, отличный от .ico. Это выглядело так:

<link rel=”icon” href=”/path/to/icon.png”>

Более широкое внедрение браузерами вскоре привело к появлению новых инноваций, которые, в свою очередь, принесли свои собственные проблемы. Например, достаточно скоро Microsoft начала использовать favicon не только для закладок, но и в нескольких разных контекстах, например, рядом с URL-адресом в адресной строке (вскоре после этого подтянулись другие браузеры). Но первоначальная идея Microsoft состояла в том, чтобы иметь одно изображение для избранных (shortcut) и одно для всего другого (icon). Фича попала в браузер прежде, чем она прошла W3C, но никогда не достигла цели. Однако при этом оставила странный побочный эффект. В более старых версиях IE необходимо было определить как shortcut, так и icon для работы favicons, хотя shortcut фактически не использовался нигде. Это выглядело так:

<link rel=”shortcut icon” href=”/path/to/icon.png”>

Эта реализация, кстати, по-прежнему поддерживается во всех браузерах по историческим причинам.

Итак, favicon пробрался в Internet Explorer 5 и стал одним из наиболее важных функций браузера. Это одно из тех быстрых решений, которые сегодня кажутся безбашенными. Но даже самое маленькое звено цепи делает историю.

Dmitry Manannikov

Written by

Переводы технических статей. Мои собственные статьи на http://slonoed.net

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade