[HTML]Sections/との違いは?
5356 ワード
出典:WENIV DB
<section>
通常、関連ドキュメントをパーティション化するために使用されます.
<article>
独立して分割または再使用できるパーティションを表します.
どのページも独立して使用できる場合は、
article
要素を考慮してください.<section> vs <article>
今日の授業で一番驚いたニュースです.
この間、分割時に
div
にidまたはclassが提供されたことがあり、section
、article
、header
、nav
がいずれもdiv
で代用できない場合を最後の手段とする.今後は
section
、article
をしっかり区別していきます.✏️ section vs article
section
:サイト内の関連コンテンツarticle
:独立コンテンツ<nav>
nav(네비게이션, 탐색)
は、通常、メニューに使用される.<nav>
<a href="https://www.naver.com">네이버</a>
<a href="https://www.daum.net">다음</a>
<a href="https://www.google.com">구글</a>
</nav>
<aside>
通常、サイドバーや広告分野として使用されます.内容に関係のない内容
<footer>
著者情報,著作権,関連リンクなどを含む区画要素である.
<address>
最近の親
article
またはbody
要素の連絡先情報を表します.最近の親要素がbody
の場合、ドキュメント全体の連絡先情報が表示されます.<address>
<a href="hhttps://github.com/sooyoung97">홈페이지</a>
<a href="mailto:[email protected]">메일 주소</a>
오시는 길 : 서울특별시 어디어디
</address>
+ 3/30 추가
네이버, 다음 사이트가 <div>를 남발한 이유는 뭘까?
Legacy Code(오래된 코드)이기 때문일 수 있고,
브라우저 호환성 이슈 때문일 수도 있다.(IE 지원이 종료됐으나 아직 존재)
해당 사이트들은 불특정 다수가 사용하므로 접근성 고려해야 하므로.
그렇다고 해서 <div> 남발은 금지
+ 4/4 추가
article은 작은 html이라고 생각하자!
section은 주제가 있는 컨텐츠를 묶자! heading 필수!
<footer>
address > dl > dd+dt 로 태그 가능
Reference
この問題について([HTML]Sections/との違いは?), 我々は、より多くの情報をここで見つけました https://velog.io/@sooyyyoung/html-Sectionsテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol