Jaa

Функциональность IE в сфере совместимости для веб-разработчиков

  • Artikkeli

 

Веб-разработчики предельно ясно изъявили свое желание увидеть как функциональную совместимость и соответствие стандартам (или «одинаковую разметку») в новых технологиях, так и обратную совместимость для своих существующих веб-узлов. После прочтения вопросов и комментариев по нескольким последним, связанным с вопросами совместимости статьям, я решил, что пришло время подвести итог всем функциям совместимости IE для веб-разработчиков.

В то время как IE изменяется и обретает поддержку новых технологий, разработчики хотят в некоторых сценариях получить поведение более ранних версий IE. Существует множество различных технологий, позволяющих разработчикам указывать браузеру, как обрабатывать разметку их веб-узлов. Среди основных – Режим обозревателя (Browser Mode) и Режим документов (Document Mode) в Средствах разработчика IE, мета-тег X-UA-Compatible и HTTP-заголовок и условные комментарии (Conditional Comments) . По пожеланиям сообщества разработчиков я также обновил диаграмму Как IE определяет режим документа с учетом IE9.

Режим обозревателя и режим документа

Множество пользователей, оставлявших комментарии к нашим статьям, спрашивали о разнице между режимом обозревателя и режимом документов. На веб-узле MSDN имеются хорошие статьи об этих пунктах меню в средствах разработчика. Ниже приведена краткая сводка о том, как использовать эти меню для тестирования вашего веб-узла.

Режим обозревателя (Browser Mode) задает, какую строку обозревателя User-Agent (UA) IE отсылает серверам, какие умолчания для режима документов IE используются и как IE оценивает условные комментарии (подробнее об этих составляющих ниже). По умолчанию, режим обозревателя IE9 – IE9, режим обозревателя IE8 – IE8. Будучи разработчиком, вы можете изменить это, выбрав другое значение в меню «Режим обозревателя» в средствах разработчика. Пользователь может изменить режим, нажав вручную на кнопку Просмотр в режиме совместимости (Compatibility View, CV). Большинство пользователей используют Список просмотра в режиме совместимости (CV List), обновляемый Microsoft на основе совместной работы с сообществом.

Режим обозревателя

Описание

IE9

IE9 сообщает строку обозревателя (UA), вектор версии и режим документов, соответствующий стандартному поведению браузера, которым в IE9 является наиболее соответствующий стандартам режим. Используйте этот режим, чтобы узнать, как ваш веб-узел будет работать у пользователей IE9.

IE9 Compatibility View

IE9 сообщает строку обозревателя (UA), вектор версии и режим документов, как если бы он был IE7; тем не менее, строка UA также включает в себя маркер Trident/5.0, означающий, что браузер на самом деле является IE9. Используйте этот режим, чтобы узнать, как ваш веб-узел будет работать для пользователей IE9, если они нажмут кнопку «Просмотр в режиме совместимости». Обратите внимание, что в средствах разработчика во второй предварительной версии IE9 Platform Preview содержится два пункта Compatibility View, что является известной ошибкой.

IE8

IE9 сообщает строку обозревателя (UA), вектор версии и режим документов, как если бы он был IE8. Используйте этот режим, чтобы узнать, как ваш веб-узел будет работать для пользователей IE8.

IE7

IE9 сообщает строку обозревателя (UA), вектор версии и режим документов, как если бы он был IE7. Используйте этот режим, чтобы узнать, как ваш веб-узел будет работать для пользователей IE7.

Режим документов (Document Mode) указывает, какой режим будет использован движком IE Trident для отображения разметки, например, в стандартном режиме IE9. Изменение режима документов обновляет страницу, но не пересылает строку обозревателя (UA) и не получает новую разметку с сервера.

Режим документов

Описание

IE9 Standards

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

IE8 Standards

Это поведение соответствует IE8, когда он отображает веб-страницу, имеющую строгий или неизвестный тип документа (doctype).

IE7 Standards

Это поведение соответствует IE7, когда он отображает веб-страницу, имеющую строгий или неизвестный тип документа (doctype).

Quirks

Это поведение соответствует IE, когда он отображает страницу с неуказанным типом документа (doctype) или типом документа Quirks. Это поведение соответствует поведению IE5 и поведению режима Quirks в IE6, IE7 и IE8.
Изменение режима документов для вашего веб-узла

Будучи разработчиком, вы выбираете режим документа, который IE будет использовать для отображения вашего веб-узла. По умолчанию это наиболее совместимый и соответствующий стандартам режим. В IE9 это режим IE9 Standards. Если вы считаете нужным, то можете изменить это умолчание, указав тип документа (doctype) и мета-тег X-UA-Compatible или HTTP-заголовок. Чтобы узнать, какой режим наиболее рационально использовать для вашего сайта, вы можете воспользоваться меню «Режим документов» в средствах разработчика.

Наиболее удобным способом для изменения режима документов для определенной веб-страницы является использование мета-тега. Для изменения режима документов для большого количества страниц по всему веб-узлу удобнее использовать HTTP-заголовок.

В дополнение к значениям X-UA-Compatible, поддерживавшимся в IE8, IE9 будет поддерживать два новых:

Мета-тег или содержимое HTTP-заголовка в форме "IE=______"

Описание

EmulateIE9

Emulate IE9 указывает IE использовать значение типа документа (doctype) для определения того, как отображать содержимое. Веб-страницы с неуказанным типом документа или типом документа Quirks будут отображаться в режиме Quirks. Все остальные типы документов будут отображаться в режиме IE9 Standards.

IE9

IE9 указывает IE отображать всё в режиме IE9 Standards и игнорировать тип документа (doctype).

При ориентации на режим IE9 Standards мы призываем веб-разработчиков использовать тип документа (doctype) и не использовать мета-тег X-UA-Compatible или HTTP-заголовок. Это позволяет всем достичь общей цели в работе с одинаковой разметкой, основанной на стандартах.

Если вы работаете с устаревшим веб-узлом, полагающимся на режим стандартов в понимании IE7, используйте мета-тег X-UA-Compatible или HTTP-заголовок, чтобы задать режим IE7 Standards. Ниже приведен пример, совмещающий значения таким образом, что IE8 отображает веб-страницу в режиме IE7 Standards, в то время как IE9 отображает ее в режиме IE9 Standards:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
         <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
    </head>
    <body>
    </body>
</html>

 

Чтобы применить этот результат одновременно ко многим страницам, вы можете изменить HTTP-заголовок и перенести это поведение на некоторые или все страницы на серверах Apache и IIS.

Чтобы добиться «одинаковой разметки», в IE9, по сравнению с IE8, было внесено еще одно изменение. Все плавающие фреймы (iframe) внутри страницы верхнего уровня, отображающейся в режиме IE9 Standards, также будут отображаться в режиме IE9 Standards. Единственным исключением являются плавающие фреймы, для которых указан режим Quirks, – они будут отображаться в режиме Quirks.

Определяйте функциональность, а не браузер(или «Избегайте условных комментариев»)

Мы хотим использовать одну и ту же, соответствующую стандартам разметку, как другие браузеры, в режиме IE9 Standards. Именно поэтому мы советуем разработчикам при ориентации на режим стандартов IE9 и режим стандартов других браузеров использовать обнаружение функций и поведения и одинаковые таблицы стилей.

Мы настоятельно рекомендуем использовать обнаружение функций и поведения вместо условных комментариев (Conditional Comments), функции IE, которую производители других браузеров решили не использовать. Условные комментарии не будут работать во всех браузерах и не подпадают под определение «одинаковой разметки».

Есть лишь один случай, когда приемлемо использовать условные комментарии – это обеспечение обратной совместимости таблиц стилей в IE6 или IE7. Например, такие узлы как hsn.com используют условные комментарии для загрузки определенных таблиц стилей в IE7:

 
<!--[if IE 7]>
<link rel="stylesheet" href="https://css.hsn.com/css/ie7.css?v96" type="text/css" />
<![endif]-->

IE9 продолжит поддерживать условные комментарии для обеспечения обратной совместимости с существующими веб-узлами. Вот несколько правил, которые помогут вам применить условные комментарии:

Условные комментарии по умолчанию связаны со строкой обозревателя (UA). Использование мета-тега X-UA-Compatible или HTTP-заголовка позволяет веб-странице указывать определенную версию для совместимости. Если указанное значение X-UA-Compatible превышает используемую версию IE (8 в IE8, 9 в IE9) или является меньше 7, то вместо версии, заявленной в значении X-UA-Compatible, по-прежнему будет использоваться значение строки обозревателя (UA).

Версия IE, отправляемая в строке обозревателя (UA), используется для оценки условных комментариев. Это называется вектором версии (Version Vector). Например, строка обозревателя (UA) IE7 будет иметь вектор версии 7 и условный комментарий <!--[if IE 7]> будет оценен как истинный. IE9 будет отправлять только одну из двух строк обозревателя: строку IE9 или строку режима совместимости (Compat View).

Строка обозревателя (UA)

Условные комментарии оцениваются в зависимости от следующего вектора версии

IE9

9

Compat View

7

Подводя итог сказанному выше: условные комментарии можно использовать для считывания CSS, предназначенного для IE6 или IE7. Для всего остального используйте обнаружения функций и поведения.

Обновленная диаграмма Как IE9 определяет режим документов

Чтобы проиллюстрировать, как все эти технологии работают вместе, я обновил диаграмму Определяя режим документов для IE9 (в SVG или PNG) с учетом тех новых значений X-UA-Compatible, о которых было сказано выше. Также мы обновили диаграмму с учетом ваших пожеланий. Спасибо!

Марк Силби (Marc Silbey),

руководитель команды разработчиков

Comments

  • Anonymous
    March 16, 2012
    Нет стрелок между блоками на рисунке в SVG