Internet Explorer 10 (IE10)

Спустя несколько месяцев после того, как веб-браузер Internet Explorer 10 вышел в составе операционной системы Windows 8, стала доступна версия IE10 для Windows 7 (Windows Vista и, тем более, XP — «в пролёте»).

Веб-стандарты

Новый Internet Explorer предлагает долгожданную поддержку некоторых современных веб-технологий.

  • CSS-переходы (Transitions), анимации (Animations), градиенты (Gradients), трёхмерные преобразования (3D Transforms). Приятно, что, как и в Firefox, CSS-переходы в IE10 поддерживаются не только для реальных HTML-элементов, но и для генерируемых псевдоэлементов ::before/::after.
  • CSS-свойство text-shadow, позволяющее добавлять тень тексту. В IE9 поддержка теней была «однобокой» — только в лице свойства box-shadow, добавляющего тень блоку.
  • CSS Flexible Box Layout (Flexbox) — новый способ взаимного расположения блоков (к сожалению, поддерживается лишь предварительная версия синтаксиса, отличная от окончательного стандарта; см. ниже).
  • CSS Grid Layout — новый способ взаимного расположения блоков.
  • CSS Multi-column Layout — многоколоночный вывод текста с автоматическим распределением текста между колонками.
  • HTML5 History API — возможность изменять содержимое адресной строки без перезагрузки страницы.
  • Формы HTML5: новые атрибуты (например, required) и типы элементов (например, email) с соответствующей проверкой правильности заполнения формы на стороне браузера при попытке её отправки. Поддержка атрибута autofocus, к сожалению, реализована некорректно и по сути не работает (см. ниже).
  • JavaScript-метод requestAnimationFrame(), предназначенный для реализации плавных скриптовых анимаций.
  • CORS (Cross-Origin Resource Sharing) — кроссдоменные запросы при использовании XMLHttpRequest. Ранее средствами XMLHttpRequest были возможны запросы только к ресурсам того же домена, где располагалась запрашивающая страница.
  • Перетаскивание (Drag and Drop).
  • Работа с файлами (File API).

Кроме того, поддерживается любопытный механизм, названный Exclusions (ранее известный как Positioned Floats), предложенный в качестве спефицикации W3C компанией Microsoft в сотрудничестве с Adobe и призванный дать возможность реализации вёрстки, приближенной к полиграфии, путём более тонкого управления обтеканием блоков текстом, чем позволяют обычные обтекаемые (реализуемые с помощью CSS-свойства float) блоки.

Условные комментарии

Под предлогом внедрения алгоритма разбора HTML-кода в соответствии со спецификацией HTML5 (что само по себе хорошо), Microsoft отказалась от поддержки условных комментариев (conditional comments), издавна использовавшихся для обхода проблем, специфичных для IE. Поскольку проблемы в IE были, есть и наверняка будут, для их обхода теперь остаётся использовать определение версии IE средствами JavaScript.

Отладка

Как и предыдущие версии IE начиная с IE8, новый IE10 позволяет просматривать сайт в режиме эмуляции одной из прежних версий браузера вплоть до IE7 включительно. С точки зрения отладки и проверки сайтов эта возможность обычно является удобной и достаточной заменой полноценной версии IE, запускаемой в виртуальной машине. Эта функция доступна в панели веб-разработки, открываемой по нажатию клавиши F12 либо через меню «Сервис» → «Средства разработчика».

Автообновление

В окне «О программе» в Internet Explorer 10 есть некая галка «Устанавливать новые версии автоматически». На первый взгляд, напрашиваются параллели с функцией автообновления других браузеров. Однако в условиях отчётливой политики Microsoft выпускать браузер лишь для последних двух версий Windows (т.е. после выхода Windows 9 ждать новых версий IE для Windows 7 вряд ли будет иметь смысл), велика вероятность, что эта функция реализована сугубо формально и на практике останется незадействованной.

Недостатки

Поскольку выход новой версии IE в очередной раз был жёстко привязан к выходу новой версии Windows, окончательного утверждения спецификации CSS Flexbox (Flexible Box Layout) в Microsoft немного не дождались и выпустили браузер с поддержкой ныне устаревшей предварительной версии стандарта. Это, увы, означает необходимость использовать иной синтаксис и префиксы для Flexbox-свойств и значений персонально для IE10.

Кроме того, разработчики IE10 намеренно отказались от внедрения поддержки WebGL, сославшись на риски, связанные с безопасностью. Кроссбраузерная трёхмерная графика без применения сторонних программных модулей откладывается.

Любопытно, что в IE10 вид стандартных элементов интерфейса не зависит от того, на какой операционной системе IE10 запущен: даже под Windows 7 они всегда (даже в режимах эмуляции предыдущих версий IE) выглядят так, как в Windows 8. Такое навязывание чужеродного визуального стиля Windows 8 (даже абстрагируясь от спорных качеств самого стиля Windows 8 как такового) пользователям Windows 7 является неправильным решением, снижающим удобство пользователя, поскольку стандартные элементы интерфейса в IE10 выглядят не так, как в других приложениях, а значит потенциально запутывают пользователя.

Ошибки

Нулевые значения атрибутов rowspan и colspan по-прежнему не поддерживаются.

По-прежнему недоступны для щелчка и не реагируют на наведение указателя мыши по всей площади блочные ссылки в блоке, надвинутом с помощью отрицательного поля (margin) на рамку (border), например, имитирующую колонку, растягиваемую на всю высоту родительского блока. К счастью, это хотя бы по-прежнему успешно обходится с помощью фиктивного фона rgba(0,0,0,0) для ссылок или содержащего их надвинутого блока.

Поскольку предварительные версии IE10 были доступны только в составе предварительных версий Windows 8, логично предположить, что круг тестировщиков был сильно ограничен (есть большая разница в трудоёмкости и удобстве между установкой лишь браузера и целой ОС), и это неизбежно привело к попаданию в финальную версию IE10 ряда ошибок, которые при более грамотной политике Microsoft (доступности дистрибутивов бета-версий IE10 отдельно от Windows) могли бы быть обнаружены и устранены заранее. Автор этих строк уже столкнулся с некоторыми весёлыми багами Internet Explorer 10.

  • Автоматическая установка фокуса на поле формы с HTML5-атрибутом autofocus не срабатывает при первой загрузке страницы (как путём ввода её адреса в адресную строку и нажатия клавиши Enter, так и при переходе по ссылке с другой страницы), а срабатывает только в результате обновления страницы нажатием клавиши F5 или соответствующей кнопки справа от адресной строки. По сути это означает отсутствие поддержки атрибута autofocus и необходимость использования для этой цели JavaScript даже в новейшей версии IE. (См. баг-репорт № 783017 в баг-трекере Microsoft.)
  • Если основной размер шрифта задан не для элемента BODY, а для элемента HTML, и при этом к странице подключены две таблицы стилей для устройств разных типов (media="screen" и media="print"), обе из которых содержат директиву @import с подключением одного и того же файла, то при включённой панели веб-разработки («Средства разработчика») размер шрифта, заданный для элемента HTML, игнорируется. Причём, похоже, проявление бага как-то зависит от количества CSS-правил и/или объявлений в импортируемом CSS-файле — баг перестаёт проявляться при удалении разных объявлений или правил, но продолжает проявляться, если заменить селектор на не имеющий отношения к элементам на странице, или имя или значение свойства — на фиктивные.

Данные баги не сильно критичны, но в определённой степени наглядно демонстрируют, что с уровнем программирования в Microsoft, похоже, всё по-прежнему впечатляюще. Впрочем, посмотрим. По крайней мере, IE10 определённо лучше, чем IE9 двухлетней давности.


Полный список новшеств см. в официальном обзоре IE10 (рус.). (Рекомендуется читать на английском, поскольку в русскоязычной версии слишком увлеклись переводом всего и вся, в результате не всегда легко понять, о чём речь.)