본문 바로가기
카테고리 없음

티스토리 h태그 헷갈리시는 분, 이거 보시면 해결 보장

by 이아리 2023. 2. 19.

 

 

티스토리를 시작하는 분들이라면 h태그에 대해 한번쯤은 들어보셨을 텐데요. html에 익숙하지 않은 분들은 충분히 헷갈리실 수 있습니다. 쉽게 이해하실 수 있도록 설명해 드릴게요. 다른 건 몰라도 h태그는 기본으로 지켜주셔야 합니다.

 

목차

     

     

    1. 티스토리 h태그란?

    h태그의 h는 'head'를 말합니다. 머리가 되는 문장, 즉 '제목'을 의미하는데요. 제가 쓴 다른 포스팅을 보면 아래와 같이 본문글 위에 나오는 굵고 큰 글씨의 제목을 볼 수 있죠.

     

    티스토리-블로그-본문-일부-캡쳐
    티스토리 h태그의 예시

     

    (참고로 위의 사진 속 자주색 css 코드를 수정해서 적용할 수 있는데 일단 이부분은 나중에 소개할게요. 오늘은 h태그에 대해서만 집중하기로 해요.) 사진으로 보면 크기의 차이가 잘 안보일 수 있을 것 같습니다. 실제 위의 사진에서 첫 번째 제목 (2. 내일 배움 카드 신청방법)은 제목 1을 적용, 그 아래는 제목 2를 적용한 건데요.

     

     

    2. h태그를 써야 하는 이유

    구글 SEO에 대해 들어보셨나요? 구글SEO 중 'SEO'란 검색엔진최적화(Search Engine Optimization)의 앞글자를 딴 약자로 '구글 SEO'는 곧 구글 검색 엔진 최적화를 말합니다. 뜻을 알지는 못하더라도, 이 구글 SEO를 만족하는 글을 써야 구글 검색 상위 노출에 유리하다는 것은 기억해야 합니다. 여기에 우리가 h태그를 써야 하는 이유가 있기 때문입니다.

     

    구글의 SEO는 정말 여러 가지가 있지만, 아주아주 기본 중의 하나가 "구글은 구조화된 글을 좋아한다."는 겁니다. 구조화란 무엇이냐, 쉽게 말해 '짜임새 있는 글'을 좋아한다는 뜻이에요. 한 페이지 가득, 이렇게 보통 사이즈의 본문용 글자만 가득한 글보다는 지금 보고 계신 이 글처럼 몇 가지 소제목을 가지고 문단을 나누어 쓰는 글에 높은 점수를 준다는 것이죠. 이건 정말 기본 중의 기본이라, 지키지 않는다면 구조화 면에서 다른 사람들의 포스팅에 비해 마이너스가 되겠죠?

     

     

     

    3. h태그 사용법

    h태그를 사용해야 하는 이유에 대해 알아봤으니 본격적으로 태그 사용법을 알아볼게요. 티스토리 글쓰기 화면 위에 있는 메뉴들을 보면 이렇게 제목 1,2,3 또는 본문 1,2,3을 선택할 수 있습니다. 아래 사진처럼요.

     

    티스토리-본문-에디터중-제목종류-선택메뉴
    티스토리 본문 에디터 메뉴

     

    그런데 사진에서 뭔가 이상한 부분을 찾으셨나요? 이것 때문에 많은 분들이 h태그를 헷갈려하시는 건데요. 

     

    (1) h태그 헷갈리는 이유

    사실 h태그의 사용법은 어려울 것이 없습니다. 위의 사진에서 보시는 것처럼 순서에 맞게 제목 1, 제목 2, 제목 3을 선택만 해주면 되니까요. 그런데 제목 1이 h1이 아니라 h2라서 헷갈려하시는 분들이 많습니다. 왜 제목1이 h1이 아니라 h2일까요?

     

    블로그의-html코드-1줄
    h태그 예시, 제목1 = h2

     

    해당 포스팅의 진짜 제목이 h1로 정해져 있기 때문입니다. 그리고 포스팅의 제목은 두 개가 될 수 없듯, h1코드는 포스팅 당 딱 한 번만 쓰여야 합니다. 이 또한 외울 필요가 없습니다. h1이니 h2니 생각할 필요 없이 그냥 티스토리 본문을 작성할 때 메뉴를 이용하여 제목 1, 제목 2, 제목 3을 순서대로 사용 해 주기만 하면 됩니다.

     

    (2) 제목1, 제목2, 제목3 사용순서

    여기서 티스토리 초보자들은 또 헷갈릴 수 있습니다.첫 번째 제목은 제목 1이고 두 번째 제목은 제목 2인가? 아닙니다. 보통 제목 아래 소제목, 그 아래 또 소제목이 생기는 장문의 포스팅이 아니라면 그냥 제목 1만 여러 번 사용하셔도 돼요. 제목 1을 사용했는데, 그 아래 세부적인 내용의 제목 2를 사용할 수도 있습니다.

     

    조금 헷갈리시죠? 아래 예시처럼 사용해 보세요.

     

     

    ▶ 티스토리 h태그 사용방법 예시

     

    노란바탕에-빨간색글씨로-제목태그와-본문테그를-쓴-예시노란바탕에-빨간색과-파란글씨로-제목태그를-검정글씨로는-본문테그를-쓴-예시
    티스토리 h태그 사용법 예시

     

    어떤가요? 예시로 보니 확실하게 아시겠죠?

     

    3. h태그 사용의 주의점

    사실 티스토리 h태그 사용법은 깊게 생각해서 사용할 건 아닙니다. 그런데 한 가지 유의할 부분은 있어요. 티스토리의 스킨 종류에 따라 제목 1, 제목 2가 h2인지 h3인지 다를 수 있어요. 지금 보고 계신 제 티스토리 블로그는 가장 널리 쓰이는 '북클럽' 스킨이고요. 위의 모든 내용은 북클럽을 기준으로 작성되었습니다.

     

    그리고 만약 티스토리가 아닌 워드프레스 같은 별도 사이트를 만들어 운영한다면 그때는 h1, h2, h3 태그를 구분해서 사용할 줄 알아야겠죠?

     

    하나만 기억하세요.

     

    하나. 포스팅 제목이 h1이다.
    하나. h1은 포스팅에서 한 번만 쓰여야 한다.
    하나. 본문 안의 소제목은 h2부터 사용한다.

     

     

    이것이 h태그의 모든 것입니다.

     

    쉽게 설명해본다고 했는데 어떠셨는지 모르겠습니다. 티스토리 h태그에 대해 들어봤는데 헷갈리셨던 분들께 도움이 되었기를 바랍니다.

     

     

     

    ▶ 티스토리 애드센스 도움 되는 글

     

    티스토리 애드센스 계좌 추천 신한은행 : 등록방법부터 SWIFT 식별코드까지

     

    티스토리 애드센스 계좌 추천 신한은행 : 등록방법부터 SWIFT 식별코드까지

    티스토리 애드센스 100달러 달성을 축하합니다. 그래서 티스토리 애드센스 계좌 추천 정보를 찾고 계신거죠? 수수료면에서 유리한 신한은행 외화통장 추천부터 구글 애드센스 신한계좌 등록 방

    justdooooit.tistory.com

    애드센스 수익 달러 입금 수수료 1/5로 아끼는 2가지 방법

     

    애드센스 수익 달러 입금 수수료 1/5로 아끼는 2가지 방법

    드디어 첫 애드센스 수익금이 입금되었습니다. 저는 여러 은행 중 이미 외환통장을 가지고 있던 신한은행을 선택했는데요. 외화를 송금받을때 수수료를 내야한다는 것 알고 계셨나요? 보통 1만

    justdooooit.tistory.com

    네이버 블로그 vs 티스토리 수익비교 (네이버 500명대, 티스토리 300명대)

     

    네이버 블로그 vs 티스토리 수익비교 (네이버 500명대, 티스토리 300명대)

    네이버 블로그 애드포스트와 티스토리 애드센스 두개를 모두 운영하고 있습니다. 다음 저품질을 맞아 손을 놓으려던 티스토리 블로그에서 수익이 발생하는 것을 보고 다시 잘 해봐야겠다는 생

    justdooooit.tistory.com

     

    반응형

    댓글