Tistory(Adsense) / / 2022. 5. 7.

티스토리 목차 만들기. SEO 도움 되는 내부 링크 만드는 방법

반응형

글의 가독성과 이해를 높이는 목차는 독자에게도 좋고 SEO(검색최적화)에도 좋습니다. 티스토리에서는 HTML을 통한 내부 링크로 간단하게 목차를 만들 수 있습니다. <a href="#1"> 1. 내용 </a><br> 코드를 이용하면 됩니다.

 

목차

     

     

     

     

     

    1. 목차의 방법과 내용을 작성합니다.

    지금 이 글을 기준으로 작성해보겠습니다. 아래와 같이 이 글의 기본이 되는 목차를 작성합니다. 목차는 개인적으로 숫자로 구분하는 것이 가장 깔끔하다고 생각합니다. 글이 길다면 1-1, 1-2, 2-1, 2-2처럼 구분하는 것이 보기 좋습니다.

     

    목차만들기-순서
    목차만들기-순서

     

     

    2. HTML모드로 들어가서 목차의 내용을 편집합니다.

    목차-코드
    목차-코드

     

    HTML모드로 들어가서 위의 목차를 적었던 곳으로 갑니다. HTML 모드에는 위와 같이 표현이 되어있네요. 내부 링크를 작성하는 코드는 아래와 같습니다. 아래의 코드를 작성한 목차에 적용해 줍니다.

     

    <a href="#1"> 1. 내용 </a>
    <a href="#2"> 2. 내용 </a>

     

    적용 후의 HTML은 다음과 같습니다.

     

    목차-코드-작성후
    목차-코드-작성후

     

     

     

     

    3. 목차(내부 링크)로 이동하고자 하는 곳에 도착점을 표시합니다.

    내부 링크로 이동하고자 하는 곳의 코드는 다음과 같습니다.

     

    <id="1">
    <id="2">
    <id="3">

     

    적용 후의 HTML은 다음과 같습니다.

     

    도착점-코드
    도착점-코드

     

    목차를 클릭하였을 때 이동할 곳마다 위와 같이 설정을 하면 티스토리 목차 만들기가 완성됩니다.


    티스토리-목차-만들기-썸네일
    티스토리-목차-만들기-썸네일

     

     

    지금 예시의 결과물은 지금 보고 계신 이 포스팅이 되겠네요. 익숙해지면 간단하게 만들 수 있습니다. 긴 글을 작성하실 때는 특히 유용하니 적절하게 사용하시면 여러모로 블로그에 도움이 되겠습니다. 오늘의 포스팅이 유익하셨길 바랍니다. 감사합니다.

     

     

     

    반응형
    loading