Поддержка HTML5 в Internet Explorer 8: возможности и планы

Быстрый ответ

IE8 обеспечивает только ограниченную поддержку HTML5. Многие ключевые элементы HTML5, такие как canvas, video и семантические теги, не поддерживаются в нативном виде. Для таких элементов вам придется использовать полифиллы, например, html5shiv для структурных тегов и mediaelement.js для воспроизведения медиаконтента.

Пример использования html5shiv:

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<![endif]-->

При использовании этого скрипта, IE8 "освоит" HTML5-элементы и будет применять к ним CSS-стили.

JavaScript и полифиллы: инструменты для HTML5 в IE8

У IE8 отсутствует встроенная поддержка HTML5, однако её можно частично имитировать с помощью JavaScript-библиотек и полифиллов.

JavaScript и метод createElement()

IE8 уступает прогрессивным браузерам, однако с помощью JavaScript можно "обучить" его работать с элементами HTML5. Определение отсутствующих тегов через document.createElement() позволяет применять к ним CSS-стили из ваших стилевых листов.

document.createElement('section');
document.createElement('article');

Таким образом, для IE8 незнакомые элементы "маскируются" под известные с использованием JavaScript.

Подробнее об этом расскажет наш спикер на видео

Поддержка HTML5 с помощью полифиллов

Html5shiv позволяет IE8 распознавать и стилизовать семантические элементы HTML5. Для мультимедийных тегов, таких как audio и video, в IE8 можно использовать библиотеку mediaelement.js.

Визуализация

Для наглядного представления, как IE8 работает с HTML5, обратимся к следующей таблице:

| Интернет-браузер | Распознаёт HTML4 | Распознаёт HTML5 |
| ---------------- | ---------------- | ---------------- |
| Internet Explorer 8 | 👍 (да)          | 👎 (нет)          |

Это говорит о том, что HTML4 для IE8 — обыденное дело, а HTML5 — это новшество, с которым он не может справиться.

Шаги к полной совместимости

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

Грациозная деградация

С помощью инструментов вроде библиотеки Modernizr, можно реализовать разное представление контента в зависимости от функционала разных браузеров.

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

У IE8 есть специализированная функция – условные комментарии. Они позволяют "направить" конкретный для IE CSS или JavaScript-код этому браузеру, облегчая ему взаимодействие с современными аналогами.

Альтернативные CSS-стили

Если IE8 не поддерживает новые решения CSS3, можно применять альтернативные стили. Это позволит веб-странице выглядеть достойно, даже если браузер не в состоянии отобразить современные стилевые решения.

Полезные материалы

1. Can I use... Support tables for HTML5, CSS3, etc — Информация о совместимости IE8 с HTML5.
2. W3Schools – HTML Tutorial — Обучающий материал по HTML5, который был бы полезен для IE8.
3. Сравнение движков вёрстки (HTML5) – Википедия — Обзор поддержки HTML5 различными браузерами.
4. GitHub – aFarkas/html5shiv — Библиотека html5shiv для "обучения" IE8 HTML5.
5. Modernizr: библиотека для определения возможностей HTML5/CSS3 — Инструмент для расширения визуальных возможностей IE8.