HTML5์์ ๋์ ๋ ์๋ฏธ๋ก ์ (semantic) ํ๊ทธ๋ค์ ์น ํ์ด์ง์ ๊ฐ ๋ถ๋ถ์ด ์ด๋ค ์ญํ ์ ํ๋์ง ๋ช ํํ๊ฒ ์ ์ํ๋ฉฐ, ์น์ฌ์ดํธ์ ์ ๊ทผ์ฑ์ ๊ฐ์ ํ๊ณ , ๊ฒ์ ์์ง ์ต์ ํ(SEO)์๋ ๋์์ ์ค.
HTML5์์ ํํ ์ฌ์ฉ๋๋ ์๋ฏธ๋ก ์ ํ๊ทธ ์์
- <header>
- : ํ์ด์ง๋ ์น์ ์ ๋จธ๋ฆฌ๊ธ์ ๋ํ๋ ๋๋ค. ๋ณดํต ๋ก๊ณ , ์ ๋ชฉ, ๋ค๋น๊ฒ์ด์ ๋งํฌ ๋ฑ์ ํฌํจํฉ๋๋ค.
- <nav>
- : ๋ค๋น๊ฒ์ด์ ๋งํฌ๋ฅผ ์ํ ํ๊ทธ์ ๋๋ค. ์ฃผ ๋ฉ๋ด, ๋ชฉ์ฐจ, ์์ธ ๋ฑ์ ๋ค๋น๊ฒ์ด์ ๋งํฌ๋ฅผ ๊ฐ์ธ๋ ๋ฐ ์ฌ์ฉ๋ฉ๋๋ค.
- <article>
- : ๋ ๋ฆฝ์ ์ผ๋ก ๊ตฌ๋ถ๋๊ฑฐ๋ ์ฌ์ฌ์ฉ ๊ฐ๋ฅํ ๋ด์ฉ์ ๋ํ๋ ๋๋ค. ์๋ฅผ ๋ค์ด, ๋ธ๋ก๊ทธ ๊ธ์ด๋ ๋ด์ค ๊ธฐ์ฌ, ํฌ๋ผ ๊ฒ์๋ฌผ ๋ฑ์ด ์ด์ ํด๋นํฉ๋๋ค.
- <section>
- : ๋ฌธ์๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ ๋ฆฝ์ ์ธ ์น์ ์ ๋ํ๋ ๋๋ค. ๊ฐ ์น์ ์ ์ฃผ๋ก ํ ์ฃผ์ ์ ๋ํ ๋ด์ฉ์ ํฌํจํฉ๋๋ค.
- <aside>
- : ๋ณธ๋ฌธ๊ณผ ๊ฐ์ ์ ์ผ๋ก ๊ด๋ จ๋ ๋ด์ฉ์ ์ํ ํ๊ทธ์ ๋๋ค. ์ฌ์ด๋๋ฐ, ๊ด๊ณ , ์ฌ์ด๋ ๋ฉ๋ด ๋ฑ์ ๋ํ๋ด๋ ๋ฐ ์ฌ์ฉ๋ฉ๋๋ค.
- <footer>
- : ํ์ด์ง๋ ์น์ ์ ๋ฐ๋ฅ๊ธ์ ๋ํ๋ ๋๋ค. ์ ์๊ถ ์ ๋ณด, ์ฐ๋ฝ์ฒ ์ ๋ณด, ๋ฐฑ ๋งํฌ ๋ฑ์ ํฌํจํ ์ ์์ต๋๋ค.
- <figure> ๋ฐ <figcaption>
- : ์ด๋ฏธ์ง, ๋ํ, ์ฝ๋ ๋ชฉ๋ก ๋ฑ์ ์์ฒด์ ์ธ ์ปจํ ์ธ ๋ฅผ <figure>๋ก ๊ฐ์ธ๊ณ , ํด๋น ์ปจํ ์ธ ์ ๋ํ ์ค๋ช ์ <figcaption>์ผ๋ก ์ ๊ณตํฉ๋๋ค.
- <main>
- : ์น ํ์ด์ง์ ์ฃผ์ ์ฝํ ์ธ ๋ฅผ ๋ํ๋ ๋๋ค. ํ ๋ฌธ์์ ํ๋์ <main> ํ๊ทธ๋ง ์์ด์ผ ํฉ๋๋ค.
'๐ฅ๏ธ ํ๋ก ํธ์๋ > HTML&CSS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[๋ถํธ์คํธ๋ฉ] ํ๋ฉด ์ฝ๊ฒ ๊พธ๋ฏธ๊ธฐ (0) | 2024.01.05 |
---|---|
[CSS] ํฐ์คํ ๋ฆฌ์์ ์ปค์ ๊น๋นก์ ์์ ๊ธฐ (0) | 2023.12.09 |
[๋ถํธ์คํธ๋ฉ] ์บ๋ฌ์ ์ ์ฉ, ์คํ์ผ ๋ฎ๊ธฐ, rem ๋จ์, (0) | 2023.11.22 |
<div> ํ๊ทธ์ <section> ํ๊ทธ (2) | 2023.11.22 |