[HTML] 시맨틱 태그

시맨틱 태그

• 의미가 있는 태그

의미가 없는 태그는 이름만 보고 무슨 내용, 역할인지 유추 할 수 없다.

의미가 있다면 태그만 보고도

브라우저, 개발자가 내용, 역할을 유추 가능하다.

 

장점

• 검색엔진 최적화(SEO)

검색엔진은 봇을 이용해 웹사이트 정보를 수집하고 검색할만한 키워드를 예상하여 인덱스를 만든다.

이러한 인덱스 생성에 사용되는 정보는 HTML코드, 그 중 시맨틱 태그들을 해석해서 구성합니다.

시맨틱 태그를 잘 썻다면 검색엔진이 의도한대로 잘 동작함

• 가독성 향상

코드를 보고 어느 부분이 어떤 역할을 하는지 한 눈에 파악이 가능

여러 사람이 작업할 때 따로 설명을 하지 않아도 파악이 가능

유지보수에 도움

 

strong

em

mark

sub

sup

header

nav

section

article

aside

footer

main

details

figure

section

time

summary

등이 이에 속합니다.