[HTML] 시맨틱 태그 - 웹 페이지 구조 분리
2023. 2. 15. 08:21
개발/HTML, CSS
시맨틱 태그? 시맨틱(semantic)이라는 '의미의', '의미론적인'라는 뜻을 가진 형용사로써 의미를 부여한 태그라는 뜻이다. 페이지 골격을 만들 때 div대신 시맨틱 태그를 사용해 영역을 나누어 기본 구조를 정해준다. div와 span 대신 시맨틱 태그를 사용하는 이유? - 이름만 보고 유추하기 어려운 상황에 의미가 있는 태그로 내용을 좀 더 명확하게 만들어 관리가 편해진다. - SEO에 유리하다. 검색엔진은 태그를 기반으로 페이지 내 검색 키워드의 우선 순위를 판단한다. 따라서 제목은 h1, 중요한 단어는 strong 또는 em을 사용하는 등 의미에 맞는 태그를 사용하는 것이 중요하다. 또한 웹브라우저가 HTML만 보고도 상단(header), 본문(main), 하단(footer), 사이드(aside..