HTML 시맨틱 마크업

시맨틱 마크업

시맨틱마크업 (Semantic) 의미와 관련된 (relating to meaning)이라는 뜻입니다.

<header>, <footer>, <section> 같은 태그는 div와 똑같은 구조에 똑같은 기능을 가집니다.​

<header>의 경우에는 <div>와 같지만 페이지의 헤더를 표현한다.

<section>의 경우에는 <div>와 동일하나 이름만 다른 태그이다.

<nav>의 경우에는 navigation의 줄임말로 <div>와 비슷하지만 이름이 다르며 어떠한 기능위치인지를 명기합니다.

​

단순히 <div>를 나열하지 않고 태그 자체에 의미를 부여한다면 코드가 좀 더 명확해지겠죠?

기본적으로 수업은 <div>요소를 활용하며 진행되지만 보다 명확한 마크업을 위해서 시맨틱 구조도 알아둔다면 유용할 것입니다:)

​