HTML5의 Sectioning content(nav, article, section, aside)에 대해 MDN을 참고하여 작성한 글입니다.
<nav>
<nav>
안에 <nav>
를 중첩하여 사용할 수는 없다.<article>
<article>
안에 <article>
이 중첩하여 사용해 바깥쪽 요소와 관련된 콘텐츠임을 나타낼 수 있다.<article>
안에 <section>
이 포함될 수 있으며, <section>
안에 <article>
이 포함될 수도 있다. <section>
<main>
으로, 신문 기사라면 <article>
로 나타낼 수 있을 것이다.)<section>
안의 콘텐츠는 서로 의미적으로 연관이 있어야 하는데, 만약 서로 연관이 없으며 오로지 스타일링을 위해 그룹화해야한다면 <div>
를 사용하는 것이 낫다.<section>
이 구분되도록 해야 한다.<aside>
메인 요소와 관련은 있지만, 직접적으로 연관된 것은 아닌 사이드바, 인용문 등의 영역을 나타낸다.
<aside>
안에 <aside>
를 포함할 수는 없다.
<body>
<header>
<article>
이나 <section>
등 다른 요소 안에도 사용되는데, 이 경우 섹션의 제목, 작가이름 등이 포함될 수 있다.<footer>
<main>
<article>
, <aside>
, <header>
, <footer>
, <nav>
안에 포함시킬 수 없다.