티스토리 블로그 HTML 활용 자동링크목차 만들기

주니주라 디자인

안녕하세요. 주니주라입니다.

구글 SEO를 높이고 신뢰를 얻기 위한 자그만한 방법을 알려드릴 려고 합니다. TOC를 활용해서 목차에 링크를 걸어서 만들 수 도 있는데요. 필자는 그것 또한 너무 어려운 나머지 그냥 HTML 활용하여 내부링크를 만들어 보고자 합니다.

 

구글 검색을 치시면 대부분 상위 블로그는 목차에 링크를 걸어두는 걸 알 수 있습니다. 필자 또한 그것을 어떻게 하는지 찾아 보았는데요. 처음에는 복잡하지만 천천히 해보면 간단한 방법이라고 생각합니다.

구글에서 좋아하는 목차 같이 만들어 볼까요?

 

★목차★

문단 모양 (제목1, 2, 3)으로 이동시키는 링크 방법

문단 모양 (본문 1, 2, 3)으로 이동시키는 링크 방법

꼭 알아두어야할 것과 참고 글

 

티스토리 블로그 HTML 활용 자동링크목차 만들기 방법

독자에 입장에서 내가 보고 싶은 정보만 얻고 싶어하지 해당되지 않은 정보는 보기가 꺼려지고 스크롤바를 쭈욱 내리게 되어있습니다. 필자 또한 다른 정보를 얻고 싶어서 보는 것이 아닌 자기 자신이 무슨 정보를 보고 싶어하는지 명확하기 때문에 그 부분만 보는 적이 많습니다. 그렇기에 목차는 정말 필요한 존재라고 생각합니다.

 

 

 

예시문

위의 글을 활용해서 링크 목차를 만들어볼 예정입니다. 천천히 따라와 주시면 됩니다.

 

문단 모양 (제목 1, 2, 3) 으로 이동시키는 링크 방법

위 사진에 보시면 목차 '1. 코스모스 길' 이 보이고 밑으로 내려가면 (제목 1)로 된 '1. 코스모스 길'이 있습니다. 필자는 목차에 있는 목차 '1. 코스모스 길' 을 눌러서 (제목 1) '1. 코스모스 길' 로 바로 가게 만들껍니다. 우리가 넣어야할 링크는 아래의 박스에 있습니다.

글쓰기 HTML 에 넣어야할 내용

<a href="#ㅁㅁ">(예시)1. 코스모스 길</a> <h2 id="ㅁㅁ">(예시)1. 코스모스 길</h2>

HTML 활용

---

'ㄱ'+'ㄴ'에서  'ㄷ'+'ㄹ' 로 이동합니다. 라는 뜻입니다.

---

"ㅁㅁ" 은 여러분이 임의로 정하실 수 있습니다. 영어(대,소문자)+숫자로 쓰셔야합니다. 목차 하나당 1개를 쓰시면 됩니다. 필자 처럼 "R1" 을 쓰셔도 무방 합니다. 만약 글 하나에 여러개의 링크를 걸 경우 각자 다른 (대,소문자)+숫자를 쓰셔야합니다. (예시) "R1", "R2", "R3"....., "C1", "C2", "C3"....등등 나열해서 쓰시면 됩니다.

 

링크가 걸려진 모습

HTML에서 기본모드로 돌아올 경우 위의 사진처럼 글 자체에 링크가 걸려 있는 모습입니다. 

문단 모양 (본문 1, 2, 3) 으로 이동시키는 링크 방법

문단 모양 (본문 1, 2, 3)으로 이동시키는 링크 방법입니다. 위의 방법과 유사하므로 예시는 생략합니다.

이 링크는 본문에 더 좋은 내용들이 들어있거나 위에서 이야기 하다만 말들을 아래에서 더 다루어 줄 때 만들어 주면 더 좋을 것 같습니다.

글쓰기 HTML 에 넣어야할 내용

<a href="#ㅁㅁ"> 해당 본문내용 </a> <p id="ㅁㅁ"> 이동할 위치 본문내용 </p>

 

꼭 알아 두어야 할 것 => 강조!!

1. 위에서 말했다 싶이 "ㅁㅁ" 에 들어가는 것은 다 따로따로 해주셔야합니다.

html 활용 링크

이 글의 티스토리 블로그 HTML 목차 활용 방법입니다. 위 사진 과 같이 만들어 주시면 됩니다. <a href="ㅁㅁ">만 잘 만들어주면 다른 건 쉬우니 편하게 만드실 수 있습니다.

 

2. 글씨 모양을 다시 바꿔야합니다.

 

링크를 걸어 놓고 다시 '기본모드'로 돌아오면 여러분이 만들어놓은 폰트 모양이 다 바꿔질 수 있습니다. 그래서 다시 한번 확인을 해주시고 다시 자기자신이 원하는 모양으로 만들어 주시면 됩니다.

 

3. 링크 걸어 놓은 예시 (본글)

티스토리 블로그 두 달 솔직 운영 후기

티스토리 블로그 두 달 솔직 운영 후기

위의 게시물을 보시면 HTML을 활용해서 링크를 걸어 놓은 부분들이 있습니다. 글을 읽어보시면서 어떻게 링크 되는지도 잘 보시면 좋을 것 같습니다.

---

초보 블로거님들이 잘 찾지 못했던 부분을 알아보았습니다. 티스토리 블로그 내부링크로 인해 목차 만들기 방법을 이야기 해 보았는데요. 생각 보다 조금 복잡할 수 있어서 처음에는 유심히 보셔야합니다. 하지만 처음이라서 여러번 하다보면 금방 써 먹을 수 있는 방법이니 잘 활용하시면 좋을 것 같습니다.

구글 seo에 정말 필요한 정보라 심혈을 기울여 이야기 해 보았는데요. 너무 어려우시면 댓글을 남겨주세요. 천천히 설명 해드리겠습니다. 오늘도 좋은 하루 보내세요.

주니주라였습니다. 감사합니다.

 

참고 할 글 :

[티스토리(Tistory)] 블로그 구글 에드센스 가입 성공기

[티스토리(Tistory)] 블로그 구글 에드센스 가입 성공기

티스토리 블로그 SNS으로 방문자 수 늘리기 방법

티스토리 블로그 SNS으로 방문자 수 늘리기 방법

[티스토리 블로그] 방문자 수 늘리는 방법 1탄

[티스토리 블로그] 방문자 수 늘리는 방법 1탄