[TIL] 22.11.16 SEO 기본 가이드(2)

검색엔진 최적화(SEO) 기본 가이드

https://developers.google.com/search/docs/fundamentals/seo-starter-guide?hl=ko#appearance

SEO 기본 가이드: 기본사항 | Google 검색 센터  |  문서  |  Google Developers

 

사이트 계층 구조 구성하기

검색엔진의 URL 사용 방식 이해

검색엔진에서는 콘텐츠를 크롤링한 후, 색인을 생성하고 사용자에게 해당 콘텐츠를 안내하기 위해 콘텐츠별로 고유한 url이 필요하다.

protocol://hostname/path/filename?querystring#fragment

구글에서는 가능하면 모든 웹사이트에서 https://를 사용하길 권장한다.

웹 사이트를 서치 콘솔에 추가할 때 http버전과 https버전을 모두 추가하고, www 버전과 www가 아닌 버전도 추가하는 것이 좋다.

 

path, filename, querystring은 서버에서 어떤 콘텐츠가 액세스될 지를 결정한다. 이 세 부분은 대소문자를 구분한다. (hostname과 protocol은 대소문자 구분 X)

 

fragment는 일반적으로 브라우저에서 스크롤하여 페이지의 어떤 부분으로 이동할 지 식별한다. 콘텐츠 자체는 프래그먼트에 관계없이 동일한 경우가 보통이므로 검색엔진은 사용된 프래그먼트를 무시할 때가 많다.

 

호스트 이름 뒤에 오는 슬래시는 동일한 내용이므로 선택사항이다. (https://example.com/은 https://example.com과 동일함) 

 

홈페이지를 기반으로 탐색 계획 세우기

모든 사이트에는 홈페이지 또는 루트 페이지가 있다. 이는 사이트에서 가장 자주 방문되는 페이지이고 방문자가 탐색을 시작하는 지점이다.

 

사이트에 페이지가 얼마 없는 경우가 아니라면 방문자들이 루트 페이지에서 더 구체적인 콘텐츠가 있는 페이지로 어떻게 이동할 지 생각해보자. 특정 주제를 다루는 여러 페이지가 있다면 관련된 페이지를 설명하는 페이지를 마련해보면 어떨까? 예를 들면 루트 페이지 -> 관련 주제 목록 -> 특정 주제와 같은 경로를 만들 수 있다.

 

탐색경로 목록(Breadcrumb lists) 사용하기

탐색경로에서는 가장 일반적인 페이지(보통 루트 페이지)가 가장 왼쪽 첫 번째에 있는 링크이며, 가장 내용이 구체적인 섹션이 제일 오른쪽에 위치한다. 탐색경로를 표시할 때는 구조화된 탐색경로 데이터 마크업을 사용하는 것이 좋다.

 

사용자가 사용할 간단한 탐색 페이지 만들기

탐색 페이지란 사이트에 있는 간단한 페이지로서 웹사이트의 구조를 보여주며 사이트 페이지 계층구조 목록으로 구성되어 있는 경우가 많다. 검색엔진도 이 페이지를 방문하지만 이는 단지 사이트에 있는 페이지를 대부분 크롤링하기 위한 것이며, 탐색 페이지는 주로 인간 방문자를 대상으로 한다.

 

✔ 자연스러운 흐름 체계 만들기

• 사용자가 사이트의 일반 콘텐츠에서 자신이 원하는 특정 콘텐츠로 가능한 한 쉽게 이동할 수 있도록 만들어야 한다.
• 링크를 통해 사이트의 모든 페이지로 이동할 수 있는지, 내부 검색 기능이 없어도 페이지를 찾을 수 있는지 확인해야 한다. 해당되는 경우 관련 페이지를 링크하여 사용자가 유사한 콘텐츠를 확인할 수 있게 해야한다.

X 피해야 할 사항

• 탐색 링크가 서로 복잡하게 얽히도록 만드는 경우(예: 사이트의 모든 페이지를 다른 모든 페이지에 연결)
• 콘텐츠를 너무 잘게 나누는 바람에 홈페이지에서 특정 콘텐츠까지 이동하려면 20번이나 클릭해야 하는 경우

 

✔ 탐색용 텍스트 사용하기

• 사이트의 한 페이지에서 다른 페이지로의 탐색이 대부분 텍스트 링크를 통해 이뤄지도록 제어하면 검색엔진이 사이트를 크롤링하고 이해하기 쉬워진다.
• 자바스크립트를 사용해 페이지를 만들 때는 URL이 있는 a요소를 href 속성값으로 사용하고 사용자 상호작용을 기다리는 대신 페이지 로드 시 모든 메뉴 항목을 생성해야 한다.

X 피해야 할 사항

• 이미지나 애니메이션을 기반으로 하는 탐색 기능을 사용하는 경우
• 탐색할 때 스크립트 기반으로 한 이벤트 처리를 요구하는 경우

 

✔ 사용자용 탐색 페이지, 검색엔진용 사이트맵 만들기

• 전체 사이트 또는 페이지가 수백 또는 수천 개에 달하는 경우 대부분의 중요한 페이지를 대상으로 한 사용자용의 간단한 탐색 페이지를 만들자.
• 검색엔진이 사이트의 신규 페이지나 업데이트된 페이지를 발견할 수 있도록 XML 사이트맵 파일을 생성하자. 이 파일에는 관련성이 있는 모든 URL 및 그 URL의 주요 콘텐츠가 마지막으로 수정된 날짜가 명시된다.

X 피해야 할 사항

• 탐색 페이지가 최신 상태가 아니며 깨진 링크가 포함되어 있는 경우
• 주제별 등으로 페이지를 구성하지 않고 단순히 페이지를 나열하기만 한 탐색 페이지를 만든 경우

 

✔ 유용한 404 페이지 표시하기

• 사용자는 깨진 링크를 사용하거나 잘못된 URL을 입력하여 사이트에 존재하지 않는 페이지로 이동하는 경우가 있다.
• 이때 사이트에서 제대로 작동하는 페이지로 사용자를 친절하게 안내하는 맞춤 404 페이지를 통해 사용자의 경험을 크게 개선할 수 있다. 루트 페이지로 돌아가는 링크를 포함하고 사이트에서 인기 있는 콘텐츠나 관련 콘텐츠로 연결되는 링크를 제공하는 것이 좋다. 구글 서치 콘솔을 사용하면 '찾을 수 없음' 오류를 일으키는 URL 소스를 확인할 수 있다.

X 피해야 할 사항

• 404 페이지가 검색엔진에서 색인이 생성되도록 허용하는 경우(존재하지 않는 페이지가 요청되었을 때 웹 서버에서 404 HTTP 상태 코드를 반환하거나 자바스크립트를 기반으로 한 사이트인 경우 noindex 태그를 포함하도록 구성되어 있는지 확인)
• 404 페이지가 robots.txt 파일을 통해 크롤링되는 것을 차단하는 경우
• '찾을 수 없음', '404' 또는 404 페이지조차 표시하지 않음으로써 막연한 메시지만 제공하는 경우
• 404 페이지에서 사이트의 나머지 부분과는 다른 디자인을 사용하는 경우

 

단순한 URL은 콘텐츠 정보를 전달한다.

웹사이트 문서와 관련된 설명을 제공하는 카테고리 및 파일 이름을 만들면 사이트를 더 잘 구성하는 데 도움이 될 뿐만 아니라 콘텐츠에 관심을 두고 있는 사용자가 좀 더 쉽게 사용할 수 있으며 이들에게 더욱 친숙한 URL을 만들 수 있다.

 

다음과 같은 URL은 익숙하지 않고 혼란을 일으킬 수 있다.

https://www.brandonsbaseballcards.com/folder1/22447478/x2/14032015.html

 

반면 다음과 같이 의미 있는 URL은 사용자에게 더 유용하고 다른 문맥에서 쉽게 이해될 수 있다.

https://www.brandonsbaseballcards.com/article/ten-rarest-baseball-cards.html

 

URL은 검색결과에 표시된다.

문서 URL은 일반적으로 구글 검색결과에서 문서 제목 근처에 특정 형식으로 표시된다.

구글은 모든 URL 구조를 능숙하게 크롤링할 수 있고 매우 복잡한 구조라도 크롤링하지만 가능한 한 URL을 간단하게 만드는 것이 좋다.

 

✔ URL에 단어 사용하기

• 사이트의 콘텐츠 및 구조와 관련된 단어가 포함된 URL은 사이트를 탐색하는 방문자에게 더 친숙한 느낌을 준다.

X 피해야 할 사항

• 불필요한 매개변수 및 세션 ID가 있는 긴 URL을 사용하는 경우
• page1.html과 같은 일반적인 페이지 이름을 선택하는 경우
• baseball-cards-baseball-cards-baseballcards.html과 같은 과도한 키워드를 사용하는 경우

 

✔ 디렉토리 구조를 간단하게 만들기

• 콘텐츠가 잘 구성되어 있으며 방문자가 콘텐츠가 사이트의 어디에 위치하고 있는지 알기 쉬운 디렉터리 구조를 사용하자.

X 피해야 할 사항

• .../dir1/dir1/dir3/dir4/dir5/page.html과 같이 하위 디렉터리가 깊게 중첩되는 경우
• 내용과 관계없는 디렉터리 이름을 사용하는 경우

 

✔ 문서에 연결되는 URL을 하나의 버전만 제공하기

• 어떤 사용자는 이 버전의 URL을 사용하고 다른 사용자는 다른 버전의 URL을 사용하게 되면 URL별로 콘텐츠의 평판이 나뉠 수 있다.
• 사용자가 여러 개의 URL을 통해 동일한 콘텐츠에 액세스하고 있음을 발견한 경우 선호하지 않는 URL에서 기본 URL로 연결되는 301 리디렉션을 설정하는 것이 좋다. 리디렉션할 수 없는 경우 rel='canonical' 링크 요소도 사용할 수 있다.

X 피해야 할 사항

• 하위 도메인과 루트 디렉터리의 페이지가 동일한 콘텐츠에 액세스하는 경우(예: domain.com/page.html 및 sub.domain.com/page.html)

 

---

링크를 크롤링 가능하게 설정하기

https://developers.google.com/search/docs/crawling-indexing/links-crawlable?hl=ko

크롤링할 수 있는 링크 만들기 | Google 검색 센터  |  문서  |  Google Developers

구글은 인식 가능한 URL에 유효한 a 태그를 사용하는 링크만 추적할 수 있다.

 

올바른 <a> 태그 사용

구글에서는 href 속성이 포함된 a 태그인 경우에만 링크를 추적할 수 있다. 다른 형식으로 된 링크는 구글 크롤러가 추적하지 않는다. href 태그가 없는 a 링크가 스크립트 이벤트로 인해 링크처럼 작동하는 다른 태그는 추적하지 못한다.

 

추적 가능:

• <a href="https://example.com">
• <a href="/relative/path/file">

 

추적 불가능:

• <a routerLink="some/path">
• <span href="http://example.com">
• <a onclick="goto('https://example.com')">

인식 가능한 URL에 연결

a 태그에 연결된 URL이 Googlebot의 요청을 받을 수 있는 실제 웹 주소인지 확인한다.

 

인식 가능:

• https://example.com/stuff
• /products
• /procuts.php?id=123

 

인식 불가능:

• javascript:goTo('products')
• javascript:window.location.href='/products'
• #