SEO를 위한 HTML 태그 작성 - title, meta

인공지능 기술이 무섭게 등장하는 이 시대에 검색엔진 역시 똑똑해졌다.

더 이상 키워드를 중복해서 넣는 등의 상위 노출을 위한 꼼수가 통하지 않는다.

 

그래도 역시 썸네일은 중요하다.

검색엔진 크롤링이나 사용자가 썸네일을 보고 사이트에 제일 먼저 접근하기 때문이다.

 

title

title 태그에는 제목이 들어간다.

검색엔진 입장에서 가장 중요한 정보일 수 있다.

때문에 페이지의 내용을 정확히 설명할 수 있도록 적어야 한다.

 

<title>Trouble Shooter - 자바스크립트를 이용한 문제 해결 방법들</title>

 

meta

meta 태그를 이용해서 아래처럼 페이지를 설명하는 글을 작성할 수 있다.

마찬가지로 검색엔진 입장에서 중요한 정보이고

title과 함께 썸네일로 활용되거나 검색 키워드에 영향을 줄 수 있다.

 

<meta name="description" content="웹 개발에 필요한 정보들을 기록해 놓은 블로그입니다.">

 

meta 태그에서 SNS 등에 공유했을 때 표시되는 썸네일을 설정할 수도 있다.

 

<meta property="og:title" content="Trouble Shooter" />
<meta property="og:description" content="자바스크립트로 세상의 모든 문제를 해결하자!" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://..." />
<meta property="og:url" content="http://..." />

 

og:image의 content에는 썸네일로 표시될 이미지 URL을, og:url의 content에는 홈페이지 URL을 넣는다.

 

더 자세한 설정은 공식 홈페이지인 다음 사이트를 참고하자.

ogp.me