Проблемы деградации для семантических тегов HTML5 (статья, нижний колонтитул, заголовок)

Насколько хорошо ухудшаются новые теги макета в HTML5? В чем опасность их использования? (Я не говорю о <video> - я видел конкретный резервный код для него).

В частности, в случае чего-то вроде

<html>
<head></head>
<body>
<header>
<h1>Talking Dogs</h1>
<b><p>Humans aren't the only talkers!</p></b>
</header>
<article>
<p>Ever encountered a talking dog? I have.</p>
<p>It all happened one day as I was walking down the street...</p>
</article>
<footer>
© 2009 Woofer Dog Corporation
</footer>
</body>
</html>

Будет ли использование <header>, <article> или <footer> вызвать проблемы с браузером? Они автоматически деградируют до <div> в неподдерживаемых браузерах? Или, если я их включаю, должен ли я включать их только для семантического значения, а не для стилей CSS или DOM-скриптов?

Ответы

Ответ 1

Пока вы используете html5shiv для обработки IE, он будет работать нормально.

Браузер будет обрабатывать все неизвестные теги (включая теги HTML5) как обычные встроенные элементы.
Вы должны включить следующее правило CSS:

article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }

Ответ 2

Для презентации вы будете использовать CSS так или иначе, поэтому не имеет значения, понимает ли браузер сам тег.

Ответ 3

HTML 5 Тэги не поддерживаются в IE, теги по-прежнему неактивны. Чтобы активировать семантические теги HTML5 в IE, используйте script в разделе head.

<!--[if IE]>
<script type="text/javascript">
(function(){
var html5elmeents = "address|article|aside|audio|canvas|command|datalist|details|dialog|figure|figcaption|footer|header|hgroup|keygen|mark|meter|menu|nav|progress|ruby|section|time|video".split('|');
for(var i = 0; i < html5elmeents.length; i++){
document.createElement(html5elmeents[i]);
}
}
)();
</script>
<![endif]-->