Получить профессию в SkyproРешение: IE9 переходит в режим совместимости на сайте HTML5
Быстрый ответ
Чтобы предотвратить переключение IE9 в режим совместимости убедитесь, что ваш HTML начинается с корректного DOCTYPE и в своем составе имеет метатег X-UA-Compatible. Эти строки должны располагаться в начале вашего документа:
<!DOCTYPE html>
<meta http-equiv="X-UA-Compatible" content="IE=edge">DOCTYPE должен быть первой строкой в HTML-коде, а метатег размещается внутри тега <head>. С их помощью IE9 будет использовать самую последнюю версию своего движка рендеринга.
Соблюдение актуальных стандартов
IE9 способен автоматически переключать режим отображения в зависимости от обозначения DOCTYPE и определённых правил HTML/CSS. Если тег X-UA-Compatible настроен некорректно или отсутствует, то это может привести к переключению IE9 в режим совместимости, что помешает корректному отображению вашего сайта.
Обеспечьте соответствие вашего сайта современным веб-стандартам
Соблюдение веб-стандартов гарантирует корректное отображение вашего сайта в различных браузерах, включая IE9. Старайтесь избегать устаревших технологий HTML и CSS. Вместо определения браузера используйте feature detection, чтобы проверять доступность определённых возможностей в браузере. Это повысит гибкость вашего сайта и его совместимость с будущими обновлениями.
Попрошу о контроле настроек браузера и пользовательских выборов
Ваш сайт может быть вынужденно переведен в режим совместимости в силу индивидуальных настроек пользователя или же алгоритмов работы самого браузера. Чтобы избежать этого, объясните пользователям, как зайти в меню Инструменты -> Настройка режима совместимости и убедите их, что ваш сайт не добавлен в список сайтов, работающих в режиме совместимости Microsoft.
Используйте HTTP-заголовки для управления режимом совместимости
Метатег X-UA-Compatible – это хорошо, но также полезно определить аналогичные параметры в HTTP-заголовке. Это обеспечит применение параметров совместимости независимо от типа HTTP-ответа, гарантируя корректное отображение сайта.
Правильно настройте интранет и скрытые меню
По умолчанию IE9 может переводить сайты интранета в режим совместимости. Разъясните пользователям, как с помощью клавиши Alt они смогут получить доступ к скрытым меню IE и при необходимости изменить настройки совместимости. Правильное размещение meta тегов поможет избежать включения вашего сайта в список сайтов, работающих в принудительном режиме совместимости от Microsoft.
Визуализация
Рассмотрим Internet Explorer 9 как посетителя музея, который решает, в каком зале посмотреть экспонаты:
Посетитель IE9 (👓): "Смотреть экспонат в главном зале или в старой галерее?"Современный Режим аналогичен Главному Залу (🖼️🏛️) – здесь IE9 ожидает увидеть сайты, соответствующие актуальным стандартам:
👓🚶♂️➡️🏛️🖼️: "О, это современное произведение искусства, я останусь здесь!"Однако, IE9 может встретить устаревший элемент (🎞️) или забытую деталь (🖌️), который переведёт его в Режим Совместимости, или Старую Галерею:
👓🚶♂️➡️🏚️🎞️: "Это выглядит устаревшим, должно быть, мне стоит переместиться в исторический отдел!"Убедитесь, что ваш сайт не использует устаревшие элементы, которые могут уводить IE9 в нежелательный раздел, то есть в режим совместимости.
Решение проблем с режимом совместимости
Иногда обеспечить стабильную работу IE9 без переключения в режим совместимости бывает сложно. Если использование метатега X-UA-Compatible не решает проблему, попробуйте следующие шаги:
- Удалите временно CSS-файлы, чтобы проверить: не связана ли проблема с конкретным файлом стилей.
- Проверьте поддержку HTML5: Убедитесь в том, что IE9 адекватно поддерживает HTML5 для вашего сайта, и при необходимости используйте запасные методы.
- Избегайте условные комментарии: Такие комментарии могут привести к переключению IE9 в устаревший режим. Постарайтесь минимизировать их использование.
- Ручное переопределение: В ряде случаев настройка определённых параметров IE может помочь решить проблему с неожиданным переключением режимов.
Взгляд в будущее
Решение проблем совместимости важно, однако также значимо побуждать пользователей переходить на более новые версии браузеров с улучшенной поддержкой HTML5. Это позволит повысить качество пользовательских взаимодействий с сайтом и упростит жизнь разработчиков, сократив необходимость адаптации под устаревшие движки рендеринга.
Полезные материалы
- Объявление типа DOCTYPE в HTML — Узнайте, как использовать правильный DOCTYPE, чтобы предотвратить включение режима совместимости.
- CSS – квиркс-мод (quirks mode) и стандартный режим (standards mode) — Подробнее о влиянии DOCTYPE и режимов совместимости на рендеринг CSS.
- Режим предприятия и список сайтов режима предприятия (Internet Explorer 11 для IT-специалистов) – Понимание использования режима предприятия для улучшения совместимости в IE11.
- Сервер не отвечает на запросы клиентов – сайт на WordPress / Hostgator – большой трафик — Обсуждение использования метатега X-UA-Compatible, полезное для понимания проблем совместимости.