검색엔진최적화(Search Engine Optimization, SEO)

SEO

검색엔진최적화(Search Engine Optimization, SEO)

홈페이지의 구조와 페이지를 검색엔진이 이해하기 쉽도록 개발해 검색 결과 상위에 노출될 수 있도록 하기

SEO란?

검색엔진 최적화(SEO)는 ‘Search Engine Optimization’ 또는 ‘Search Engine Optimizer’의 약자로, 검색엔진에서 검색이 잘 되게 하는 방법을 말한다.

sitemap.xml

sitemap.xml은 웹사이트 내 모든 페이지의 목록을 나열한 파일로 책의 목차와 같은 역할을 한다. 검색 엔진 로봇의 일반적인 크롤링 과정에서 발견되지 않는 웹페이지에 대한 정보를 제공해주기 때문에 더 많은 웹페이지가 크롤링되고 색인될 수 있게 도와준다.

다국어 사용시 사이트맵에 언어정보

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> 
  <url>
    <loc>http://www.example.com/foo.html</loc>
    <lastmod>2020-03-10</lastmod>
  </url>
  <url>
    <loc>http://www.example.com/bar.html</loc>
    <lastmod>2018-04-01</lastmod>
  </url>
</urlset>

robot.txt

robots.txt는 사이트의 루트 디렉토리에 위치하며 웹사이트에 대한 검색엔진 로봇들의 접근을 제어해주고 로봇들에게 웹사이트의 사이트맵이 어디 있는지 알려주는 역할을 한다.

  • 모든 접근 허용
User-agent: *
  • /admin/ 하위 경로에 대한 모든 웹 크롤러의 접근을 차단
User-agent: *
Disallow: /admin/
  • 사이트맵 위치 안내
Sitemap: https://example.com/sitemap.xml

타이틀 & 메타디스크립션 태그

타이틀 태그는 영문의 경우 공란 포함 65자, 한글은 32자, 메타디스크립션 길이 제한은 영문 기준 320자, 한글 160자 정도로 사람들이 관심있어 할만한 키워드, 문구를 설정한다.

<html>
  <head>
    <title>페이지 타이틀(검색 결과에 나오는 부분)</title>
    <meta name="description" content="페이지 내용을 정리한 설명(검색 결과 프리뷰로 나타나는 영역)">
  </head>
</html>

오픈그래프 태그

소셜 검색엔진최적화 메타태그인 오픈그래프 태그(Open Graph)는 페이스북, 트위터 등의 소셜미디어에서 웹페이지 URL이 공유될 때 웹페이지의 주요 정보(제목, 이미지, 설명)가 표기되는 방식을 설정한다.

저장소 생성 메뉴
Open Graph가 적용된 웹페이지 URL 공유시 태그로 설정된 정보들이 표시된다.
<html>
  <head>
    <meta property="og:url" content="https://example.com" />
    <meta property="og:title" content="페이지 타이틀" />
    <meta property="og:description" content="페이지 설명" />
    <meta property="og:image" content="https://example.com/image.js" />
  </head>
</html>

대표 주소 설정

http://example.com
http://www.example.com
https://example.com
https://www.example.com

방문자가 위의 4가지 중 어떤 주소를 입력하든 일관성 있게 특정 주소 하나로 접속이 되도록 설정을 해 웹사이트를 각각 별도의 웹사이트로 인식하지 않도록 하여 웹사이트의 도메인 점수가 분산되지 않도록 한다.

<html>
  <head>
	<link rel="canonical" href="https://example.com/url/path" />
  </head>
</html>

이미지 태그 최적화

이미지 Alt태그가 잘 설정되어 있는 이미지의 경우, 이미지 검색에서 높은 검색 순위를 차지한다.

<img src="./그림파일.gif" alt="그림설명">

모바일 최적화

반응형 웹사이트로 제작하는 것을 권장한다.

모바일 친화성 테스트: https://search.google.com/test/mobile-friendly

HTTPS 보안 프로토콜 사용하기

HTTPS 보안 프로토콜을 사용하는 웹사이트에 대해 구글 검색엔진에서 랭킹 가산점을 부여한다.

웹페이지 로딩 속도 개선

웹페이지의 로딩 속도는 사용자 경험에 영향을 미치기 때문에 검색 엔진은 로딩 속도가 짧은 웹사이트에 높은 점수를 부여한다.

웹페이지 속도 테스트: https://developers.google.com/speed/pagespeed/insights/

동적 페이지 피하기

페이지 최초 로딩 시에는 내용이 없다가 동적으로 컨텐츠를 불러올 경우 검색 엔진 로봇이 페이지 내용을 가져갈 수 없다.

다국어 페이지 최적화

페이지의 언어별 버전에 서로 다른 URL을 사용할 것을 권장한다.

  • Google에 여러 언어 또는 지역별 페이지 알리기
<html>
  <head>
    <link rel="alternate" hreflang="en-gb" href="http://en-gb.example.com/page.html" />
    <link rel="alternate" hreflang="en-us" href="http://en-us.example.com/page.html" />
    <link rel="alternate" hreflang="en" href="http://en.example.com/page.html" />
    <link rel="alternate" hreflang="de" href="http://de.example.com/page.html" />
    <link rel="alternate" hreflang="x-default" href="http://www.example.com/" />
  </head>
</html>

다국어 각 페이지에 모두 hreflang 코드를 넣어 줘야한다. 다국어 설정되지 않는 언어의 사용자가 들어올 경우 x-default로 설정한 페이지로 연결된다.

검색엔진 순위 (2020년 2월)

  1. Google
  2. Bing
  3. Yahoo! Search
  4. Baidu
  5. Ask
  6. Aol Search
  7. DuckDuckGo
  8. WolframAlpha
  9. Yandex
  10. WebCrawler

요약

  • sitemap.xml
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> 
  <url>
    <loc>http://www.example.com/foo.html</loc>
    <lastmod>2020-03-10</lastmod>
  </url>
  ...
</urlset>
  • robots.txt
User-agent: *
Sitemap: https://example.com/sitemap.xml
  • html
<html>
  <head>
    <title>타이틀</title>
    <meta name="description" content="설명">
    <meta property="og:url" content="https://example.com" />
    <meta property="og:title" content="타이틀" />
    <meta property="og:description" content="설명" />
    <meta property="og:image" content="https://example.com/image.js" />
	<link rel="canonical" href="https://example.com/url/path" />
  </head>
  <body>
    ...
  </body>
</html>

참고자료

사이트맵: https://www.sitemaps.org/index.html 모바일 친화성 테스트: https://search.google.com/test/mobile-friendly
웹페이지 속도 테스트: https://developers.google.com/speed/pagespeed/insights/
검색엔진 최적화(SEO) 초보자 가이드: https://support.google.com/webmasters/answer/7451184?hl=ko
구글 품질 가이드라인: https://support.google.com/webmasters/topic/6001971?hl=ko&ref_topic=6001981
구글 크롤링 및 색인 생성: https://support.google.com/webmasters/topic/9427949?hl=ko&ref_topic=9428048
검색엔진 순위: http://www.ebizmba.com/articles/search-engines

관련글

대화 및 토론