html5에서 제목 태그는 h 태그를 사용한다. h1 부터 h6까지 6가지이며, 숫자가 커질수록 글자 크기는 작아진다. SEO 에서 제목태그는 인덱싱의 역할을 하기도 하는데 이는 중요하게 여겨지기도 한다. 그렇지만 가장 중요한 것은 사용자가 웹문서를 볼 때 상세한 내용을 보기 전에 제목을 먼저 본다는 점에서 더욱 중요하다. 제목을 보고 내용을 훓어보는 사람들이 더 많기 때문이기 때문이다.
html5 h 제목 태그 사용하기
SEO에 중요할 수도 있다.
html5에서 h 태그는 제목 태그를 뜻한다.
title 태그로도 일컬어지며 웹문서의 제목과 부제목 등을 담당한다.
웹페이지의 제목 태그로 사용되는 h 태그는 숫자와 함께 사용되는데 h1 ~ h6 까지 6가지이다.
숫자는 커질수록 제목 글자 크기는 작아진다.
h 제목태그
h 태그는 웹페이지에 중요하다.
제목으로 사용되기 떄문이다.
우리가 서점이나 신문이나 잡지를 볼 때도 먼저 보는 것이 제목이다.
그렇기에 마케팅을 잘 하는 사람들의 말을 들어보면 제목을 잘 지으라고 한다.
또한, 검색엔진은 제목 태그인 h 태그를 인식하여 인덱싱을 하기도 한다.
이는 매우 중요하다.
검색엔진에 민감한 사람들일 수록 제목에 신경쓰는 이유가 여기에 있다.
제목 태그의 이해
h 태그는 h1~h6 까지 6가지이다.
숫자가 커질수록 제목의 글자크기는 작아지며 의미가 생긴다.
h1은 대주제에 대한 제목이고 h2는 h1의 부제목이다.
h3은 h2의 부제목으로써 작용된다.
이는 SEO 가 인덱싱을 판단하는 기준이 되기도 한다.
<h1>제목 1</h1>
<h2>제목 2</h2>
<h3>제목 3</h3>
<h4>제목 4</h4>
<h5>제목 5</h5>
<h6>제목 6</h6>책의 앞부분을 보면 목차가 있다.
이런 목차를 제목태그로 생각하면 이해하기 쉽다.
샘플코드
이제 위의 코드로 h 제목 태그가 어떻게 사용되는지 html5 예제를 만들어 본다.
코드는 길어보이지만 별거 없다.
단순히 h 태그가 제목으로써 어떻게 보여지는지 살펴보도록 한다.
<!-- HTML 문서임을 정의한다. -->
<!DOCTYPE html>
<!-- html 문서 시작 -->
<html>
<!-- 문서 정보 -->
<head>
</head>
<!-- // -->
<!-- 문서 내용 -->
<body>
<!-- 제목 -->
<div>
<h1>제목 1</h1>
<h2>제목 2</h2>
<h3>제목 3</h3>
<h4>제목 4</h4>
<h5>제목 5</h5>
<h6>제목 6</h6>
</div>
</body>
<!-- // -->
</html>
<!-- // -->h 태그에 숫자가 들어간 부분만 보도록 하자.
숫자가 커질수록 글자크기는 작아진다고 했다.
추가로 다시 언급하면 h1 은 대제목, h2 는 h1의 부제목이다.
결과화면을 보자.
'programming > web' 카테고리의 다른 글
| 2번째 실시간 코드 에디터 html5 만들기 how to make code editor (0) | 2022.03.01 |
|---|---|
| 실시간 코드 에디터 만들기 1번째 준비 how to make code editor (0) | 2022.02.27 |
| html5 태그 요소의 속성 특징 html tag attributes (0) | 2022.02.24 |
| html5 태그 요소 특징 html elements (0) | 2022.02.22 |
| html5 기본 태그로 웹문서 템플릿 만들기 making html5 document (0) | 2022.02.17 |
댓글