시맨틱 HTML: 초보자를 위한 파트 1
발행: (2026년 2월 6일 오전 11:22 GMT+9)
2 min read
원문: Dev.to
Source: Dev.to
비‑시맨틱 예시
HTML을 처음 배우는 입장에서, 빠르게 동작하지 않는 여행 앱을 만들고 싶어 본문에 다음과 같이 작성했다고 가정해 보세요:
## Traveling App
## Easier to travel than ever
Book your flight today
©2026-2027 Traveling App All Rights Reserved.이 마크업은 시맨틱하지 않으며 SEO 향상에 도움이 되지 않습니다.
시맨틱 버전 (Tailwind가 설치되어 있다고 가정)
## Traveling App
## Easier to travel than ever
Book your flight today
©2026-2027 Traveling App All Rights Reserved.이 마크업은 시맨틱하며 SEO 개선에 도움이 됩니다.
왜 시맨틱 HTML을 사용해야 할까요?
- “ – 웹 페이지의 제목과 부제목을 포함합니다.
- “ – 페이지의 주요 콘텐츠를 감싸는 역할을 합니다.
- “ – 저작권 또는 라이선스 정보를 담고 있습니다.
- “ – 시맨틱 의미가 없는 일반 컨테이너이며, 다른 요소가 맞지 않을 때만 사용합니다.
적절한 시맨틱 요소를 사용하면 검색 엔진과 보조 기술이 콘텐츠의 구조와 목적을 더 명확하게 파악할 수 있습니다.