• 다크모드 ↔ 라이트모드 변경 방법 일주일 동안 열지 않기

블로그/웹사이트

홈페이지, 블로그 꾸미기 팁 정보 게시판입니다.
  • 목록
  • 아래로
  • 위로
  • 댓글 0개
  • 검색
  • 라이트모드

검색 엔진 최적화 (SEO) 01- Meta 태그와 SEO 친화적 글쓰기

이윰
9 1 0

검색 엔진 상위 노출 → 방문자 증가로 이어지는 건 누구나 아는 사실이지만, 어떻게 검색 엔진에 내 글을 상위 노출시킬지 정말 막막하죠. 저도 사이트 운영을 본격적으로 시작한 지 얼마 되지 않아서 이 부분에 관심을 갖고 조금씩 적용을 해 나가고 있는데요. 이 글은 노하우라기 보다, 제가 적용한 것들을 정리한 것이라고 보시면 될 것 같습니다.
이 글에서는 우선 Mete 태그와 SEO에 친화적인 글쓰기에 대해서만 이야기하도록 할게요!

 

# Meta 태그란 무엇인가?

meta 태그는 HTML 태그로 meta 태그가 포함된 그 문서의 정보를 담은 태그입니다. 핵심 키워드와 문서의 내용, 언어 설정 등의 정보를 담고 있습니다.
<head></head> 사이에 넣어 줘야 하고 형태는 다음과 같습니다.

 

예시 ) 유튜브의 메타 태그 중 키워드와 사이트 설명의 메타 태그

<meta name="description" content="YouTube에서 마음에 드는 동영상과 음악을 감상하고, 직접 만든 콘텐츠를 업로드하여 친구, 가족뿐 아니라 전 세계 사람들과 콘텐츠를 공유할 수 있습니다.">
<meta name="keywords" content="동영상, 공유, 카메라폰, 동영상폰, 무료, 올리기">

검색 로봇이 수집하여 검색 엔진에 노출이 될 수 있도록 정보를 전달하는 역할만 하고, 다른 HTML 태그처럼 문서에 출력되지는 않습니다. 검색 엔진 최적화 요소에는 수백 가지가 있다고 하는데, 메타 태그 설정은 그중에 가장 중요한 요소입니다.

 

# Meta 태그 적용 시 알아두면 좋은 것

title : 대부분의 검색 엔진은 meta title을 70자로 자르기 때문에 70자 이내로 작성합니다.
description : 대부분의 검색 엔진은 meta description을 160자로 자르기 때문에 160자 이내로 작성합니다.
keywords : 웹페이지의 주제를 식별할 수 있도록 콘텐츠에 자주 등장하는 키워드를 작성합니다. 또 문법적으로 어긋나지 않는 키워드를 작성하는 것이 좋다고 합니다.

 

그밖에 viewport , 렌더링 모드 등의 속성이 있는데 대부분의 블로그 스킨에 이미 적용되어 있고, 직접 작성을 해줘야 할 부분은 title, description, keywords정도입니다.
title, description은 티스토리 블로그 설정에서 블로그 이름, 블로그 설명을 작성하면 적용됩니다. 

기본 keywords는 티스토리가 제공하는 메타 태그 플러그인을 이용하여 적용할 수 있습니다. 방법은 다음과 같습니다.

meta-tag-1-min.png티스토리 > 블로그 관리 > 플러그인에서 메타 태그 플러그인을 클릭합니다.

meta-tag-2-min.png메타 태그 추가를 누르고 아래와 같이 작성하고 적용! (맛집, 음식, 리뷰 키워드를 운영 중인 블로그에 맞게 수정하세요!)

 

name

keywords

<meta name="keywords" content="맛집, 음식, 리뷰">

# SEO 친화적인 글쓰기

1) <h1> 태그 사용하기- 페이지의 중요한 주제를 <h1>를 사용하여 작성하면 검색 엔진이 페이지 주제를 정의하는 데 도움을 줄 수 있습니다.
2) 링크 생성 시 URL 주소에 (_ ) 대신 (-) 을 사용합니다.
3) 인라인 스타일의 추가를 자제합니다.
- 예를 들어 에디터의 색상툴을 이용해 글꼴에 색상을 적용하면 html 문서에서는
<span style="color:ff5656;">내용</span>으로 작성됩니다. 코드의 비율이 높아지고 텍스트로만 작성했을때 보다 페이지의 용량도 늘어나게 되죠.. 페이지의 속도 또한 검색 엔진 최적화의 한 요소이기 때문에 가급적 인라인 스타일 속성을 제거하고 CSS 파일을 이용하여 스타일을 적용해 줍시다.

4) 링크에 앵커 텍스트 사용하기
 

예시 )

<a href="https://naver.com/">네이버</a>

 

# 그 밖에...

1) 커뮤니티 사이트라면 소셜미디어 로그인 기능을 적용합니다.
2) Google Analytics 잠재적인 SEO 문제를 진단하기 위해 Google Analytics를 적용합니다. 블로그나 사이트 운영을 하고 있다면 필수이니 적용이 안 되어 있다면 적용해 줍시다.
* 티스토리에서는 블로그 관리 > 플러그인 > 구글 애널리틱스 플러그인을 이용하여 쉽게 적용할 수 있습니다.

 

마치며

meta-tag-min.png

사실 사이트 디자인 꾸미는거에만 관심을 쏟고 있었고 SEO의 중요성을 알지 못했어요. 위 이미지처럼 구글에서 검색되어지고 싶어서 알아 가다보니 엄청 많은 복합적 요소들에 의해 검색 상위에 올라 갈 수 있는 것이더라고요.

천천히 알아 가는 중인데 오늘은 검색 엔진 최적화를 하기 위해 가장 기본적으로 해야 할 것들에 대해 적어보았습니다. 이후 다른 요소들을 점검하면서 글을 이어나가 볼게요!

끝!

신고공유스크랩

댓글 0

댓글 쓰기
권한이 없습니다. 로그인

신고

"님의 댓글"

이 댓글을 신고하시겠습니까?

댓글 삭제

"님의 댓글"

이 댓글을 삭제하시겠습니까?

공유

퍼머링크
제목 최종 글 조회 수
+1
image
  10
+1
normal
  11
+1
image
  9
+1
image
  13
0
normal
  11
0
normal
  24
+1
normal
이윰13시간 전 40
+1
normal
  11
+1
normal
  13
+1
image
  12
+1
normal
  20
+1
normal
  19
+1
normal
  15
+2
image
  49
0
normal
  34
+2
image
  16
+1
normal
  13
+1
normal
  11
+1
image
  45
+2
image
  26