Semantic Web??

의미론적인 웹이다. 인간이 이해하는 언어를 기계가 쉽게 이해하여, 새로운 정보를 만들어 낼 수 있도록 쉬운 의미를 가진 지능형 웹이다.
또한 정보를 분석하여 그 정보의 관계 속에서 의미론적인 자료를 추출하여 보여주는 웹이다.

예를 주변 맛집을 검색하면 맛집 위치, 가격정보 등을 알려주는 것이다.

semantic Tag??

시맨틱 태그는 브라우저, 검색엔진, 개발자 모두에게 콘텐츠의 의미를 명확히 설명하는 역할을 한다.

div 태그는 non-semantic tag라고 볼 수 있고,
table, article tag 는 semantic tag로 볼 수 있다.
일반적으로 div태그만 보고는 이 태그 안에 들어간 내용의 의미를 알 수 없지만, table, article 태그는 대략 태그만 보고도 태그 안에 들어갈 내용을 예상할 수 있다.
table은 표가 들어갈 것이고, article은 글이 들어갈 것이라고?

물론 div에 클래스명이나 id를 주어서 개발자 임의로 정의해서 사용할 수 있다.
하지만 HTML5에서는 시멘틱 태그를 제공하여 의미를 명확하게 할 수 있다.
시멘틱 태그를 사용하여 코드의 가독성을 높이고, 의미를 명확하게 나누어 유지 및 보수도 수월해진다는 장점이 있다.

프론트엔드 개발자에게 있어서 마크업 구조를 시멘틱하게 짜는 것은 매우 중요한 요소가 되었다.

HTML5에서 새로 제공하는 대표적인 시맨틱 태그들

• article
• aside
• details
• figcaption
• figure
• footer
• header
• main
• mark
• nav
• section