Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


유용한 404 페이지 만들기

사용자가 URL의 일부를 제거하는 경우 발생할 상황을 고려, 페이지 내의 사이트 이동경로를 사용하는 대신 보다 일반적인 콘텐츠를 찾기 위해 URL의 일부를 생략할 수도 있다.
이러한 상황에 해당 디렉토리에서 콘텐츠가 제공되어 있지 않는 경우, 사용자에게 단순히 404 오류를 보이는 대신에 상위 디렉토리 및 404 페이지로 이동시켜야 한다.
간혹 사용자들은 유효하지 않은 링크를 따라가거나 잘못된 URL을 입력하여 사이트에 존재하지 않는 페이지에 도달하기도 한다.
사이트의 올바른 페이지로 돌아가도록 친절하게 안내하는 맞춤형 404 페이지를 사용하면 사용자가 보다 편리하게 사이트를 이용할 수 있다.
404 페이지에는 메인 페이지로 돌아가는 링크나, 사이트에서 인기 있는 페이지, 연관된 페이지에 대한 링크를 제공할 수 있다1.

올바른 404 페이지의 예

Image Added


잘못된 404 페이지의 예

Image Added

Info
  1. 사용자가 탐색하기에 복잡한 사이트 이동 구조.( 사이트의 모든 페이지들이 전체 페이지를 링크)
2.
  1. 콘텐츠를 지나치게 세분화하여 세부 페이지로 이동하는데 많은 클릭이 요구되는 구조
3.
  1. 이미지, 애니메이션(드롭다운) 등에 의한 링크 제공으로 검색 엔진이 이러한 링크를 찾을 수 있지만 텍스트 링크를 사용하면 검색 엔진에게 도움이 된다.
4.
  1. HTML 사이트 맵 페이지의 링크가 깨지거나 업데이트 되지 않는 상태로 방치.
5.
  1. 페이지를 구성하지 않고 단순히 페이지를 나열하는 HTML 사이트맵 생성.
6.
  1. 검색 엔진에 404 페이지에 대한 색인이 생성되도록 허용.(존재하지 않는 페이지가 요청되었을 때 웹서버가 404 HTTP 상태코드를 제공하도록 구성되어 있는지 확인)
7.
  1. “찾을 수 없음” 또는 “404” 등과 같은 애매한 메시지를 제공하거나 404 페이지를 아에 제공하지 않음.
8.
  1. 사이트 전체 내용과 일관되지 않는 404 페이지 디자인을 사용. (호스팅 서비스에서 제공하는 일반적인 404 페이지 사용)


301 리디렉션으로 페이지 URL 변경

검색 엔진 결과에 표시되는 대로 페이지의 URL을 변경해야 하는 경우 서버측 301 리디렉션을 사용하는것이 좋다.
301 리디렉션은 사용자와 검색엔진을 정확한 페이지로 이동시키기 위한 가장 좋은방법이며 301 상태코드는 페이지가 새 위치로 영구적으로 이동했음을 이동했음 을 의미한다.

Info
1.
  1. 사이트의 새로운 도메인으로 옮겼으며 사이트 이전을 최대한 원할하게 진행하고자 하는 경우
2.
  1. 사용자들이 서로 다른 여러 개의 URL을 통해 사이트에 액세스 하는 경우로(예 : http://example.com/home, http://home.example.com
또는
  1.  또는 http://www.example.com) 이러한 URL 중 하나를 선호(표준) 도착 URL로 선택하고 301 리디렉션을 사용해 다른 URL에서 선호 URL로 트래픽을 전송하는것이 좋다. Search Console을 사용해 선호 도메인을 설정할수 도 있다.
3.
  1. 두개의 웹사이트를 통합하고 이전 URL에 대한 링크가 올바른 페이지로 리디렉션 되게 하는경우


사이트 구조 조직 구성

모든 사이트는 홈 또는 루트가 존재한다. 이는 사이트에서 가장 자주 방문되는 페이지이며 방문자가 탐색하는 첫 지점 이기도 한다.

홈 페이지에서 탐색 메뉴를 만들어 방문자가 사이트의 다른 페이지를 찾을수 있도록 도움을 준다.

우선 사이트의 중요한 섹션을 강조 표시하고 논리적인 구조를 따른다. 

또한 사이트 이동경로의 노출로 방문자에게 편리를 제공(사이트 로케이션) 한다. 

사이트 이동경로는 페이지 상단 또는 하단에 위치한 내부 링크로서 페이지 방문자가 쉽게 이전 단계나 홈 페이지로 이동할 수 있도록 한다


홈페이지를 기반으로 한 이동경로 계획

방문자가 첫 메인 페이지에서 더 구체적인 콘텐츠가 있는 페이지로 이동하는 방법에 대해 생각해야 한다. 특정 주제에 대한 관련된 페이지가 상당수 존재하여 관련 페이지들을 설명하는

페이지를 따로 만들어야 하는지 (예 : 메인페이지 > 관련주제목록 > 특정주제), 또는 여러 카테고리 및 하위 카테고리 페이지로 나누어야 할 정도로 주제를 세분화 해야 하는지를 확인한 후

각 주제로 이동 경로를 계획 한다.

사이트 이동경로의 사용으로 방문자에게 편리를 제공(사이트 로케이션)

사이트 이동경로는 페이지 상단 또는 하단에 위치한 내부 링크로서 페이지 방문자가 쉽게 이전 단계나 홈 페이지로 이동할 수 있도록 한다

앵커 텍스트 작성

앵커 텍스트 작성으로 사이트 이동경로는 페이지 상단 또는 하단에 위치한 내부 링크로서 페이지 방문자가 쉽게 이전 단계나 홈 페이지로 이동할 수 있도록 한다


선호 도메인 설정

도메인에 대해 어느 버전의 사이트 URL을 선호하는지 다음과 같이 google에 알린다.

Info
1.
  1. https://www.example.com
2.
  1. https://example.com

선호 도메인을 도메인을 https://example.com으로 설정하면 Google에서  설정하면 Google에서 https://www.example.com에 대한 링크를  대한 링크를 https://example.com에 대한  대한 링크와 똑같이 처리한다. 

HTTP 헤더에 표준 링크 지정

서버를 구성할 수 있는 경우 rel="canonical" HTTP 헤더를 사용하여 HTML 문서 및 PDF와 같은 기타 파일의 표준 URL을 지정할 수 있다.

사이트에서 다음과 같이 다른 URL을 통해 동일한 PDF를 제공한다고 가정해 보면,

https://www.example.com/downloads/white-paper.pdf

https://www.example.com/downloads/partner-1/white-paper.pdf

https://www.example.com/downloads/partner-2/white-paper.pdf

https://www.example.com/downloads/partner-3/white-paper.pdf

이 경우 rel="canonical" HTTP 헤더를 사용하여 다음과 같이 PDF 파일의 표준 URL을 Google에 지정할 수 있다.

Link: <http://www.example.com/downloads/white-paper.pdf>; rel="canonical"

※ Google은 현재 웹 검색에만 이 링크 헤더 요소를 지원한다.