또는

웹 표준과 검색로봇(웹봇)의 관계



효율적인 웹 검색을 위한 웹페이지 최적화


검색 엔진이 웹 페이지에 무슨 내용이 들어있는지 기계의 입장에서 잘 이해할 수 있도록 태그를 정리하는 작업이다.


1. 사이트를 등록할 때에는 검색 엔진의 능력에 맞게 등록해야 한다.

  예) 네이버의 경우 : 호스트 단위의 url만 인식한다.

      http://xxx.com  (o)

      http://xxx.com/sub (x)


  참고) 이름에는 _를 사용할 수 없다. (알파벳, 숫자, - 만 사용가능)

  예) my-story.com (o)

     my_story.com (x)


2. 사이트 소유주임을 증명해야 한다.

  예) 사이트에 검색 엔진이 인식할 수 있는 특정 meta 태그를 삽입하고,

   검색 엔진이 그 태그를 읽어들임으로서 소유주임을 확인한다.


  주의1) 자바스크립트나 meta refresh 로 리다이렉션 하면 안됨

       <meta http-equiv="refresh" content="0.0001; URL=http:..." /> (x)

  주의2) frame 태그등의 내부에 넣어 놓아도 안됨


  단, 불가피하게 리다이렉션이 필요한 경우, http 리다이렉션을 이용해야 한다.

    이 설정은 웹 호스트 서버에서 할 수 있다.

    영구적 리다이렉션 : http 301 리다이렉션을 이용한다. (검색엔진이 가지고 있는 이전 색인 정보가 갱신됨) -> "호스팅업체의 웹포워딩서비스"

    임시로 리다이렉션 (리뉴얼 같은 때) : http 302 리다이렉션을 이용한다. (검색엔진이 가지고 있는 색인 정보를 유지함-기존 검색순위, 링크 손실이 최소화됨)


  참고) 네이버의 웹마스터도구 페이지는 IE 10 이상에서만 지원됨



3. 웹사이트에 robots.txt라는 파일을 만들어 루트 디렉토리에 두는 게 좋다.

  이 파일은 모든 검색로봇이 참조하기로 되어 있다.

  즉, 로봇들이 http://www.mysite.com/robots.txt를 참조한다.

  이 파일이 없으면, 로봇들은 웹사이트내 모든 문서를 수집대상으로 간주한다.


  예) robots.txt 의 내용

     User-agent: *

     Allow: /


  참고) User-agent: Yeti 라고 하면 네이버의 검색로봇만 접근할 수 있게 된다.

       Yeti는 네이버 검색로봇의 이름임

       위의 예는 모든 로봇들의 접근을 허용한 것임


  참고) 또 다른 예 (네이버)

     User-agent:Yeti

     Disallow:private*/

        --> 네이버 크롤러에게 /private-inage, private-video 등의 수집을 금함

  

       User-agent:*

       Disallow:/

        -->모든 웹로봇들에게 모든 페이지의 수집을 금함


  참고) robots.txt에 사이트맵이 있는 위치를 명시할 수도 있다.

    예) Sitemap:http://www.mysite.com/sitemap.xml


  참고) 개별 웹페이지 내에서 meta 태그가 검색 로봇을 막을 수도 있다.

    <meta name="robots" content="noindex"> // noindex는 해당 페이지에 대해 검색 로봇의 인덱싱을 불허한다는 의미임

단, 예외적으로 공공 정보와 같은 공공재 성격의 사이트는 강제 접근하기도 함


   개별 웹페이지 내에서 meta 태그가 링크 정보 수집을 막을 수도 있다.

    <meta name="robots" content="nofollow"> // nofollow는 해당 페이지에서 링크로 연결된 정보를 수집하지 말라는 의미임

뿐만 아니라, HTML 태그가 아닌 자바스크립트로 링크를 지정하면 로봇이 인식하지 못함

  예) <a href="http://...">xxx</a>  (o)

     <span onClick="javascript:goto(xxx);">xxx</span>  (x)


  <meta name="robots" content="index, nofollow"> // 색인 허용, 단 페이지내 링크는 수집 불허

  <meta name="robots" content="index, follow">  // 색인, 링크 수집 모두 허용

  참고) 웹사이트 메인 페이지가 frame 태그로 싸여있을 경우, 로봇에게 혼란을 주기도 하고 서로 다른 웹서버간의 저작권 분쟁등이 발생하는 등의 문제가 생길 수 있으므로 frame 사용을 자제해야 한다.


  참고) 검색 로봇은 HTML 마크업만 읽으므로 자바스크립트로 로딩되는 내용은 무의미하다.


  참고) 사이트를 이전할 때, 신규 사이트의 robots.txt에서 로봇 접근을 차단함으로써 불완전한 정보가 수집되는 것을 막는 것이 좋다.


4. XML 형식으로 작성한 사이트맵 파일을 만들어 제출해야 한다.

  그리고 웹사이트의 최신 글(제목과 본문 포함)을 역시 XML 형태로 기술한 RSS 피드 파일도 만들어 제출해야 한다.

   예) 만들어진 사이트맵과 RSS 피드 파일 제출 방법 (네이버)

      사이트맵 : 웹마스터도구 화면 > 요청 > 사이트맵 제출

      RSS 피드 : 웹마스터도구 화면 > 요청 > RSS 제출



5. 웹페이지 제목

<head></head> 사이의 <title>태그에 웹사이트 성격을 잘 표현하는 설명과 브랜드명을 기입할 것을 권장한다. 상호명, 서비스명, 제품명등의 고유명사가 들어 있는 것이 좋다. 단, 검색 노출만을 위해 제목을 자주 변경하면 제목이 과도하게 길어져 불이익을 받을 수 있다. 개별 페이지에도 <title>을 작성할 수 있다. 단, 반복적인 키워드, 스팸성 키워드, 내용과 무관한 키워드는 불이익을 받을 수 있다.


6. 웹페이지 설명

<head></head> 사이의 <meta>태그에 웹페이지 내용을 설명하는 문구를 들어있는 것이 좋다. 1~2 문장. 반복적, 스팸성, 의미없는 키워드는 피할 것.


7. 소셜 미디어


<head>

... 오픈 그래프 태그

<meta property="og:type" content="website">

<meta property="og:title" content="페이지 제목">

<meta property="og:description" content="페이지 설명">

<meta property="og:image" content="http://www.mysite.com/article/article1_featured_image.jpg">

<meta property="og:url" content="http://www.mysite.com/article/article1.html">

... 소셜 미디어 부가정보

<meta name="twitter:card" content="summary">

<meta name="twitter:title" content="페이지 제목">

<meta name="twitter:description" content="페이지 설명">

<meta name="twitter:image" content="http://www.mysite.com/article/article1.html">

<meta name="twitter:domain" content="사이트 명">

...

</head>

오픈 그래프 태그 : 웹사이트가 소셜 미디어로 공유될 때 우선적으로 활용되는 정보다.

소셜 미디어 부가정보 : 공유될 콘텐츠의 정보를 직접 결정함으로써 사용자의 페이지 방문을 높일 수 있다.



참고해야 할 각 포털 업체의 검색 정책들

1. 검색 노출을 늘이기 위해 같은 내용의 사이트를 여러 개 만들면 불이익이 있음

2. 웹페이지들의 제목을 똑같이 하지 말 것


3. 검색로봇 방문 이후 검색된 내용이 반영될때까지의 시간

  네이버 : 최대 1주일 소요


  참고) 검색 로봇이 웹사이트의 내용을 제대로 읽어갔는지 확인 (네이버)

    네이버 검색창에 사이트명 입력 조회

    또는, 웹문서 검색에 site:www.mysite.com 조회


4. 웹사이트의 제목과 설명이 포털 업체의 정책에 부합해야 한다.


5. 웹페이지를 모바일 친화적으로 반응형 웹페이지 형태로 제작할 것을 권장한다.

   '반응형 웹'이란 웹브라우저가 웹문서의 가로폭을 기기의 스크린 크기에 맞게 자동적으로 조절할 수 있게 해주는 기법을 말한다. 데스크탑용과 모바일용으로 따로따로 페이지를 만들면 내용이 중복될 뿐 아니라 불이익을 당할 수도 있다.

예) <head>

   <meta name="viewport" content="width=device-width">

   </head>

6. 이미지는 로봇이 인식하지 못하므로 웹페이지를 텍스트로 만들어야 자료 수집이 가능하다. 이미지를 쓸 수 밖에 없을 경우에는 "alt" 속성에 짧은 설명을 추가해줘야 한다.(단, alt에 많은 텍스트가 들어가면 스팸으로 오인될 수도 있음)


7. 타 사이트의 좋은 내용을 가져다가 내용을 채울 경우, 로봇이 중복 정보로 오인할 수도 있고 가치가 낮은 사이트라고 판단할 수도 있다. 내용이 개성적일 경우 검색 상위에 노출될 가능성이 더 커진다.




저작자표시 비영리

'프로그래밍' 카테고리의 다른 글

[Windows 10에서 안드로이드 앱 개발] 코틀린(Kotlin)을 이용한 '누구나 스마트폰 앱 개발' (1/16) - 개발환경 구축  (0) 2019.09.19
(프로그래밍, 운영체제) Kali Linux 설치시 발생하는 소소한 문제와 해법  (0) 2019.07.29
(프로그래밍 강좌) HTML 5 강좌3  (0) 2018.08.14
(프로그래밍 강좌) HTML 5 강좌2  (0) 2018.08.14
(프로그래밍 강좌) HTML 5 강좌1  (0) 2018.06.21

+ Recent posts

티스토리툴바