본문 바로가기
마녀위키/Development

[ SEO태그설정] 메타태그를 잘 설정 해야되는 이유

by 짠슬 2021. 7. 1.
반응형

회사 홈페이지에 있는 포스팅을 페이스북 페이지에 공유하기 위해 URL을 붙여넣기 했는데 포스팅 썸네일과 제목이 아닌 회사명과 로고이미지만 미리보기로 제공되어서 개발자에게 "네이버 블로그나 티스토리처럼 미리보기로 포스팅 내용이 나오게 하려면 어떻게 해야될까요?"라고 물어보니 포스팅페이지에 메타태그 수정이 필요하다고 했다. 그리고 알게 된 것들


meta 태그는 웹 서버와 웹 브라우저간에 상호 교환되는 정보를 정의하는데 사용한다.


페이스북은 게시물 작성 또는 공유할 때 페이지에 URL을 붙여넣기 하면 아래와 같이 이미지,링크,제목,본문글을 미리보기로 보여준다. 뉴스피드에서 게시물 미리보기를 통해 유저들은 링크를 클릭 할지 안할지 결정하게된다. 메타데이터를 각 페이지별로 설정하지 않고 공통값으로만 설정해놓으면 아무리 포스팅 URL을 붙여넣기해도 홈페이지 제목과 로고 이미지만 보일뿐 포스팅에 대한 내용을 미리보기로 제공할 수 없다. 이러한 게시물은 유저들에게 흥미를 유발하지 못하고 그대로 묻혀버릴 것이다.

 

내가 타사이트에 작성해놓은 포스팅을 페이스북에 공유하기 위해 URL을 붙여넣으면 페이스북 robot은 메타데이터를 수집 해 온다. 그래서 내 사이트에 접근하는 robot에게 올바른 데이터를 제공하는 것이 중요하며 title(제목), image(대표이미지), description(설명글)등 각 페이지에 맞는 meta 태그를 설정해주는 것이 가장 좋다.

 

 


<head>

<meta property-"og:type" content="article">
<meta property-"og:title" content="조나 버거(Jonah Berger)의 컨테이저스, 보이지 않는 영향력">
<meta property-"og:site_name" content="마녀위키">
<meta property-"og:url" content="https://kimss0317.tistory.com/6">
<meta property-"og:image" content="https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Fcfile%2Ftistory%2F992137345BECE2CF29">
<meta property-"og:description" content="입소문 마케팅 및 바이럴(Viral) 마케팅의 세계적인 권위자, 와튼 스쿨의 조나 버거(Jonah Berger) 교수  소셜마케팅 6가지 핵심 법칙 Social currency (소셜 화폐의 법칙) 사람들은 타인에게 좋은 인상을 남기는..">

</head>

 

이러한 메타데이터는 캐시와도 관계가 있다. 우리가 처음으로 페이스북에 링크를 붙여넣기 했을 땐 짧은 로딩이 발생된다. 이는 페이스북 robot이 웹 사이트에서 데이터를 긁어오는데 걸리는 시간이다. 하지만 데이터정보, 즉 캐시가 존재하고 똑같은 링크를 다시 붙여넣기 했을땐 로딩없이 빠르게 정보를 제공받을 수 있다. 그래서 캐시청소를 하면 인터넷이 새롭게 데이터를 받아오느라 로딩이 길어지고 인터넷이 느려진 기분이 드는것이었다.

 

 

반응형