Настраиваем режим совместимости в браузере Internet Explorer

Internet Explorer 8 для разработчиков. Часть 1. Поддержка стандартов и обеспечение совместимости

Алексей Федоров

Задание режима совместимости в HTML-коде

Задание режима совместимости на стороне сервера

Режимы совместимости

Исправление несовместимостей

Взаимодействие между документами

Расширения объекта Event

Порядок следования атрибутов

Определение версии

Определение объектов

Корректный HTML-код

Использование класса элемента

Метод getElementById

Префикс-селекторы CSS

CSS-выражения

Поддержка JSON-объектов

Начальные значения CSS-свойств

Неустановленные значения CSS-свойств

Коллекции атрибутов

Поддержка компонентов ActiveX

Адаптивное масштабирование (Adaptive Zoom)

Улучшения в выводе на устройства печати

Компонент File Upload

Улучшения в производительности

Установка значений элементов CSS

В процессе создания новой версии браузера были выделены три основных приоритета для поддержки разработки веб-приложений и сайтов: поддержка стандартов и обеспечение совместимости с существующими веб-приложениями и сайтами; упрощение и ускорение разработки веб-приложений и сайтов; расширение сценариев использования веб-приложений. В данном цикле статей мы рассмотрим ключевые возможности Internet Explorer 8, предназначенные для веб-разработчиков. Настоящая статья посвящена стандартам и обеспечению совместимости.

В предыдущих версиях Internet Explorer разработчики и дизайнеры могли наблюдать некоторые отличия от стандартной поддержки ряда веб-стандартов и обработки HTML, CSS и скриптовых сценариев.

В большинстве случаев это было связано с тем, что версии Internet Explorer выходили с опережением веб-стандартов — таким образом, когда появлялась окончательная версия этих стандартов, поведение Internet Explorer могло отличаться от рекомендованного.

Для обеспечения совместимости с предыдущими версиями Internet Explorer был реализован новый, встроенный в Internet Explorer 8 механизм, позволяющий эмулировать поведение предыдущих версий браузера как для отдельных страниц, так и для веб-приложений и внутренних и внешних сайтов.

Указать на совместимость с Internet Explorer 8 можно несколькими способами, используя для этого специальный метатэг:

Данный метатэг указывает, что сайт всегда должен запускаться в режиме поддержки (эмуляции) Internet Explorer 7.

Добавить данный метатэг можно несколькими способами, которые мы рассмотрим ниже.

Задание режима совместимости в HTML-коде

Для задания режима совместимости на стороне клиента в HTML-коде страниц следует с помощью любого HTML-редактора вручную добавить соответствующий тэг ко всем страницам сайта, расположив его внутри элемента HEAD перед всеми остальными тэгами, кроме TITLE и META.

Задание режима совместимости на стороне сервера

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

Можно добавить специальный HTTP-заголовок с помощью средства управления веб-сервером Internet Information Services — IIS Manager. Этот заголовок может быть добавлен как для отдельного сайта, расположенного на сервере (site-wide), так и для всех сайтов (server-wide). Для этого следует выполнить следующие шаги:

• выполнить команду Start -> Administrative Tools -> Internet Information Services (IIS) Manager;
• раскрыть вкладку Connections и выбрать сайт, для которого будет добавлен дополнительный HTTP-заголовок;
• в панели утилит выбрать иконку HTTP Response Headers и дважды щелкнуть по ней мышью;
• в панели Actions выбрать команду Add;
• в панели Add Custom HTTP Response Header добавить в поле Name значение X-UA-Compatible, а в поле Value — значение IE=EmulateIE7;
• нажать кнопку Ok для сохранения изменений.

Аналогичные действия можно реализовать и из утилиты командной строки. Для этого в каталоге %systemroot%system32inetsrv следует выполнить следующую команду:

appcmd.exe set config —section:system.webServer/httpProtocol

/+”customHeaders.[name=’X-UA-Compatible’,

value=’IE=EmulateIE7’]” /commit:apphost

Также можно сконфигурировать веб-сервер, изменив содержимое конфигурационного файла Web.config или applicationhost.config следующим образом:

После этого поместите измененный конфигурационный файл Web.config в корневой каталог вашего веб-сайта. Отметим, что в случае применения решения на серверной стороне не нужно включать метатэг в HTML-код страниц — он будет вставляться автоматически.

Информацию о том, как изменить настройки для веб-сервера IIS 6, можно найти на сайте MSDN по адресу: http://msdn.microsoft.com/en-us/library/cc817572.aspx.

Информацию о том, как изменить настройки сервера Apache см. на сайте MSDN по адресу: http://msdn.microsoft.com/en-us/library/cc817573.aspx.

Режимы совместимости

Описанное выше значение метатэг X-UA-Compatible IE=EmulateIE7 является одним из нескольких, распознаваемых Internet Explorer 8. В табл. 1 показаны все возможные значения элемента IE.

В Internet Explorer 8 поддерживается несколько режимов расположения содержимого — выбор режимов зависит от рекомендаций, описанных в веб-стандартах, и позволяет разработчикам выбрать наиболее подходящий для решения их задачи стандарт. Возможные режимы описаны в табл. 2.

Более подробно о !DOCTYPE см. информацию на сайте по адресу: http://msdn2.microsoft.com/en-us/library/ms535242.aspx.

Содержимое строки User-Agent для стандартного режима

Обратите внимание, что даже если Internet Explorer 8 работает в режиме совместимости с Internet Explorer 7, часть строки User-Agent будет по-прежнему содержать текст Trident/4.0, что позволит определить наличие Internet Explorer 8.

Ниже показан пример кода на JavaScript, позволяющий определить версию веб-браузера:

engine= null;

if(window.navigator.appName == «Microsoft Internet Explorer»)

{

   // Браузер — IE. Определяем режим работы

   if (document.documentMode) // IE8

      engine = document.documentMode;

   else // IE 5-7

   {

      engine = 5; // Подразумеваем режим «quirks»

      if (document.compatMode)

      {

         if (document.compatMode ==«CSS1Compat»)

            engine = 7; // режим стандартов

      }

   }

   // В переменной engine находится режим совместимости

}

Исправление несовместимостей

Описанные выше действия позволяют решить проблему совместимости веб-сайта с Internet Explorer 8, обеспечивая работу браузера в режиме эмуляции Internet Explorer 7.

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

После того как решение по совместимости найдено, необходимо заняться исправлением содержимого веб-страниц для того, чтобы они могли отображаться в режиме Internet Explorer 8.

Далее мы рассмотрим основные рекомендации по изменению кода страниц для обеспечения нормальной работы в режиме Internet Explorer 8.

Начнем с того, что даже в режиме эмуляции Internet Explorer 7 существует ряд нюансов, которые необходимо учитывать при обновлении кода веб-сайтов. Они будут рассмотрены ниже.

Взаимодействие между документами

Коммуникации между доменами (cross-domain) и страницами (cross-document) не поддерживаются даже в режиме эмуляции Internet Explorer 7 по соображениям безопасности.

Для обеспечения коммуникаций следует использовать технологию Cross Document Messaging (XDM). Подробнее об этой технологии можно прочесть на сайте MSDN по адресу: http://msdn.microsoft.

com/en-us/library/cc197057(VS.85).aspx.

Расширения объекта Event

Для поддержки технологии AJAX Internet Explorer содержит ряд новых возможностей, в число которых входит упомянутая выше технология Cross Document Messaging (XDM). В частности, добавление новых свойств в объекте Event может привести к неверному выполнению кода.

Например, данный код не будет работать в Internet Explorer 8 (даже в режиме эмуляции Internet Explorer 7):

event.source = myObject;

Поэтому его необходимо заменить на следующий код:

event.mySource = myObject;

Более подробно о новых свойствах объекта Event можно прочесть на сайте MSDN по адресу: http://msdn.microsoft.com/en-us/library/cc288548(VS.85).aspx.

Порядок следования атрибутов

Порядок следования атрибутов был изменен. Это изменение влияет на коллекции атрибутов, а также на значения свойств innerHTML и outerHTML. Код, зависящий от определенного порядка следования атрибутов, может работать некорректно. Например, код

attr = elm.attributes[1];

необходимо заменить на

attr = elm.attributes[«id»];

Установка значений элементов CSS

Доступ к значениям элементов CSS, которые не поддерживаются в Internet Explorer 7, но поддерживаются в Internet Explorer 8, не приводит к возникновению исключений (exceptions) при работе в режиме Internet Explorer 7 Compatibility. Код некоторых сайтов использует эти исключения для определения того, поддерживается ли тот или иной элемент CSS. Например:

try {

 elm.style.display = “table-cell”;

} catch(e) {

 // Будет работать в IE7, но не в IE8, в независимости от режима

}

Если необходима поддержка такого кода, лучшим способом является полная реализация поддержки режима Internet Explorer 8 для страницы, содержащей такой код.

Выше мы рассмотрели различия в работе браузера Internet Explorer 8 в режиме совместимости с Internet Explorer 7 и браузера Internet Explorer 7. Теперь рассмотрим основные различия в работе браузера в режиме эмуляции Internet Explorer 7 и в стандартном режиме.

Определение версии

Режим совместимости и его настройка в IE 11: вопросы и ответы

Internet Explorer является, пожалуй, единственным браузером, с которым хотя бы раз в жизни приходилось иметь дело абсолютно всем пользователям Windows: недаром же компания Microsoft совершенно бесплатно пичкает им каждую версию операционной системы.

При этом, конечно, этот программный продукт далек по своим характеристикам от идеала, но надежда на лучшее все-таки есть.

Присмотревшись к обновленному IE 11, несложно заметить, что последняя разработка смотрится, куда лучше, чем ранние версии: тут тебе и новенький интерфейс, и улучшенная скорость загрузки веб-страниц.

Только вот отдельные сайты по-прежнему отражаются некорректно: то изображения оказываются растянуты, то текст хаотично разбросан по всему полю, то меню управления перемещается из привычной точки A в точку B. В принципе выход из этой ситуации простой – достаточно перенастроить в Internet Explorer 11 режим совместимости, чтобы проблема самоустранилась. Но какие варианты настройки при этом можно предложить?

Как настроить браузер?

В принципе способов настройки в 11-м Internet Explorer режима совместимости не так-то много: всего-то включение и отключение соответствующего параметра для сайта. Другой вопрос – когда и как каждый из этих вариантов действий применим для Windows?

С первой его частью вроде бы все ясно – включаем / отключаем его в том случае, если элементы сайта не отображаются вовсе или загрузились некорректно. Соответственно, если режим совместимости для сайта был подключен, нужно его отключить, чтобы проблема исчезла и, наоборот. Что касается второй части вопроса, то здесь все несколько сложнее.

Как подключить параметры?

Исходя из опыта использования предыдущих версий стандартного браузера Windows, несложно догадаться, что включить режим совместимости в Internet Explorer 11 можно через настройку параметров просмотра в разделе «Сервис».

Единственная загвоздка в том, что найти его с первого раза не так-то просто, ведь в 11-ой версии стандартное файловое меню скрыто и, для того чтобы его «реанимировать», придется воспользоваться одной из доступных уловок, а именно:

1. отыскать кнопку «Сервис» в правом верхнем уголке открытого браузера, а затем выбрать соответствующий пункт в появившемся списке:
2. кликнуть правой кнопкой мышки по верхнему полю в стандартном браузере Windows, а затем щелкнуть в появившемся меню пункт «Строка меню» либо параметр «Командная строка». Для первого случая инструкция будет выглядеть так:Во втором же порядок настройки будет таким:
3. при открытом браузере нажать кнопку Alt, щелкнуть в появившемся файловом меню вкладку «Сервис» и выбрать необходимый нам пункт из перечня – «Параметры просмотра…». Внешне вся процедура аналогична использованию «Строки меню».

Так или иначе, после появления окошка «Параметры просмотра» для подключения режима совместимости в стандартном браузере Windows сначала ставим галочки напротив двух параметров – «Отображать сайты…» и «Использовать списки совместимости…», а затем указываем адрес веб-портала, с которым возникают проблемы при загрузке, и жмем кнопку «Добавить»:

Какой итог? Меньше 2-х минут – и режим совместимости в 11-й версии IE оказывается включен!

Как отключить параметр?

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

как включали, так и отключаем.

В этом случае для настройки совмещенного режима открываем меню «Сервис», выбираем в нем пункт «Параметры просмотра…», а затем находим в списке добавленных в исключение сайтов тот, с которым возникают проблемы при просмотре, кликаем по нему мышкой и жмем кнопку «Удалить»:

Если проблемного сайта в списке не оказалось, весьма вероятно, что он включен в стандартные списки Windows. В таком случае для решения проблемы с его загрузкой понадобится в окошке «Параметры просмотра…» снять галочку с пункта «Использовать списки…».

Для этого при открытом Internet Explorer в версии 11 жмем Alt, затем кликаем в появившемся меню вкладку «Сервис» и выбираем в предложенном списке соответствующую задачу.

Далее ставим галочку напротив пункта «Журнал» и кликаем кнопку «Удалить»:

Вот и все сложности! Справитесь?

Дополнительные функции Internet Explorer

Иногда возникает такая проблема — Internet Explorer не показывает страницы, точнее показываем чистые страницы. На самом деле страницы загружаются, по ним можно кликать, переходить по ссылкам и т.п., но содержимое не отображается в Internet Explorer. Устранить эту проблему можно следующим способом:

Пуск → Панель управления → Свойства обозревателя → Дополнительно → Использовать программную прорисовку вместо графического процессора (самый нижний пункт в списке) → ОК

После этого необходимо перезагрузить компьютер.

Режим совместимости в Internet Explorer

Бывает, что веб-сайты выглядят непредсказуемо: изображения скрыты, меню появляются не там, где нужно, текст перемешивается, не работают банк-клиенты или возникают другие нарушения работы сайтов. Это может вызываться проблемой совместимости сайта с Internet Explorer. Иногда для устранения проблемы нужно добавить сайт в список просмотра в режиме совместимости.

Добавление сайта в список просмотра в режиме совместимости:

Открыть Internet Explorer → Сервис → Параметры просмотра в режиме совместимости

В разделе «Добавить этот веб-сайт» введите URL-адрес сайта (адрес сайта, например yandex.ru) для добавления в список, а затем нажмите кнопку «Добавить» и «Закрыть».

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

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

Сброс настроек Internet Explorer

Иногда возникает необходимость сбросить все настройки Internet Explorer на стандартные. Бывает это чаще всего после настройки браузера неопытным пользователем вручную, а так же для удаления всяких «следов хождения по интернету», т.е. журнала и кэша. Сбросить настройки просто, нужно открыть:

Пуск → Панель управления → Свойства браузера → Дополнительно → Сброс → удалить личные настройки → Сброс

Internet Explorer может просматривать документы Visio

Internet Explorer теперь может быть использован как просмотрщик файлов Visio (с расширением VSD, VSS, VST, VDX, VSX или VTX). Для просмотра документа Visio достаточно дважды щелкнуть его в проводнике.

Запустится браузер Internet Explorer, и средство просмотра Visio отобразит документ в его окне. После этого можно перемещать и масштабировать изображение с помощью кнопок на панели инструментов, сочетаний клавиш или пунктов контекстных меню.

Также можно просмотреть свойства любой фигуры, открыв диалоговое окно Свойства и параметры и выделив фигуру. Некоторые параметры визуализации и отображения доступны на вкладке Параметры отображения диалогового окна Свойства и параметры.

Кроме того, можно задать видимость и цвета слоя рисования на вкладке Параметры слоя, а также видимость и цвета заметок на вкладке Параметры исправлений.

Чистая загрузка Windows

Чтобы настроить Windows на выполнение «чистой» загрузки, выполните следующие действия:

Пуск → Выполнить

Введите команду msconfig и нажмите клавишу Ввод (Enter) на клавиатуре. Откроется программа «Конфигурация системы».

На вкладке «Службы» отметьте флажком «Не отображать службы Microsoft» (она находится под списком служб) и снимите галочки со всех оставшихся элементов или нажмите на кнопку «Отключить все».

Нажмите «ОК» и соглашайтесь с запросом на перезагрузку компьютера.

Примечание: «Пуск → Выполнить» можно заменить горячими клавишами System + R (где System, это кнопка с эмблемой Windows).

Для того, чтобы отключить режим «чистой» загрузки, на вкладке Общие окна программы Конфигурация системы выберите пункт «Обычный запуск». Затем нажмите «ОК», затем «Перезагрузка».

Если в режиме «чистой» загрузки система работает корректно, это свидетельствует о том, что причиной сбоя была одна или несколько программ, которые Вы отключили. В такой ситуации методом исключения, т.е.

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

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

(Visited 688 times, 1 visits today)