티스토리 설정 (3) - Meta Tag 설정

포털 사이트에서 검색에 노출되기 위한 Meta Tag를 설정해보자

---

Meta Tag ?

메타 엘리먼트(meta element)는 웹페이지에 대한 구조적인 메타데이터를 제공하기 위한 HTML, XHTML의 <meta ...> 형태의 태그를 일컫는다. 메타 엘리먼트는 페이지 정보, 키워드와 같이 'head' 엘리먼트로 표현할 수 없는 메타정보를 기술하는데 사용된다. 메타 엘리먼트는 크게 두가지 용도로 사용될 수 있는데, HTML 문서에 추가적인 메타정보를 기술하기 위해 사용되기도 하며, HTTP 응답 헤더를 에뮬레이트하기 위해 사용되기도 한다. 위키백과

간단히 말하면 문서에 대한 정보를 담아둘 수 있는 태그다.

---

자주 쓰이는 태그 모음

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta property="og:type" content="blog">
<meta property="og:title" content="티스토리 설정 (3) - Meta Tag 설정">
<meta property="og:description" content="IT, 개발, 인터넷, java, spring, php, python, javascript 등 꿀팁을 메모하는 곳입니다.">
<meta property="og:image" content="https://tistory1.daumcdn.net/tistory/2989008/skin/images/main.png">
<meta property="og:url" content="https://jeffrey-oh.tistory.com">
<meta name="robots" content="All"/>
<meta name="robots" content="index,follow"/> 
<meta name="NaverBot" content="All"/>
<meta name="NaverBot" content="index,follow"/>
<meta name="Yeti" content="All"/>
<meta name="Yeti" content="index,follow"/>
<meta name="keywords" content="java,spring,spring boot,javascript,jquery,html,css,mysql,python,jsp,linux,php,visual studio code"/>
<meta name="Subject" content="Jeffrey Oh's Notepad"/>
<meta name="description" Content="IT 관련 내용을 메모하는 곳입니다." />
<meta name="author" content="Jeffrey Oh"/>
<meta name="writer" content="Jeffrey Oh"/>
<meta name="copyright" content="Jeffrey Oh"/>    

현재 글쓴이는 위 처럼 관리한다. 하나씩 설명에 들어가겠다.

---

viewport (필수)

viewport는 모바일에서 웹 컨텐츠가 최적의 상태로 나타나게 해준다.

---

OpenGraph (필수)

Open Graph 프로토콜은 모든 웹 페이지를 하나의 프로토콜로 만들 수 있도록 한다.

대부분의 콘텐츠는 URL로 Facebook에 공유되므로, Facebook에 콘텐츠가 표시되는 방식을 관리하기 위해 오픈 그래프 태그로 웹사이트를 마크업하는 것이 중요하다. 크롤러가 웹사이트를 올바르게 공유하려면 서버에서 gzip과 deflate 인코딩도 사용해야 한다.

이러한 오픈 그래프 태그가 없으면 Facebook 크롤러에서 내부의 경험적 접근법을 사용하여 콘텐츠의 제목, 설명, 미리 보기 이미지에 대해 가장 현실성 높은 추측을 내린다. Facebook에 게시물이 가장 최적화된 품질로 표시될 수 있도록 오픈 그래프 태그를 사용하여 이 정보를 명시적으로 지정한다.

---

robots (필수)

robots는 로봇 배제 표준(robots exclusion standard)이라 하며, 로봇 배제 프로토콜(robots exclusion protocol)은 웹 사이트에 로봇이 접근하는 것을 방지하기 위한 규약으로, 일반적으로 접근 제한에 대한 설명을 robots.txt에 기술한다.

NaverBot 과 Yeti는 로봇 중 일부이다.

---

keywords (선택)

keywords는 문서의 내용을 설명하기 위한 역할을 하며 검색엔진이 크롤링하기 어려운 경우 이를 참조한다.

---

Subject (필수)

사이트 주제

---

description (필수)

사이트 설명

---

author (선택)

저자

---

wrtier (선택)

작성자

---

copyright (선택)

저작권

---

이 외에도 많은 태그들이 있으니 나머지는 검색해보기 바란다.