전자 상거래 상점을 위한 완벽한 404 페이지를 디자인하는 방법

게시 됨: 2021-09-07

404, 이 3자리 숫자는 상점에 큰 영향을 줄 수 있습니다. 전자 상거래 상점의 다른 페이지와 마찬가지로 404 오류 페이지를 무시해서는 안됩니다. 아무도 이 페이지를 만나고 싶어하지 않고 아무도 좋아하지 않지만 피할 수도 없습니다. 따라서이 페이지에 특별한주의를 기울이고 더 강력한 고객 관계를 구축하는 것이 좋습니다.

전자 상거래 상점 소유자로서 우리는 항상 웹 사이트에 트래픽이 지속적으로 유입되기를 바랍니다. 방문자가 검색 결과의 다양한 페이지를 좋아하고 클릭하고 있음을 보여줍니다. 그러나 새로운 방문자가 "페이지를 찾을 수 없음" 메시지가 표시되면 경험이 끔찍할 수 있습니다. 이러한 오류 페이지는 모든 노력을 헛되이 만들 수 있습니다.

방문자는 다음에 무엇을 할 것인가?

방문자는 404 오류 페이지(상태 코드)를 제대로 설정하지 않은 경우 뒤로 버튼을 클릭하는 동안 눈을 깜박이지 않습니다. 맞춤 오류 페이지로 첫인상을 날려버렸습니다.

404 오류 페이지란 무엇입니까?

일반적으로 "페이지를 찾을 수 없음"으로 알려진 404 오류 페이지는 탐색하는 동안 발생할 수 있는 가장 일반적인 오류입니다. 이 오류는 깨진 링크를 클릭하거나 작동하는 웹사이트의 주소 표시줄에 잘못된 URL을 입력할 때 발생합니다. 이러한 깨진 링크는 SEO 및 사용자 경험 측면에서 사이트에 상당한 영향을 미칠 수 있습니다. 따라서 이러한 페이지를 제거하거나 관련 링크로 교체하는 것이 좋습니다. 단, 쇼핑몰에 끊어진 링크가 없는 경우 고객이 잘못 입력한 경우 404 오류 페이지가 나타날 수 있습니다. 그리고 이것은 창의성을 선보이고 매출을 높일 수 있는 최고의 기회입니다.

404s는 왜 발생합니까?

404 오류는 연결하려는 웹 페이지를 서버에서 찾을 수 없음을 의미하는 표준 HTTP 오류 코드입니다. 웹 페이지가 제거 또는 이동되고 그에 따라 URL이 변경되지 않았거나 사용자가 잘못된 URL을 입력했습니다.
깨진 링크는 404 오류 페이지의 주요 원인입니다.

이동된 페이지

간단해 보이지만 404페이지의 대부분은 사이트 소유자가 일반적으로 웹페이지의 이름을 바꾸거나 이동할 때 발생합니다. 이전 URL은 301 리디렉션을 사용하여 새 사이트로 리디렉션되어야 하지만 그럴 필요는 없습니다.

웹 디렉토리

웹 디렉토리가 변경되면 사용자가 URL을 변경하거나 URL이 업데이트 없이 이동/삭제될 때 강제로 변경됩니다.

디렉토리 내에서 업데이트되지 않은 내부 링크는 404 오류 페이지로 이어질 수 있습니다. 그러나 이러한 모든 문제 후에 웹 사이트는 방문자가 직면하는 404개의 문제 중 17% 만 차지합니다. 따라서 오류를 수정하거나 리디렉션을 설정하기 위해 사이트 크롤링에 대해 얼마나 부지런했는지에 관계없이. 사용자는 여전히 귀하의 잘못 없이 404 페이지로 리디렉션됩니다.

일반적으로 404 오류 페이지의 주요 원인은 다음과 같습니다.

  • 직접, 오타, 이메일, 책갈피 - 45.87%
  • 추천 및 소셜 네트워크 - 30.26%
  • 웹사이트의 깨진 링크 – 17.58%
  • 검색 엔진 - 6.3%

404 오류의 숨겨진 비용

사이트 페이지의 링크가 끊어진 방문자는 전체 매출, 전환율, 사이트 가시성, 브랜드 이미지 및 사용자 경험에 상당한 영향을 미칠 수 있습니다.

이 문제를 직접적으로 보여주는 세 가지 중요한 통계는

  • 방문자의 23% 만이 404 페이지를 만난 후 누락된 페이지를 찾기 위해 두 번째 시도를 합니다.
  • 웹 사이트의 성능에 만족하지 않는 방문자의 79% 는 동일한 사이트에서 다시 구매하지 않을 것이라고 말합니다.
  • 평균적으로 새로운 고객을 확보하는 것은 기존 고객을 유지하는 것보다 5배 더 비용이 듭니다.

그러나 404 오류 페이지에 도달한 고객을 잃은 것은 100% 필수입니다. 사용자 정의된 404 오류 페이지는 사용자가 상점의 올바른 웹 페이지로 이동하는 데 도움이 될 수 있습니다. 맞춤형 404 오류 페이지를 만드는 것의 중요성을 알아봅시다.

맞춤형 404 페이지를 만들어야 하는 이유는 무엇입니까?

맞춤형 404 페이지 만들기

매력적인 맞춤형 404 페이지를 만들려면 상당한 노력과 기술을 투입해야 합니다. .htaccss 파일을 편집하고 서버에서 일부 명령을 실행해야 합니다.

이 작업을 수행할 수 있는 프로그래머를 고용해야 합니다. 우리는 당신을 위해 여기 있으므로 이와 관련하여 걱정할 필요가 없습니다. 하지만 맞춤 404 페이지를 만드는 이유는 무엇입니까? 주요 이유는 다음과 같습니다.

NS. 검색 엔진에서 사이트의 색인 페이지 수 늘리기:

사이트의 페이지 수가 증가함에 따라 데드 링크도 증가합니다. 404 페이지를 통해 인덱싱된 웹사이트 페이지를 늘릴 수 있습니다. 404 오류 페이지를 웹사이트의 임의의 내부 페이지에 연결하기만 하면 됩니다.

NS. 일관된 브랜드 이미지 구축

우리 인간은 일관성을 선호합니다. 상점에 익숙해지면 무의식적으로 신뢰하기 시작합니다. 주요 초점은 표면에 있습니다. 일반 404 페이지는 좋지 않은 사용자 경험을 제공합니다. HTTP 상태 코드를 제거할 수는 없지만 사용자 지정 오류 페이지를 통해 문제를 식별하고 UX를 개선할 수 있습니다.

로그 파일을 가져 와서 문제 정보와 응답 코드를 캡처하여 적절하게 처리하십시오. 사용자가 상점의 죽은 링크를 방문했다면 당신의 향기를 보여주는 것이 필수적입니다. 디자인은 사용자가 다른 사이트에 있다는 사실을 당황하게 해서는 안 됩니다.

즉, 404 오류 페이지는 글꼴 스타일, 색상 코드, 로고, 탐색, 머리글 및 바닥글이 유사해야 합니다.

씨. 재참여 및 불행한 방문자

특정 제품에 대한 정보를 찾기 위해 매장을 방문한 사용자를 생각해 보십시오. 그러나 검색 엔진 결과에서 웹 페이지를 클릭한 후 응답 가능한 페이지가 표시되지 않고 "페이지를 찾을 수 없음" 페이지가 표시됩니다. 그것은 사용자를 끔찍하게 만들 것입니다.
그러나 사용자에게 사이트 페이지에 대한 링크를 제공하면 사용자를 다시 참여시킬 수 있습니다. 이런 식으로, 당신은 그들의 관심을 유지합니다.

NS. 브랜드의 개성을 보여주세요

기업으로서 자신을 보여줄 수 없습니다. 당신의 브랜드는 인간적인 감각을 주어야 합니다. 당신의 개성을 보여줌으로써 타겟 청중과 더 잘 연결할 수 있습니다. 웹 사이트와의 사용자 상호 작용은 기분을 좋게 해야 합니다. 인간의 결정은 1초 미만의 찰나의 순간에 이루어집니다.

따라서 404 오류 페이지를 자신을 표현하고 방문자를 기분 좋게 만들고 청중과의 관계를 강화하는 매체로 사용해야 합니다. 고객의 불만을 인정하고 문제가 발생했음을 인정합니다. 이것은 개인적인 상호 작용을 만들 것입니다.

이자형. 전환율 증가

404 오류 페이지를 만들어 실수를 인정하고 사용자가 매장에서 즐거운 시간을 보낼 수 있도록 합니다.

404 오류 페이지의 사용자 정의 응답은 아마도 사용자의 두뇌에서 웹사이트의 끊어진 링크에 대한 잘못된 기억을 지울 것입니다. 그리고 그것은 그들이 당신에게 두 번째 기회를 줄 가능성을 높입니다. 이것은 가설에 가깝습니다.

그러나 404 페이지에 할인을 제공함으로써 전환율을 실질적으로 높일 수 있습니다. 예, 사용자 정의 오류 페이지를 사용하여 변환하십시오. 이런 식으로 HTTP 상태 코드는 수입에 오류를 가져옵니다.

전자 상거래 개발자 고용

404 오류 페이지의 구성 요소

유용한 404 오류 페이지에는 4개의 중요한 구성 요소가 있습니다. 탐색, 톤, SEO 및 창의성입니다. 각 요소에 대해 자세히 알아보십시오.

1. 내비게이션

404 오류 페이지에 도달한 사용자의 첫 번째 요구는 탐색입니다. 사용자를 원하는 페이지로 리디렉션해야 합니다. 홈페이지나 기타 관련 페이지에 대한 링크가 가장 잘 작동합니다. 다른 웹사이트 페이지에도 있는 메뉴 모음 탐색을 제공하는 것도 좋습니다. 가능하면 챗봇을 사용하여 잃어버린 방문자를 초대할 수도 있습니다.

2. 톤

위에서 언급했듯이 404 오류 페이지는 브랜드 개성을 반영해야 합니다. 404 페이지를 방문한 사용자가 완전히 다른 웹사이트에 왔다고 느끼는 것을 원하지 않습니다. 주제와 스타일은 일관성이 있어야 합니다.

3. 검색엔진 최적화

우리는 모두 404 오류 페이지가 불가피하다는 것을 알고 있습니다. 끊어진 링크는 404페이지로 연결되며 피할 수 없습니다. 그러나 404 페이지는 적절하게 사용자 정의하면 피해를 줄이고 부정적인 경험을 긍정적인 경험으로 바꿀 수도 있습니다.

4. 창의성

404 페이지는 창의적인 기술을 선보일 수 있는 최고의 기회를 제공합니다. 농담을 풀고 상호 작용을 제공하고 상호 작용하거나 편안하거나 재미있는 요소를 표시할 수 있습니다.

404 오류 페이지의 가장 좋은 예

다음은 참조할 수 있는 다양한 산업 분야의 404 오류 페이지에 대한 몇 가지 모범 사례입니다.

1. 아마존

아마존 404 페이지

7,000 마리 이상의 개가 Amazon 본사에서 합법적으로 일하도록 등록되어 있다는 사실을 알고 놀라실 것입니다. Amazon의 애완 동물 친화적인 성격은 입소문을 타고 있으며 회사는 심지어 애완 동물 친화적인 문화를 자랑스럽게 공유합니다. 404 오류 페이지에서도 표시되고 있습니다.

모두가 개를 존경하고 사랑스럽다고 생각하지만 Amazon은 그들이 일하러 가져온 Amazonian의 개의 이미지를 보여줌으로써 다음 단계로 끌어 올립니다. 또한, 404페이지에는 집에 대한 링크와 그들이 가지고 있는 다른 개에 대한 기사가 있습니다. Amazon의 404 오류 페이지에 방문하는 사용자는 검색 창을 사용하여 원하는 제품을 탐색할 수도 있습니다.

2. 이베이 캐릭터 무브먼트

이베이 404 페이지

eBayeBaysignificanthighly는 전 세계에서 가장 오래된 전자 상거래 상점으로 유명합니다. 회사는 404 오류 페이지에 대해 힘들지 않고 미묘한 디자인을 채택했지만 여전히 사용자 친화적입니다. 사용자는 페이지에서 트렌드 거래를 찾을 수 있으며, 이는 사이트에서 더 진행하고 제품을 구매하도록 유도합니다. 이 외에도 검색 창과 홈페이지 링크가 있습니다.
eBay 404 페이지는 전환율이 높고 좋은 예이므로 참조할 수 있습니다.

3. 이케아

이케아 404 페이지

전 세계적으로 대규모 가구 매장을 보유한 트렌디한 가구 브랜드인 IKEA는 다양한 가구 제품을 제공합니다. 이 회사는 모바일 앱, 웹사이트 또는 404페이지를 통해 더 나은 쇼핑 경험을 제공하는 데 있어 매우 혁신적입니다.
그들은 404 오류 페이지에서 뛰어난 수준의 창의성을 보여주었습니다. 배치된 요소는 회사의 작업과 브랜드를 강조합니다. 다이렉트 메시지와 홈페이지로 연결되는 링크로 연결되었습니다. 페이지에는 산만함을 피하기 위한 다른 요소가 없으며, 초점은 명확합니다. 잃어버린 고객을 웹사이트의 홈페이지로 리디렉션하는 것입니다.

4. 민트라

민트라 404 페이지

Myntra는 인도 패션 전자 상거래 산업에서 널리 퍼진 이름입니다. 이 패션 전자 상거래 사이트에서는 모든 연령대와 성별에 맞는 다양한 웨어러블 제품을 찾을 수 있습니다. 가게의 404 페이지도 아름답습니다. 그들은 사용자에게 길을 잃었다는 아이디어를 나타내고 있으며 동시에 사용자가 제품, 카테고리 등을 검색할 수 있는 검색 막대가 있습니다.
Myntra의 404 페이지에는 위시리스트, 장바구니 페이지 링크, 프로필 링크, 검색창 등 고객이 필요로 하는 모든 것이 있습니다.

5. 깃허브

Github 404 페이지

Github은 404 오류 페이지에서 유머와 대중 문화 참조를 모두 사용했으며 오류 페이지에 도달할 때 어색함을 해소하는 재미있는 메시지를 전달합니다. 혼동을 일으키지 않도록 간단한 탐색 옵션이 있습니다. 검색 표시줄과 지원 링크, 상태 페이지가 있습니다.

그러나 쿠데타는 이미지가 사용자의 커서와 함께 장난스럽게 반응하도록 하는 미묘한 시차 효과입니다. 이 애니메이션은 GitHub 디자이너가 청중과 매우 잘 조화되어 있음을 보여줍니다.

6. 빅커머스

BigCommerce 404 페이지

BigCommerce는 최고 등급의 전자 상거래 개발 플랫폼입니다. 수천 개의 전자 상거래 상점이 이 플랫폼에 구축되었습니다. 404페이지에 걸쳐 사용자들은 사이버 공간에서 길을 잃었음을 쉽게 이해할 수 있습니다. 홈페이지 외에도 사용자를 방문하려는 특정 항목을 나열했습니다.

데모를 예약하거나 404 오류 페이지에서 문의하는 기능도 있습니다.

7. 헤드스페이스

헤드스페이스 404 페이지

온라인 명상 서비스에서 Headspace는 상당한 명성을 얻었습니다. 그들의 팀은 인간의 두뇌가 어떻게 작동하는지 이해하므로 404 오류 페이지에는 목적만 표시됩니다. 그것은 제품에 초점을 맞추고 사용자가 스트레스를 받지 않도록 진정시키기 위해 제품이 무엇을 할 수 있는지 보여줍니다. 길을 잃은 방문자가 잠시 동안 볼 수 있고 약간의 여유 공간을 얻을 수 있는 캐릭터의 느리고 리드미컬한 움직임. 사용자에게 스트레스를 주지 않고 숨을 들이쉬고 내쉬라고 말합니다.

8. 볼루젼

Volusion 404 페이지

Volusion은 전자 상거래 상점을 개발할 수 있는 클라우드 기반 전자 상거래 소프트웨어입니다. 판매자는 제품을 추가하고, 카테고리를 만들고, 지불 세부 정보를 추가하고, 판매를 시작할 수 있습니다. 404 오류 페이지에는 사용자에게 매우 매력적인 다채로운 공이 있습니다.
브랜드를 알리기 위해 디자이너들은 Volusion 로고의 볼에 색상 조합을 사용했으며 볼이 떨어진 후 깔끔한 페이지에는 홈페이지 링크가 표시됩니다.

9. 스퀘어스페이스

스퀘어스페이스 404 페이지

유명한 웹사이트 빌더인 Squarespace를 사용하면 판매자가 웹사이트를 구축하고 호스팅할 수 있습니다. 사용자는 CMS 및 웹 페이지를 만들기 위해 끌어서 놓기 기능이 있는 사전 빌드 템플릿을 사용할 수 있습니다. 404 오류 페이지에는 사용자가 즐길 수 있는 알파벳 게임이 있습니다. 사용자는 커서를 사용하여 알파벳을 이동할 수 있습니다. 사용자가 게임을 하고 싶지 않다면 제공된 링크로 간단히 리디렉션할 수 있습니다.

10. 르 싱게

Le SINGE 404 페이지

마지막으로 Le SINGE는 404페이지라는 환상적인 컨셉을 가지고 있습니다. 그것은 그들이하는 일에 대해 즉시 판매합니다. 404는 어둡게 표현되어 있으며, 사용자의 커서가 이동함에 따라 화면의 해당 부분에 스포트라이트가 비춰진다.
사용자는 직접 링크를 사용하거나 지원 팀과 채팅을 시작할 수 있습니다.

마무리

이 기사에서는 404 페이지의 모든 다양한 측면, 페이지가 발생하는 이유, 구성 요소, 가치, 예 등을 살펴봅니다. 이러한 맞춤형 매력적이고 유용한 404 오류 페이지를 만드는 데 전문 지식을 갖춘 디자이너가 있는 최고의 전자 상거래 개발 회사를 고용하십시오.