티스토리 뷰

header, section, footer 태그 쓰면 안돼

블로그 스킨을 배우다 보니 아래 이유로 header, section, footer 태그를 쓰면 안되더군요.

태그 인신 오류 때문

스킨을 바꾸느라 XHTML 코드 내에 header, nav, article, section, footer, aside 같은 태그들을 썼더니, 하위버전 익스플로러에서 제대로 안 나오고 이상하게 표시가 됩니다. 이유인즉슨 당연하게도 이런 HTML5 태그들은 익스플로러9 보다 낮은 하위버전의 익스플로러에서는 제대로 된 태그로 인식을 하지 못해서 오류가 된 것이었습니다.

하위버전에서도 잘 동작하게 하려면 당연히 이런 태그들을 안 쓰면 됩니다. 그래도 써야겠다면 HTML5 버전으로 웹페이지 제작시에 이런 태그들이 블록 요소로 인식되도록 브라우저에게 알려주는 코드가 필요하게 됩니다.

아래와 같이 자바스크립트를 넣어 주면 이제 하위 버전 익스플로러에서도 HTML5 태그를 인식하게 됩니다.

<!--[if lt IE 9]>

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

<![endif]-->

지원되는 HTML5 태그들은 article, aside, audio, canvas, details, figcaption, figure, footer, header, hgroup, mark, meter, nav, output, progress, section, summary, time, video 입니다.