그리고 사용자의 질문에 답하면서 HTML5 마크업이 있는 웹사이트를 많이 보았습니다. 이 기사에서는 내가 많이 접했던 마크업 오류와 나쁜 관행을 보여주고 이를 피하는 방법을 설명합니다.
태그를 사용하지 마세요. 장식용 포장지로
내가 알아차린 가장 일반적인 문제 중 하나는 진부한 대체 "ov HTML5 구조적 요소, 특히 ". 즉, XHTML 또는 HTML4의 내용이 다음과 같을 때:
다음과 같이 다시 작성했습니다.
이것은 잘못된 것입니다.랩이 아닙니다. 이 요소는 "문서 개요"를 작성하는 데 사용되는 콘텐츠의 의미 블록을 의미하며 제목을 포함해야 합니다. 둘러쌀 요소가 필요한 경우 다음을 시도하십시오. (Kroc Camen은 제공할 것이 있습니다). 추가 래퍼가 필요한 문제가 해결되지 않으면 좋은 오래된
나의 슈퍼 듀퍼 페이지
이것은 잘못된 것입니다.
". HTML5의 도래와 함께
"당신은 죽지 않았고 그들은 이 경우에 완벽합니다.
사용
필요하지 않다면 코드를 작성해도 소용이 없겠죠? 아아, 나는 종종 어떻게 그리고 필요하지 않은 곳. 요소에 대해 읽을 수 있습니다. 그리고 더 자세히, 나는 간략하게 핵심 사항을 요약할 것입니다: 초과 요소
요소가 문서에서 여러 번 사용할 수 있습니다. 따라서 다음과 같은 경우가 많습니다.
, 만약에:
위의 예를 다음과 같이 HTML5를 사용하여 마크업하는 것이 좋습니다.
나의 슈퍼 듀퍼 페이지
어떤 요소를 사용해야 할지 잘 모르겠다면 요소 선택 순서도( 약 번역기: 항목 맨 아래 참조).
사용 그리고 필요할 때만
필요하지 않다면 코드를 작성해도 소용이 없겠죠? 아아, 나는 종종 어떻게 - 요소
소개 또는 탐색 보조 도구 그룹을 나타내며 일반적으로 섹션 제목을 포함합니다. - 요소 요소 집합을 그룹화합니다.
-
, 여러 수준(소제목, 대체 제목 등)으로 구성된 경우 섹션 제목을 나타냅니다.
초과 요소
요소가 내 최고의 블로그 게시물
만약 당신의
내 최고의 블로그 게시물
오용
그리고 다시 헤더에 대해: 나는 종종 요소의 잘못된 사용을 봅니다. . 사용해서는 안 된다 함께- 헤더가 하나뿐입니다.
- 그 자체로 좋은(즉,
).
내 최고의 블로그 게시물
리치 클라크
이 경우 hgroup을 제거하면 됩니다. 리치 클라크
내 최고의 블로그 게시물
두 번째 경우는 불필요하게 요소를 사용하는 또 다른 예입니다.
내 회사
1893년 설립
외동아이라면
내 회사
1893년 설립