티스토리 뷰

HTML 헤딩

pilot376 2014. 7. 29. 00:42

HTML 헤딩

헤딩은 중요도에 따라서 <h1>부터 <h6>까지 정의된다. 가장 중요한 제목을 <h1>으로 정의하고, 가장 덜 중요한 제목은 <h6>으로 정의한다.

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

HTML 헤딩 태그는 오직 제목을 위해서 사용해야 한다. 글씨를 크게 만들거나 볼드 효과를 주기 위해 헤딩 태그를 사용해서는 안 된다. 검색 엔진은 당신의 웹 페이지 구조와 컨텐츠를 파악하는데 헤딩 태그를 사용한다. 또한, 사용자는 헤딩 태그를 이용하여 당신의 페이지를 훑어볼 수 있기 때문에 문서 구조를 보여줄 수 있는 헤딩 태그를 사용하는 것이 좋다.


H1 헤딩 태그는 페이지 또는 <section>의 메인 제목으로 사용한다. 뒤따라서 오는 제목은 H2 헤딩 태그를 사용하고, 그보다 덜 중요한 것들은 순서대로 H6 헤딩 태그까지 사용한다.

<body>
    <h1>Let's call it a draw(ing surface)</h1>
    <h2>Diving in</h2>
    <h2>Simple shapes</h2>
    <h2>Canvas coordinates</h2>
    <h3>Canvas coordinates diagram</h3>
    <h2>Paths</h2>
</body>

<body>
    <h1>Let's call it a draw(ing surface)</h1>
    <section>
        <h1>Diving in</h1>
    </section>
    <section>
        <h1>Simple shapes</h1>
    </section>
    <section>
        <h1>Canvas coordinates</h1>
        <section>
            <h1>Canvas coordinates diagram</h1>
        </section>
    </section>
    <section>
        <h1>Paths</h1>
    </section>
</body>


HTML 라인

<hr> 태그는 HTML 페이지에 가로줄을 생성한다. hr 엘리먼트는 성격이 다른 각각의 컨텐츠를 끊어가는 의미로 사용한다.

<p>topic A</p>
<hr>
<p>topic B</p>
<hr>
<p>topic C</p>


참조


댓글