✨ HTML5 | 시멘틱 태그(sementic tag)

 

 

시멘틱 태그란 ? 

 

 

non-semantic elements : <div> , <span> 와 같이 태그 속 컨텐츠에 대해 아무런 정보를 갖고 있지 않음. 

semantic elements : <form>, <table>, <article>...등 컨텐츠에 대한 정보를 갖고 있음 

 

 

중요성 

html에서 시멘틱 태그가 중요한 이유 

 

- 검색엔진의 최적화(SEO: Search Engine Optimizzation)

- 정보의 정확한 전달

- 웹 접근성 

- 요지보수 용이 

 

 

일단 html의 역할은 웹 문서를 만들고 정보를 전달하는 것이다. 이 때 태그를 사용하게 되는데, 각 정보에 맞는 태그를 사용하면 웹 문서에서 원하는 정보를 찾기 쉽게 만들어준다. 

 

 

또한 검색엔진은 태그를 바탕으로 사용자가 원하는 웹페이지를 찾아 보여준다. 

<div id="h1">HTML</div>

<h1>HTML</h1>

 

 

사용자가 HTML 관련 글을 검색했을 때 div 태그를 사용한 웹 문서와 h1태그를 사용한 웹 문서 중 검색엔진은 h1을 사용한 웹 문서를 사용자에게 제공할 것이다.

div태그 안에 있는 HTML은 그저 분할된 하나의 콘텐츠일 뿐이다.  h1을 사용한 경우, h1안에 있는 HTML 글자는 가장 상위 제목이라는 의미를 가지게 된다. 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

HTML5 - 위키백과, 우리 모두의 백과사전