heading태그란?
마크업을 할 때 글의 구조와 핵심 주제를 파악하기 좋은 태그!
▶ heading 태그 예시
<h1>제목태그(페이지의 가장 중요한 제목)</h1>
<h2>주요 소제목</2>
<h3>세부 제목 등</h3>
.
.
.
<h6>~~ 제목</h6>
h태그, 헤딩태그, 제목태그 등으로 불리는데!
heading태그는
웹페이지에서 검색엔진이 글의 구조와 핵심 주제를 파악하는 기준이기 때문에!!
seo검색엔진을 고려하는 사이트를 만드는 중이라면?
무조건!! heading태그를 사용하여 작업하는게 검색엔진에 유리 하겠죠?
그럼~ 작업자라면?!
내가 작업한 heading태그를 반영이 잘되어있는지 체크 해봐야 합니다.
그 방법은 바로 chrom에서 확장프로그램을 설치하여 확인하는 것!!
HeadingsMap 확장프로그램을 설치하고! 사용하는 방법을 알려드리겠습니다.
v
v
v
v
v
1. headingsMap 확장프로그램 설치
chorome 브라우저의 구글 검색창 headingsmap extension 검색 하거나~
아래 남겨놓은 url을 통하여 바로 이동!하여 설치하면 됩니다.
https://chromewebstore.google.com/detail/headingsmap/flbjommegcjonpdmenkdiocclhjacmbi?hl=ko&pli=1
HeadingsMap - Chrome 웹 스토어
To show, browse and audit (for accessibility and SEO) the headings structure
chromewebstore.google.com
2. headingsMap 설치완료 > extension 아이콘 및 리스트 확인가능
chrome에서 확장프로그램 설치를 마치고,
구글 브라우저를 보면~
우측 상단에 확장프로그램 아이콘을 확인 할 수 있습니다.
확장프로그램 아이콘을 설치하면~ 내가 설치한 extension리스트가 쭉 뜹니다!
그 중에 HeadingsMap 확인이 가능하다면 설치가 성공적으로 된 것 입니다.
이미지에 표시 해놓은 HeadingsMap을 클릭하면
HeadingsMap이 브라우저 좌측에 뜨는 걸 확인 할 수 있습니다.
(확장기능을 통하여 내가 작업한 heading태그가 의도한데로 되었는지 확인가능)
예시 사진 보여 드리겠습니다.
v
v
v
v
v
3. HeadingsMap 확인
구글 브라우저 좌측에서
HeadingsMap bar를 확인 할 수 있습니다.
위의 사진은 다음 사이트로~
다음에서 작업한 heading태그를 확인 할 수 있습니다.
(검색엔진 참고 url: https://www.daum.net/)
이처럼 내가 참고하고 싶은 사이트 또는
내가 작업한 사이트의 heading 태그를 확인 할 수 있습니다.
그럼 다들 heading태그를 잘 사용하여
seo 검색엔진에 유리한 사이트를 만들어 봐요.