brunch

You can make anything
by writing

C.S.Lewis

by 량과장 Sep 17. 2024

매출을 일으키는 홈페이지의 비밀

홈페이지는 정보의 집합체가 아니다. 기업의 철학과 가치를 전달하는 창구다. 의외로 많은 사람들이 홈페이지를 브랜딩 수단으로만 여기지만, 사실은 그렇지 않다. 홈페이지가 비즈니스의 성패를 가를 수 있기 때문이다.


대다수의 잠재 고객은 제품이나 서비스를 구매하기 전 인터넷에서 정보를 탐색하고, 그 과정에서 기업의 홈페이지를 방문한다. 기업들 역시 프로세스 자체는 인지하고 있지만, 홈페이지와 매출 사이에 직접적인 연관관계가 있다는 사실을 받아들이지 못한다. 홈페이지의 역할을 제대로 이해하지 못해서다.


홈페이지는 기업과 고객을 잇는 역할을 한다. 고객은 홈페이지에서 확인할 수 있는 정보를 토대로 기업을 평가하고 원하는 정보를 얻지 못하면 경쟁사로 눈을 돌린다. 매출이 잘 나오는 기업의 홈페이지가 고객이 원하는 정보를 제공하는 데 집중하는 것도 이러한 이유에서다.


성공한 기업의 홈페이지를 살펴보면 ‘고객의 니즈’를 충족시키겠다는 목적하에 검색 엔진 최적화(SEO), 메시지, 콘텐츠, 디자인 CTA, 반응속도와 디스플레이, 분석 툴 등의 세부 전략을 촘촘히 수립한 경우가 많다.



기존의 홈페이지, ‘매출이 높은 기업’의 홈페이지에 얼마나 부합할까?

Checklist ✅

SEO
☐ 검색량 높은 키워드를 타깃팅하고 있는가?
☐ 메타 태그, 제목 태그, ALT 태그 등이 적절하게 사용되고 있는가?

메시지
☐ 검색량 높은 키워드를 타깃팅하고 있는가?
☐ 기업이 제공하는 핵심 가치가 홈페이지 첫 화면에 명확히 드러나 있는가?
☐ 홈페이지에 방문했을 때, 기업이 제공하는 상품 및 서비스에 대해 즉각적으로 이해할 수 있는가?
☐ 고객의 페인 포인트에 대한 솔루션이 홈페이지에 제시되어 있는가?

콘텐츠
☐ 홈페이지에 기재된 콘텐츠가 고객의 관점에서 작성되었는가?
☐ 고객이 궁금한 정보를 쉽게 찾을 수 있는가?

디자인
☐ 홈페이지의 디자인이 직관적이고 사용하기 편리한가?
☐ 홈페이지의 디자인을 과도하게 하려 하거나 복잡하지 않은가?

CTA
☐ 고객이 취해야 할 행동이 명확하게 제시되어 있는가?
☐ CTA 버튼이 눈에 잘 띄는 위치에 배치되어 있는가?
☐ CTA의 문구가 고객의 액션을 유도하고 있는가?

반응 속도
☐ 페이지의 로딩 속도가 빠른가? (데스크톱과 모바일 모두)
☐ 이미지나 동영상 파일이 최적화되어 있는가?

디스플레이
☐ 모바일 및 태블릿 기기에서 홈페이지가 정상적으로 작동하는가?
☐ 모바일에서의 사용자 인터페이스(UI)가 사용하기 편리한가?

신뢰성
☐ 고객 리뷰나 인증 마크 등을 통해 신뢰성을 강화하고 있는가?
☐ 회사 정보가 명확하게 제공되고 있는가?
☐ 개인정보 처리 방침이나 이용 약관 등이 투명하게 공개되어 있는가?

접근성
☐ 모든 사용자가 홈페이지를 이용할 수 있는가?
☐ 폰트 크기나 색상 대비 등으로 가독성을 높여두었는가?

분석 툴
☐ GA4를 활용하고 있는가?
☐ 이탈률, 체류 시간, 전환율 등의 지표를 정기적으로 모니터링하고 있는가?
☐ 분석 결과를 토대로 홈페이지를 지속적으로 개선하고 있는가?

*선택한 항목이 많을수록 매출이 높은 기업의 홈페이지에 가까움


만일 현재 기업이 보유한 홈페이지가 매출이 잘 나오는 기업의 홈페이지와 거리가 있다면 리뉴얼 작업을 시작해야 할 필요가 있다. 홈페이지가 브랜딩만을 위한 채널이라고 생각한다면, 큰 오산이다. 잘 구축된 홈페이지는 기업의 성장 동력으로 작용할 수 있다.


기술이 비약적으로 발전함에 따라 비즈니스의 디지털화는 선택이 아닌 필수가 되었다. 디지털 시대, 도태되는 기업이 되고 싶지 않다면 통(通)하는 홈페이지를 기획해 매출 확대를 도모해야 한다.



매출을 높이는 홈페이지, 어떻게 구성되어 있을까?


성공적으로 기획된 홈페이지는 심미적으로 아름답거나 기능이 많은 홈페이지가 아니다. 이탈률이 증가하거나 체류 시간이 줄어들면 홈페이지 디자인을 변경하거나 새로운 기능을 추가하려 하는 경우가 많은데, 이것만으로 근본적인 문제를 해결하기에는 역부족이다. 홈페이지가 기업의 관점에서 기획되었기 때문에 발생한 현상일 확률이 높기 때문이다.


고객이 기업의 홈페이지에 기대하는 바는 복잡한 비주얼이나 기능이 아니다. 원하는 정보를 신속하고 편리하게 얻는 것이다. 홈페이지가 고객이 기대하는 가치와 콘텐츠, 디자인으로 구성되어 있을 때 비즈니스에 도움이 되는 홈페이지가 탄생한다.



✅ 가치 전달은 명확하게


잠재 고객이 홈페이지에 방문했을 때 가장 먼저 확인하고자 하는 것은 기업과의 거래로 얻을 수 있는 효용이다. 해당 내용에 대한 정보가 명확하게 제시되어 있지 않다면 고객은 혼란을 느끼고 홈페이지를 떠날 것이다.


많은 기업들이 자사의 제품이나 서비스의 경쟁력을 강조하려 하지만, 고객이 궁금한 것은 따로 있다. 해당 기업의 제품이나 서비스를 선택했을 때 향유할 수 있는 실질적 이점이다. 이러한 측면에서 'Slack‘의 홈페이지는 벤치마킹할 만한 예시가 될 수 있다. 슬랙의 경우, 제품의 기능에 집중하기보다는 제품이 제공할 수 있는 편의와 가치를 강조해 마케팅적 성공을 거뒀다.


슬랙 홈페이지


물론, 기업의 입장에서는 홈페이지에 제품이나 서비스에 대한 모든 정보를 담고 싶을 수밖에 없다. 애정이 남다르기 때문이다. 그러나, 홈페이지로 매출을 높이고 싶다면 모든 정보를 한 번에 전달하려 해서는 안 된다. 너무 많은 정보를 홈페이지에 기재하면 ‘이탈률의 증가’라는 역효과가 발생하기 때문이다.



✅ 디자인은 심플하되, 가독성은 높게


매출이 높은 기업의 홈페이지는 대체로 군더더기 없이 심플하고 깔끔한 디자인을 갖추고 있다. 일부 실무자들은 다양한 테크닉을 활용해 디자인한 홈페이지가 훌륭하다고 생각하고는 하는데, 홈페이지의 본질은 고객이 기업에 대해 궁금해하는 정보를 제공하는 것임을 잊지 말아야 한다.


디자인적으로 욕심을 부려 너무 많은 과도하게 시각적 요소를 추가하고 복잡한 인터페이스를 구현하게 되면, 고객의 관심이 분산되어 이탈률이 높아질 수 있다. 구글의 사례를 떠올려보자. 극도로 단순한 인터페이스지만, 고객이 원하는 검색 기능에 집중하여 긍정적인 사용자 경험을 끌어낼 수 있었다.


그렇다고, 디자인을 고려할 필요가 없다는 의미는 아니다. 데스크톱에서 보이는 페이지가 모바일이나 태블릿 기기에 적합하지 않다면, 반응형 디자인을 통해 기기별로 최적화된 레이아웃을 제공해야 한다.


Statista에 따르면 2023년 기준 전 세계 웹 사이트 트래픽의 약 58%가 모바일 기기에서 발생했다. 모바일이나 태블릿 최적화를 하지 않는다는 것은 절반 이상의 사용자를 포기하겠다는 것과 같다. 가독성이 낮은 페이지는 이탈을 유도하기 때문이다.


Percentage of mobile device website traffic worldwide from 1st quarter 2015 to 4th quarter 2023


✅ 콘텐츠는 페인포인트에 대한 솔루션을 중심으로


고객이 반응하는 콘텐츠들은 페인포인트에 대한 솔루션을 강조한 것이다. 기업들은 종종 고객이 제품이나 서비스를 보기 위해 홈페이지에 방문한다고 착각하지만, 실제 고객은 자신의 문제를 해결하기 위해 홈페이지를 찾는다. 그래서, 홈페이지에 담길 콘텐츠를 기획할 때는 고객이 필요로 하는 정보와 문제에 대한 해결책을 제공해야 한다.


기업이 전하고자 하는 바와 고객이 실제로 알고 싶어 하는 정보 사이에는 갭이 있을 수밖에 없다. 상호 간의 입장 차이가 있으니 말이다. 고객은 특정 제품의 기술 사양보다는 그 제품이 어떠한 방식으로 자신의 문제를 해결해 줄 수 있을지에 더 큰 관심을 가진다.


세일즈포스의 사례를 보면, 어떤 전략이 잘 짜인 콘텐츠 전략인지 알 수 있다. 세일즈포스는 CRM을 단순한 데이터 관리 도구로 포지셔닝하지 않는다. 고객 관계를 강화하고 영업 프로세스를 최적화할 수 있는 솔루션임을 강조한다. 실제로 세일즈포스는 고객이 직면한 페인포인트를 해결해 줄 수 있다는 내용의 콘텐츠를 적극 활용해 고객의 관심을 끌고 신뢰를 형성하는 데 성공했다.


세일즈포스 홈페이지


잘 만든 홈페이지는 복잡하거나 기능이 많은 홈페이지가 아니다. 고객이 원하는 정보를 신속하고 명확하게 제공하는 홈페이지다. 명확한 가치를 전달하고, 정보를 쉽게 발견할 수 있도록 레이아웃을 구성, 페인포인트에 대한 솔루션을 콘텐츠화했을 때 홈페이지의 힘을 실감할 수 있다.




고객의 편의를 고려하면 매출이 높아질까?


홈페이지로 성공을 거둔 기업들의 사례를 살펴보면, 고객의 편의를 극대화하기 위해 노력했다는 점을 알 수 있다. 간혹 메시지와 내용 자체는 홈페이지에 잘 담겼는데, 어째서 이탈률이 높은 것인지 고민하는 실무자들이 있다. 이때는 사용자 경험, 즉 UX에 문제가 있는 것이 아닌지 의심해 보아야 한다.



✅ 이탈률을 줄이는 유저 플로우를 설계하는 방법


유저 플로우란 고객이 홈페이지에서 제품을 구매하거나 기업에 문의할 때까지 거치는 경로를 의미한다. 고객이 원하는 정보를 탐색하고 행동을 취할 때까지 경험하는 흐름이 얼마나 원활한지에 따라 이탈률이 달라진다. 일정이 빠듯할 때는 차트를 그리는 것조차 사치로 느껴질 수 있지만, 이 과정을 건너뛰게 되면 이탈을 방지할 수 있는 장치를 마련하지 못해 곳곳에서 이탈이 발생할 수 있다.


유저 플로우 다이어그램의 예시


만약 고객이 홈페이지를 이용하는 과정에서 불편함을 느낀다면, 지금이 바로 유저 플로우 개선 작업을 고려해야 할 때다. 고객이 구매 결정을 내리기 위해 필요한 정보는 쉽게 찾을 수 있도록 홈페이지를 구성하면서, 최종 행동(구매나 문의)에 이르는 과정을 최적화하면 이탈률을 크게 줄일 수 있다.


최적화된 유저 플로우가 어떻게 이탈을 방지하고 매출을 극대화할 수 있는지 보여주는 대표적인 사례는 아마존이다. 아마존은 UX를 개선하기 위해 유저 플로우를 지속적으로 발전시켰다. 홈페이지에 유입된 고객이 필요로 하는 정보를 손쉽게 찾을 수 있도록 검색 기능과 필터링 시스템을 강화했고, 상품 페이지에서 발생할 수 있는 이탈을 막기 위해 이미지 확대 기능과 구체적인 제품 설명을 추가했다.


이뿐만이 아니다. 이커머스 플랫폼에서 흔히 볼 수 있는 원클릭 결제 기능을 최초로 도입한 것도 아마존이다. 아마존은 1997년 원클릭 기능을 개발하여 1999년 해당 기능에 대한 특허를 획득했다. 2017년 특허가 만료되기 전까지는 아마존의 허가 없이 이 기능을 사용할 수 없었다.


당시 아마존의 원클릭 결제 기능이 혁신으로 받아들여졌는데, 고객이 장바구니에 상품을 추가하고 결제를 완료하는 과정을 간소화해 장바구니에서 발생하는 이탈률을 최소화하고 반복적인 구매를 유도하는 데 성공했기 때문이다.


아마존의 원클릭 결제 시스템


아마존의 사례에서도 볼 수 있듯이, 유저 플로우의 핵심은 홈페이지의 각 섹션에서 고객의 행동을 예측하고, 그들이 자연스럽게 다음 단계로 넘어갈 수 있도록 유도하는 데 있다. 홈페이지의 콘텐츠나 디자인에 문제가 없다고 판단되는 상황에서 지속적으로 이탈이 발생한다면, 유저 플로우에 문제가 없는지 가장 먼저 점검해 보아야 한다.



✅ 클릭을 유도하는 CTA를 만드는 방법


문구 하나, 버튼 하나일 뿐인데 CTA는 홈페이지에서 매우 중요한 역할을 한다. CTA는 웹사이트에서 고객이 원하는 행동을 취하도록 유도하는 핵심 요소다. 이를 효과적으로 설계하면 고객의 즉각적인 행동을 촉구하여 전환율을 높일 수 있다.


CTA를 효과적으로 설계하기 위해서는 고객의 심리를 이해하고, 전략적으로 문구와 배치를 고려해야 한다. 아무런 전략 없이 무작위로 버튼을 삽입하면 혼란을 야기하고 이탈률이 높아질 수 있다. 그렇기 때문에, CTA를 기획할 때는 매우 신중하게 접근해야 한다.


CTA를 영리하게 활용하는 기업 중 하나가 바로 쿠팡이다. 쿠팡은 고객의 심리적 트리거를 자극하는 문구를 통해 즉각적인 행동을 유도한다. 쿠팡이 적극 활용하는 ‘오늘 출발 내일 도착’, ‘와우 회원 전용 할인’, ‘매진임박’, ‘한정수량’, ‘추천상품 구매하기’, ‘최근 본 상품 다시 보기’ 등의 문구는 강력한 혜택과 긴박감, 한정성, 개인의 관심사 등을 반영해 전환율을 높이는 결과를 가져다준다.


쿠팡의 CTA


쿠팡은 CTA의 크기나 배치 역시 중시하는데, 특히 주목할 만한 전략은 ‘장바구니 담기’, ‘즉시 구매하기’ 같은 구매로 직결될 수 있는 버튼을 고객의 시야에서 벗어나지 않게 배치하는 것이다. 이러한 방식은 고객의 구매 과정을 간소화하고 클릭 수를 줄여 구매의 편의성을 높임으로써 전환율을 극대화하는 데 기여한다.


별것 아닌 것처럼 보이지만 CTA는 매우 큰 역할을 한다. 유저 플로우를 검토했음에도 이탈률이 줄어들지 않는다면, 홈페이지에 삽입된 CTA가 고객의 행동을 유도할 만큼 매력적인지 점검해 보자. 분명 개선할 여지를 발견할 수 있을 것이다.



✅ 답답한 로딩속도, 간단하게 개선하는 방법


유저 플로우에서도, CTA에서도 답을 찾지 못했다면 로딩 속도를 확인해 볼 필요가 있다. 느린 로딩 속도에 답답함을 느끼고 페이지를 닫아버리는 고객들이 의외로 많으며, 아무리 유저 플로우나 CTA가 잘 설계되어 있어도 빛을 보지 못할 가능성이 크다.


2017년 구글이 시행한 연구에 따르면, 로딩 시간이 3초, 5초, 10초를 넘길 때 이탈률은 각각 32%, 90%, 123%가 증가한다. 고객이 인내할 수 있는 시간은 5초도 채 되지 않는다는 의미다. 실제로, 월마트의 매출은 로딩 속도를 1초 단축한 후 2% 증가했다.



로딩 속도, 어떻게 개선할 수 있을까?


가장 간편한 방법은 이미지 파일을 최적화하는 것이다. 이미지의 화질을 지나치게 고화질로 설정하면 파일 크기가 커져 로딩 시간이 길어진다. 로딩 시간을 단축하기 위해 이미지를 재설정하는 방법을 알아보자.


PC 기반 웹용 이미지는 1280px, 모바일용 이미지는 420px로 작업하면 로딩 속도가 크게 줄어들 수 있다.


PC/MO 기반 웹용 이미지의 픽셀값


그래도 속도가 충분히 개선되지 않는다면, 이미지 파일 포맷을 WebP로 변경하는 것이 효과적이다. WebP는 더 나은 압축률을 제공해 파일 크기를 줄이면서도 이미지 품질을 유지할 수 있는 포맷이다. WebP가 지원되지 않는 환경이라면, 제작 이미지는 png로, 실제로 보이는 이미지는 jpg로 업로드해도 효과가 있다.


이미지 외에도 Lazy loading(지연 로딩)을 활용해 필요한 이미지만 로드하거나, 코드를 최적화하고, HTTP 요청 수를 줄이며 불필요한 플러그인과 스크립트를 제거하는 것도 로딩 속도 개선에 도움이 된다. 하지만 가장 쉽게 실행하는 방법은 이미지 용량을 최소한으로 압축하는 것이다.


로딩 속도가 이탈률 사이에는 직접적인 연관관계가 있다. 그렇기 때문에, 최적화를 통해 빠르고 효율적인 사이트를 구축하는 것이 필수적이다. 만일 현재 홈페이지 로딩 속도가 느리다면, 먼저 이미지의 용량과 포맷을 변경해 개선을 시도해 보기를 권한다. 이탈률이 줄어들 수도 있으니 말이다.



결국, 매출을 일으키는 홈페이지는 고객의 니즈에 부합하는 정보를 제시하고 긍정적인 사용자 경험을 제공하는 홈페이지다. 홈페이지의 진가를 확인하고 싶다면, 고객이 홈페이지에서 필요한 정보를 쉽고 빠르게 찾을 수 있도록 명확하게 가치를 전달하고, 유저 플로우와 CTA를 촘촘하게 설계해 자연스러운 전환을 유도해야 한다. 홈페이지의 레이아웃과 로딩 속도 등을 개선하여 편의성을 증대해 이탈 방지 장치를 마련해야 하는 것은 물론이다. 이러한 과정이 전제되지 않은 채 마케팅을 비용만 지출하는 결과가 초래될 수 있다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari