Скачать и установить Internet Explorer 9 Platform Preview можно на специальной странице. На ней же можно посмотреть на демки поддержки HTML5, CSS3 и SVG(!).

Устaнавливать эту сборку можно не опасаясь, она не имеет никакого отношения к Интернет Эксплореру, установленому на вашей системе. Минимальные требования для установки — Windows Vista SP2 и выше. Видимо и с релизом будет так же.

Из интересных вещей стоит отметить высокую скорость рендеринга и поддержку некоторых аспектов CSS3 и HTML5. Поддерживается свойство border-radius и CSS3 селекторы. Поддерживается тег video на http://youtube.com. Фильтры из предыдущих версий IE не поддерживаются.

Поддержка CSS3 пока что на невысоком уровне, по крайней мере если смотреть на http://css3please.com. Более того, замечены глюки с некоторыми свойствами и псевдоклассами из CSS2, например :first-letter. Тем не менее, мне кажется что направление выбрано правильное и результаты не заставят себя ждать. Уже то, что в Microsoft поняли, что цикл разработки продукта не может продолжаться 6 лет, уже о чем-то да говорит.

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

IE 6/7/8/9, Firefox 3.6, Opera 10.5, Safari 4, Chrome 4 – уже 8 браузеров, это не говоря о мобильных. У верстальщиков всегда будет хлеб. С маслом.

Это детище мелкомягких, срок выдержки которого поболее чем у лучших коньяков, не желает становиться лучше с годами (видимо надо было хранить в дубовых бочках). И нам, веб-разработчикам, приходится с этим мириться. Количество версий Интернет Эксплорера, которые надо поддерживать – растет, и эпопея эта затянулась. Со времени выхода 7-ой и 8-ой версии Интернет Эксплорера появилось несколько утилит, позволяющих тестировать верстку в нескольких версиях IE одновременно.

Вот скромный список вариантов “борьбы” с Интернет Эксплорером:

• Multiple IE
• IE Tester
• IE Collection
• Виртуальные машины
• Выйти на пенсию

А теперь немного подробнее:

Multiple IE. Живет это зверь здесь. Вернее жил. На данный момент проект закрыт и не поддерживается, но утилита доступна для скачивания и более-менее функцию свою выполняет. Тем не менее я решил отказаться от ее использования из-за того что она стала “привирать” а иногда откровенно глючить. Кроме того, появились более удачные “конкуренты”.

IE Tester. Ребята из DebugBar пошли дальше и создали утилиту, позволяющую иметь одновременно установленными 5.5, 6, 7 и 8 версии Интернет Эксплорера одновременно, с собственными javascript-движками. Причем выполнено это все в виде одного браузера, в каждой отдельной вкладке которого можно открыть нужную вам версию IE. Программа работает как в ХРюне, так и в Висте. Интерфейс правда немного подкачал, ибо выглядит как китайский MS Office 2007, но это не главное.

По большому счету, на этом можно было бы и остановиться, но. При ежедневном ее использовании на Windows XP, были обнаружены некоторые странности:

• Иногда не подхватываются стили из файла, вынесенного с помощью условных комментариев.
• Иногда вкладка с IE6 просто тихо умирает и не реагирует.
• Несколько раз замечены несоответствия отрисовки страницы в IE Tester и в IE6, установленном нативно.

Причем дома, на Windows Vista, таких проблем замечено не было. Вам решать. Двигаемся дальше.

IE Collection. Об этой утилите я узнал совершенно случайно недавно, в контексте беседы о разработке под IE. В ней на выбор предоставлены фактически ВСЕ версии IE:

• Internet Explorer 1.0 (4.40.308)
• Internet Explorer 1.5 (0.1.0.10)
• Internet Explorer 2.01 (2.01.046)
• Internet Explorer 3.0 (3.0.1152)
• Internet Explorer 4.01 (4.72.3110.0)
• Internet Explorer 5.01 (5.00.3314.2100)
• Internet Explorer 5.5 (5.51.4807.2300)
• Internet Explorer 6.0 (6.00.2800.1106)
• Internet Explorer 6.0 (6.00.2900.2180)
• Internet Explorer 7.0 (7.00.5730.13)
• Internet Explorer 8.0 (8.00.6001.18702)

Даже если принять во внимание, что первые шесть позиций в списке нужны только эстетствующим bdsm-щикам, а седьмая Яндексоидам, то все остальные очень нам подойдут. И все это чудо, начиная с 4-ой версии должно работать стабильно во всех ОСях Майкрософт, начиная с XP. На сайте есть таблица совместимости. Вроде бы “кричали женщины Ура и в воздух чепчики бросали”, но. Опять но. При попытке установить все это добро на Висту, инсталятор отказался выдать мне 7 и 8 версии IE. Ну 8 у меня и так есть, обойдусь. А вот с 7-ой как быть? Буду проверять с чем конфликтует.

Вот для таких “проблемных” как я, умные люди придумали виртуальные машины:

• Internet Explorer Application Compatibility VPC Image – мелкомягкое изделие, срок действия которого заканчивается 30 Апреля :) Не спрашивайте меня почему. Посмотрим какие цифры там будут стоять 1-ого Мая. Работает через Virtual PC, естественно на ХР и Висте.
• Virtualbox – кросс-платформенное решение, полноценная виртуальная машина, со всеми вытекающими. Из минусов – при отсутствии готовых образов придется создавать свои, с установкой и сексом.
• VMware Player – дублировать предыдущий абзац не буду. Читайте выше.

Я с виртуальными машинами работать не люблю. Не люблю и все тут. При открытом Фотошопе, полной кошелке браузеров, редакторе, файловом менеджере и еще каком нибудь плеере в фоне еще открыть две виртуальные машины? Увольте. Видимо мне пора на пенсию :) А вы сами решайте.

Теперь у разработчиков есть реальная возможность тестировать свои творения под Safari, да и просто попользоваться этим браузером. А у MSIE в очередной раз отбирают долю пользователей. Качаем.

А для тех из вас, кто уже озадачился описанием специфических стилей предлагаю вариант, найденый мной на просторах Сети:

::root p { color: red; }

Этот стиль будет читаться только в Safari. Если знаете другие варианты – вэлкам в комменты.

P.S. Для тех, у кого проблемы со шрифтами в Safari под Windows в продолжении способ лечения. Нужно открыть папку c:\Documents and Settings\User Namе\Local Settings\Application Data\Apple Computer\Safari, в ней лежит файл Fonts.plist, который нужно открыть в текстовом редакторе, найти второй открывающий тег dict и под ним вставить следующие строки (если их там нет):

<key>Verdana</key>
<string>C:WINDOWSFontsverdana.ttf</string>
<key>Verdana Bold</key>
<string>C:WINDOWSFontsverdanab.ttf</string>
<key>Verdana Italic</key>
<string>C:WINDOWSFontsverdanai.ttf</string>
<key>Verdana Bold Italic</key>
<string>C:WINDOWSFontsverdanaz.ttf</string>
<key>Tahoma Bold</key>
<string>C:WINDOWSFontstahomabd.ttf</string>
<key>Tahoma</key>
<string>C:WINDOWSFontsTahoma.TTF</string>
<key>Trebuchet MS</key>
<string>C:WINDOWSFontstrebuc.TTF</string>
<key>Trebuchet MS Bold</key>
<string>C:WINDOWSFontstrebucbd.TTF</string>
<key>Trebuchet MS Bold Italic</key>
<string>C:WINDOWSFontstrebucbi.TTF</string>
<key>Trebuchet MS Italic</key>
<string>C:WINDOWSFontstrebucit.TTF</string>

Если же эти шрифты уже там прописаны, то остается только надеяться что Apple быстро исправять все неполадки, а пока что не стоит относиться серьезно к этой версии. ;)

Но мало кто знает что существует аналог этого незаменимого (не побоюсь этого слова) для разработчиков решения для Интернет Эксплорера.

Расширение одинаково хорошо работает как в Интернет Эксплорере 6, так и в Интернет Эксплорере 7. “Хорошо” это конечно сильно сказано, но все таки это лучше чем ничего. Основной функционал:

• DOM Инспектор
• Выделение заданых или произвольных элементов
• Отключение cache, картинок, cookies, javascript, css
• Просмотр классов, идентификаторов, путей ссылок
• Валидатор CSS, HTML, RSS и ссылок
• Работа с изображениями
• Resize и линейка

Для Интернет Эксплорера это даже много :)

Качаем с офф.сайта или по прямой ссылке. Весит всего 565кб.

P.S. Для тех, у кого появляется ошибка в Javascript при открытии любой страницы есть возможность скачать эту или эту бета-версию. На сколько я понял там такой проблемы не возникает. Спасибо m_vitaly за bugtrack.

• Firefox
• Mozilla
• Opera
• Netscape
• Internet Explorer
• Safari

Итак, что же нам нужно? Нужно создать еще одно меню, естественно XHTML/CSS, с картинками, которое будет загружаться в браузер клиента при отсутствии на его машине flash/javascript. Да хотя бы даже заменить флэшевый баннер на обычный, чтобы не терять рекламу. Я подготовил два простых решения, которые помогли мне и надеюсь, помогут вам.

Решение номер раз. SWFObject

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

В моем случае, после установки у себя этого скрипта на некоторых из машин, на которых был установлен Internet Explorer 6 и Flash Player 6, без всяких видимых причин происходил сбой и браузер благополучно умирал.

В Файрфоксе, Опере и IE7 ничего такого не происходило и все работало отлично. Но мы посетителями не разбрасываемся и поэтому я решил найти другое решение, так как в комментариях к описанию SWFObject я ничего кроме восторженных отзывов не нашел.

Это решение все таки имеет право на существование, поэтому решайте сами.

Качаем у разработчика, или у меня.

Решение номер два. Adobe Flash Detection Kit.

Как и в прошлый раз, я решил обратиться к первоисточнику, а именно к компании-разработчику Flash, Adobe. И не пожалел об этом. Детектор версии/присутствия flash player’а на машине пользователя, созданный их разработчиками полностью решает нашу проблему.

Скрипт, предоставляемый ими, разделен на три части:

- Action Script detection – SWF файл, встроеный в HTML документ, который определяет версию плеера. Естественно с исходниками.

- Client Side detection – Javascript/HTML блок, вставляющийся в любой документ в котором нужно определить версию плеера. В этом же блоке описывается альтернативный контент, который нужно вывести если не установлен флеш плеер, и контент, который будет отображаться если у посетителя нет ни флеш плеера, ни поддержки javascript’a. Единственное неудобство – если в обоих случаях вы хотите выводить XHTML/CSS меню/контент, то нужно прописывать его дважды. Или же вытаскивать через переменную.

- Express Installation – Тоже самое что и Client Side detection, но автоматически запускает экспресс-инсталяцию плагина при его отсутствии.

Посмотрим как это выглядит:

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Client Detection Example</title>
<script xsrc="AC_OETags.js" mce_src="AC_OETags.js" language="javascript"></script>
<script language="JavaScript" type="text/javascript">
<!--
// --------------------------------------------------
// Globals
// Major version of Flash required
var requiredMajorVersion = 8;
// Minor version of Flash required
var requiredMinorVersion = 0;
// Minor version of Flash required
var requiredRevision = 0;
// --------------------------------------------------
// -->
</script>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
// Version check based upon the values entered above in "Globals"
var hasReqestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);
// Check to see if the version meets the requirements for playback
if (hasReqestedVersion) {
// if we've detected an acceptable version
// вывод флэша, при условии что пройдены все проверки
AC_FL_RunContent(
"src", "example",
"width", "550",
"height", "200",
"align", "middle",
"id", "detectionExample",
"quality", "high",
"bgcolor", "#FFFFFF",
"name", "detectionExample",
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
'codebase', 'http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab',
"pluginspage", "http://www.adobe.com/go/getflashplayer"
);
} else { // если версия плэера слишком старая или не определена
var alternateContent = 'Сюда вписываем контент, подгружаемый если версия плэера слишком старая или не определена <BR/>'
+ 'И сюда. '
+ '<а hrеf=http://www.adobe.com/go/getflash/>Get Flash</a>';
document.write(alternateContent); // insert non-flash content
}
// -->
</script>
<noscript>
А сюда вписываем контент, который будет выводиться при отсутствии и флеша и поддержки javascript.
This content requires the Adobe Flash Player and a browser with JavaScript enabled.
<a hrеf="http://www.adobe.com/go/getflash/" mce_href="http://www.adobe.com/go/getflash/" >Get Flash</a>
</noscript>
</body>
</html>

Скачать можно на сайте Adobe или у меня.

* Имя файла ролика в скрипте вставляется без расширения .swf.

* Скрипт сохраняет валидность кода.

Не забываем правильно указать пути к .js файлам и включать фантазию иногда.

Другие решения приветствуются, так что если у вас есть что сказать – пишите в комментарии. Надеюсь что статья вам помогла.

P.S. Этот скрипт адаптирован к настройкам безопасности в Интернет Эксплорере и выводит флэш без рамочки. Об этой проблеме я писал ранее.

Устанавливаем, заходим в настройки, импортируем список большинства известных user-agent’ов, который можно скачать отсюда в формате XML и все готово.

После этого идем в Tools – User Agent Switcher, выбираем “овечью шкуру” и идем тестить :)

В Сети уже довольно давно проскакивали всевозможные утилитки, позволяющие устанавливать одновременно несколько версий Internet Explorer’а на одну операционную систему.

Большинство из тех, которые мне довелось тестировать страдают глюкавостью или не поддерживают Conditional comments.

Но вот сегодня я наконец то нашел решение проблемы. Утилитка, быстрая в инсталяции, которая позволяет IE 7 комфортно чувствовать себя в stand-alone инсталяции, в любой папке, которую вы укажете.

Все до смешного просто:

- Скачиваете дистрибутив с Мелкомягкого сайта, но не устанавливаете его.

- Затем скачиваете утилитку у меня или с сайта разработчика. Разницы нет.

- Распаковываете все это добро в любую нужную вам папку, запускаете одноразово файл “IE7 Standalone Setup.bat”, происходит процесс инсталяции, который не затрагивает системные файлы и вуаля – запускаете IE7.bat из той же папки для работы в Internet Explorer 7.

Upd. Можно еще пользоваться утилитой IE Tester, которая отлично справляется с работой, вплоть до IE 8 beta

Upd 2. Более актуальная статья на тему Internet Explorer.

Тулбар для Оперы, похожий на известное расширение для Firefox. Думаю будет полезен тем, кто верстает под Оперу.

Для установки достаточно открыть эту страницу в Опере, выбрать версию и нажать на ссылку. Файл .ini распознается Оперой автоматически. Более подробные инструкции на страничке автора, по-английски.

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

В файл httpd.conf добавляются следующие строки:

 ExpiresActive On
ExpiresDefault A18000
ExpiresByType image/gif A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/png A2592000

Которые заставляют браузер кешировать файлы картинок сроком на 30 дней (2592000 секунд, при желании можно поменять), как это указано в спецификациях W3C а не так как этого хотят Мелкомягкие.

* Те у кого нет доступа к httpd.conf могут прописать эти строчки в .htaccess файле, в самом низу.

Затем нужно убедиться что в Апаче включен модуль mod_expires:

LoadModule expires_module modules/mod_expires.so

Вуаля! Все отлично заработало. Но есть один момент. Это решение не будет работать если ваши картинки грузятся с постороннего сервера.

Такое же решение для сервера IIS здесь (eng).

Источник там (eng).