[HTML] ⑤ SEO(Search Engine Optimization): 검색엔진최적화
▶SEO(Search Engine Optimization) : 검색 엔진 최적화
많은 사람이 이용하길 바라는 서비스를 만들었다면 네이버나 구글 같은 검색 엔진의 상위에 노출시키고 싶을 것입니다.
하지만 이미 시장에는 수많은 경쟁 서비스가 있어 그중에서 검색 결과의 상단에 나오게 하는 것은 매우 어려운 일입니다.
검색 사이트에 상단에 노출시키는 것은 개발의 영역이 아닌 서비스의 인기, 마케팅과 광고의 영역이라 생각할 수 있습니다.
일부는 맞지만, 일부는 아닙니다.
개발자의 몇 가지 노력으로 서비스가 적절한 키워드에 더 많이 노출되도록 할 수 있습니다.
이렇게 우리의 사이트를 찾기 쉽도록 개선하는 여러 노력을 검색 엔진 최적화(SEO, Search Engine Optimization)라고 부릅니다.
구글과 네이버 같은 각각의 검색 사이트는 선호하는 키워드 추출 방식, 검색 메커니즘이 있습니다.
이번 글에서는 각각의 사이트에 적합한 방법보다는 일반적으로 적용하는, 요즘 사이트 개발에서 필수로 적용하는 방법을 살펴보겠습니다 :)
▶시맨틱하게 HTML을 작성하자
이전 글 시맨틱(Semantic)에서 간단히 언급했듯이, 시맨틱하게 코드를 작성함으로써 검색 엔진과 크롤러는 각 여역이 어떤 의미의 정보를 담는지 기계적으로 읽을 수 있습니다.
페이지의 개요와 구성, 본문 등을 파악하고, 키워드 등을 이해해 검색 시 사이트가 노출되는 것에 도움을 줍니다.
▶<title>을 놓치지 말고 적절하게 작성하자
<title>에 작성된 제목은 검색될 때 그 사이트의 이름입니다. 따라서 사이트를 가장 잘 나타내는 브랜드명, 키워드를 작성하는 것이 좋습니다.
<title>을 자주 바꾸거나 길이가 너무 길면 검색 엔진에서 불이익을 받습니다.
▶<meta name="description">을 이용해 페이지 설명을 남기자
<meta> 태그의 description을 사용해 페이지에 대한 간단한 설명을 작성해야 합니다.
<meta name="description" content="이 페이지에 대한 두세 문장 정도의 간단한 설명">의 형태로 작성할 수 있습니다.
사용자의 흥미를 유발하며 검색이 되었을 때 완전히 노축되도록 적는 것이 좋습니다.
이를 기준으로 이후에 검색이 될 때 키워드에 맞춰 선택됩니다.
▶<meta charset="UTF-8" />를 사용해 인코딩 방식을 지정하자
<meta> 태그의 charset 속성으로 인코딩 방식을 지정하는 것이 좋습니다.
인코딩 방식을 지정하면 여러 브라우저에서 통일된 인코딩 방식으로 노출시킵니다.
▶open graph, twitter 태그를 사용해 외부 사용자를 유인하자
og(open-graph) 태그는 페이스북에서 만든 프로토콜이며 여러 상황에서 동일한 메타 정보를 쉽게 표시하도록 만들어졌습니다.
우리가 많이 사용하는 카카오나 네이버 또한 링크 공유 시 og 태그에 작성된 정보로 노출되며 트위터는 자체 twitter 프로토콜을 가집니다.
예를 들어, 우리가 카카오톡으로 친구에서 url을 공유했을 때, url주소와 함께 미리보기 이미지나, 그 링크에 대한 설명, 제목을 표시되는 것을 본 적이 있을 겁니다.
<meta property="og:title" content="페이지 이름"/>
<meta property="og:description" content="페이지에 대한 간략한 한두 줄 설명"/>og 태그는 위 코드의 og:title, og:description처럼 값에 og:가 붙으며 프로퍼티에 값을 지정한 뒤 content 프로퍼티에 값을 주어 작성합니다.
요즘은 링크 공유를 통한 유입이 중요하기 때문에 open graph 태그를 작성하는 것은 필수입니다.
자세한 작성 방법 및 다양한 태그 정보는 open graph 공식사이트(httip://ogp.me/)를 참고 바랍니다.
여기까지 SEO, 검색엔진최적화에 대해 알아봤습니다 :)