offfff

HTML 제목(HTML Heading) 본문

프로그래밍

HTML 제목(HTML Heading)

offfff 2016. 8. 24. 09:00

HTML 제목(HTML Headings)


제목(Heading)은 <h1> ~ <h6> 태그로 정의된다.

<h1>이 가장 큰 크기의 제목이고, <h6>가 가장 작은 크기의 제목이다.

실행해 보면, 헤딩과 다음 헤딩사이에 자동적으로 공백이 생기는 것을 알 수 있다.


<!DOCTYPE html>

<html>

<body>


<h1>제일 큰 제목</h1>

<h2>그다음 큰 제목</h2>

<h3>그다음 큰 제목</h3>

<h4>그다음 큰 제목</h4>

<h5>그다음 큰 제목</h5>

<h6>제일 작은 제목</h6>


</body>

</html>




제목이 중요하다(Headings Are Important)


검색엔진은 웹 페이지의 내용과 구조를 목록화 할 때 제목(heading)을 사용한다.

유저는 제목(heading)을 가지고 자신이 찾는 정보를 고른다.

그래서 문서의 구조를 보여줄 때 제목(heading)이 중요하다.

<h1>을 메인 제목으로 사용하고, 덜 중요할 수록 태그의 숫자를 늘려가면 된다.

그러므로 <h1>태그는 텍스트를 크거나 굵게 보이게 하고 싶을때 사용하지 않는다.




HTML 수평선(HTML Horizontal Rules)


<hr>태그는 HTML 페이지에서 주제별로 구분선을 만드는데 사용하는 태그이다.


<!DOCTYPE html>

<html>

<body>


<h1>제목1</h1>

<p>내용1 내용 내용 내용입니다.</p>

<hr>


<h2>제목2</h2>

<p>내용2 내용 내용 내용입니다.</p>

<hr>


<h2>제목3</h2>

<p>내용3 내용 내용 내용입니다.</p>


</body>

</html>




The HTML <head> Element


<head>태그는 <h1>태그와 아무 관련이 없는 태그이다.

<head>태그는 메타데이터를 저장하는 요소로, 메타데이터는 HTML 문서 정보를 말하며 화면에 표시되지 않는다.

<head>태그는 <html>태그와 <body>태그 사이에 위치한다.

메타데이터로는 보통, 문서의 제목, 케릭터 셋, 스타일, 링크, 스크립트 등의 정보가 있다.


<!DOCTYPE html>

<html>


<head>

<title>My First HTML</title>

<meta charset="UTF-8">

</head>


<body>

.....

</body>

</html>




HTML 소스를 보는 방법(HTML Tip - How to View HTML Source)


어떤 웹 페이지가 어떤 HTML 소스로 되어있는가 궁금할 때,

페이지에서 우클릭을 하고 "소스 보기(IE)", "페이지 소스보기(Chrome)"을 클릭한다.

그러면 새로운 창이 열리면서 해당 페이지의 HTML 코드를 볼 수 있다.




아래 링크를 번역 및 수정 함

http://www.w3schools.com/html/html_headings.asp

저작자표시 비영리

'프로그래밍' 카테고리의 다른 글

HTML 스타일(HTML Styles)  (0) 2016.08.26
HTML 문단(HTML Paragraphs)  (0) 2016.08.25
HTML 속성(HTML Attributes)  (0) 2016.08.23
HTML 요소(HTML Elements)  (0) 2016.08.22
HTML 기본 예제  (0) 2016.08.21
'프로그래밍' Related Articles more