Semantic Web(div / article / section)

<div></div>

division(분할, 구분)의 약자로 

구역을 나누는 block 요소다.

(막 쓰기 좋다.)

 

<article></article>

문서, 기사라는 단어 뜻처럼 컨텐츠 구역을 의미하며

주로 독립성(단독 재사용 가능) 있는 컨텐츠에 사용된다.

 

<section></section>

제목 요소(h1, h2 등)를 포함하고 있으며

컨텐츠 등의 집합을 포함할 때 사용된다.

 

semantic web

사실 3가지 모두 퉁쳐서 <div>로 작성해도 

눈에 보이는 차이는 없다.

(기기마다 차이가 있으려나...?)

 

html은 semantic(의미론)하게 작성해야 한다는 말을 들은 적이 있다.

더 공부하다보니 알게 된 위 문장의 의미는  

개발자와 검색엔진 등을 위해 각 요소들을 의미에 맞게 사용해야 한다는 것이다.

 

사실 보이는 내용만 생각하면 <div>, <p>, <span>만으로

대부분의 text 관련 html을 작성할 수 있을지 모른다.

 

하지만 각 text의 내용과 성질에 따라 각기 다른 tag를 사용하는 것은

이를 유지보수하는 개발자에게 작성한 html을 더 확실하게 이해할 수 있게하고

html code만으로 검색 인덱스를 만드는 검색엔진에게 좀 더 정확한 index를 만들 수 있게한다.

 

또 의미별로 쓰다보면 html 페이지의 구조와 의미에 대해서도 더 생각하게 하여

글을 쓰는 것처럼 더 재밌게 coding할 수도 있을 것 같다.

(복잡해지면 발목을 잡으려나...)