Favicon для Internet Explorer!

Нет в Мире Совершенства

(но мы можем к нему стремиться)!

Эта небольшая статья статья обязана своим написанием наблюдательности Челиты (Былое и думы) и Несовершенству Мира. Ну, о несовершенстве мира мы поговорим в другой раз и даже войну браузеров будем обсуждать не сегодня. А сегодня лишь примем как данность, что некоторые вещи в интернете не будут работать сразу во всех браузерах. Так в комментарии к предыдущей статье, где я рассказывала о том как сделать Favicon для Blogger'a, Челита удивленно заметила, что она не видит никакого "пляшущего мишки" в командной строке браузера. И тут я поняла, что столкнулась вот с этим самым Несовершенством Мира! Да я читала, что для "старых" браузерах типа Internet Explorer надо писать отдельный код, но, признаться честно, я не очень в это поверила, статья, которую я читала была написана давно и я наивно полагала, что в 2008-то году все уже будет работать для любого браузера... Ну, хорошо, о моей наивности мы поговорим в другой раз, а пока ситуацию нужно срочно исправлять, а то расхвасталась я в прошлой статье какой у меня теперь симпатичный мишка сидит в командной строке и у вас будет сидеть если вы добавите эту страничку себе в закладки....

Короче, исправляем ситуацию.

Сначала немного теории:

1) Favicon для Internet Explorer может быть маленькая картинка только в формате .ico
надо же я никогда и не слышала об этом формате прежде! [Спасибо Челита ;)]
2) Favicon для Internet Explorer не будет анимированным (т.е. мой мишка плясать, увы, не будет, но впрочем будет вполне узнаваем!)
3) У вас в блоге может несколько описаний для Favicon сначала описываем Favicon для Internet Explorer, затем для других браузеров можем поставить анимированную картинку в качестве Favicon.

Итак, теперь к делу.

1. Будем исходить из того что на предыдущем шаге мы уже поставили Favicon на наш блог. И это скорее всего была картинка в формате png jpg или gif. Теперь у нас есть 2 пути - Первый воспользоваться продвинутым редактором картинок и попросить его сохранить нашу картинку в формате .ico А если у вас нету такого "продвинутого" редактора, то можно пойти по второму пути - этот путь ведет нас на сайт http://www.genfavicon.com/ где мы можем из нашего рисунка сгенерить Favicon в том самом ico формате.

Сайт к сожалению на английском, так что я быстренько объясню вам последовательность действий:
1) В оранжевом квадратике выбираем картинку из интернета [первое поле ввода] или cо своего компьютера нажимаем [browse] чтобы выбрать картинку. Теперь нажимаем [Upload].

2) Теперь мы видим нашу картинку в правом окошке и серую активную область наложенную на неё. Как работать с "активной областью" мы обсуждали в статье где мы меняли размер картинки т.е. теперь мы можем мышкой перемещить и сжимать-растягивать эту область и когда серая область будет прикрывать ту часть картинки, которую мы хотим видеть на нашей Favicon мы нажимаем кнопку в зеленом квадратике [Capture & Preview]

3) Теперь в синем квадратике мы видим нашу иконку и если она нам нравится мы нажимаем [Download Favicon] и видим пустую станичку только с нашей картинкой кликаем правой кнопкой мыши (у меня там безымяный палец) и выбираем сохранить рисунок.

2. Теперь у на на компьютере есть маленькая картинка с расширением ico только вот не совсем понятно куда его поместить, потому что мой горячо любимый Photobucket файлы с таким расширением сохранять не захотел, Blogger и Picasa (где собственно хранятся все картинки нашего блога, которые мы загружаем в блог напрямую с домашнего компьютера) тоже не хотят размещать картинок с расширение .ico Я нашла способ хранить ico файл на Народе завела там аккаунт и закачала туда файл. [Если понадобится инструкция как это сделать - спрашивайте, я напишу. Или пришлите мне вашу иконку, а я ее на Народ помещу.]

3. И наконец самое последние добавляем новую строчку в наш HTML код нашего Дизайна. Как и в прошлый раз выполняем последоватнльность действий: На "Панеле инструментов"(Dashboard) мы выбираем "Дизайн"(Layout) и в Дизайне кликаем на Изменить HTML. В открывшимся окошке находим строчку:

</head>

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