모바일 웹 사이트에서 가장 중요한 것, 페이지 속도!
SEO와 UX의 기본! 이탈 예방을 위한 페이지 속도 최적화하기
안녕하세요 뷰저블입니다. 오늘은 SEO(검색엔진 최적화)와 UX 양쪽 모든 측면에서 중요한 '페이지 속도'에 대해 이야기 나누고자 합니다. 여러분의 모바일 웹 사이트는 페이지를 모두 표시하기까지 몇 초나 걸리나요? 구글 리서치 자료에 따르면 3초 이상 걸리면 53%의 사용자가 떠나며, 표시 속도가 1초에서 7초로 늘어난다면 이탈률은 113%가 된다고 합니다.
관련 구글 아티클
구글은 지난 2012년도에 페이지 스피드가 검색 순위 요인 중 한 가지임을 블로그 등을 통해 공개한 바 있습니다. 구글의 웹 스팸팀과 품질관리팀 책임자 'Matt Cutts(맷 커츠)'씨는 다른 조건이 동일하다는 가정하에 페이지가 느린 것이 랭킹에 영향을 준다고 말한 바 있습니다. 검색엔진 랭킹에 절대적으로 중요한 영향도를 미치지는 않지만 이 외에도 페이지 속도는 너무나 중요합니다. 먼저 사용자 경험을 향상할 뿐만 아니라 서버 부담을 줄여 운영 비용까지 줄여줍니다. 고객만족도를 높이고 전환율은 높아질 것이며 나아가 브랜드에도 매우 긍정적인 영향을 줍니다.
느리면 느릴수록, 사용자는 떠나고 또 떠나갑니다.
Average Fold를 기점으로 급격한 스크롤 도달 저하가 발생혹시 뷰저블 히트맵으로 살펴보았더니, 모바일 웹 페이지의 스크롤 도달률이 Average Fold를 기점으로 급격히 저하하지 않으신가요? 다른 페이지에 비해 이탈률이 너무 높지는 않나요? Above the Fold 영역의 콘텐츠가 사용자를 하단으로 스크롤 도달하도록 이끌지 못하는 경우도 있지만, 그 이전에 모바일 페이지 속도가 너무 느리지는 않은지를 살펴보아야 합니다.
전반적으로 모바일 웹 페이지는 불러오기까지 꽤 오랜 시간이 걸립니다. 어떤 사이트의 경우 10초 이상 인내해야 하는 경우도 있죠. 허나 사용자가 기다려주는 시간은 3초밖에 되지 않습니다. 구글에서 126개 국의 모바일 광고 랜딩 페이지를 약 90만 개나 조사하였더니 다음과 같은 결과가 나왔다고 합니다.
분석 대상 페이지의 70%는 Above the Fold 영역이 표시되기까지 7초 가까이 걸렸음
페이지 내 모든 요소가 표시되기까지 10초 이상 걸렸음
이 결과는 대다수 모바일 사이트가 매우 느리며 다양한 요소로 인해 너무 페이지가 무겁다고 해석할 수 있습니다. 구글은 또한 딥러닝을 통해 페이지 속도와 이탈률, 전환율의 관계를 예측하였는데요 약 90%의 정확성을 갖는다고 합니다.
이미지 출처 : Think with Google / SOASTA Research, 2017페이지 표시 속도가 1초에서 3초로 떨어지면 이탈률 32% 증가
페이지 표시 속도가 1초에서 5초로 떨어지면 이탈률 90% 증가
페이지 표시 속도가 1초에서 6초로 떨어지면 이탈률 106% 증가
페이지 표시 속도가 1초에서 7초로 떨어지면 이탈률 113% 증가
페이지 표시 속도가 1초에서 10초로 떨어지면 이탈률 123% 증가
텍스트, 타이틀, 이미지 등 페이지 내 요소가 400개에서 600개로 늘어나면 전환율은 95% 하락
페이지 속도가 느리면 느릴수록 사용자가 폭발적으로 이탈한다는 것을 알 수 있습니다. 미국과 일본의 산업별 페이지 평균 스피드는 어떻게 될까요? 미국보다 일본이 약 1~2초 정도 더 빠른 것을 알 수 있었습니다. 양쪽 모두 헬스케어, 미디어&엔터테인먼트 분야의 페이지 속도가 가장 빠르네요.
이미지 출처 : Think with Google
이미지 출처 : Think with Google페이지를 가볍게 만들어 속도를 높이는 것이 중요
페이지 속도를 높이기 위해서는 어떻게 해야 할까요? 어떤 부분을 최적화해야 할지 그 원인을 파악하는 것이 무엇보다 중요한데, 먼저 구글에서 가장 추천하는 방법은 페이지 사이즈를 줄이는 것입니다. 구글이 조사한 결과 평균적인 모바일 웹 페이지 사이즈는 아래와 같았다고 합니다.
70% 페이지가 1MB 이상
36% 페이지가 2MB 이상
12% 페이지가 4MB 이상
다시 한번 미국과 일본의 업계 평균 페이지 사이즈를 살펴볼까요? 미국에 비해 일본이 전반적으로 더 높은데 특히 헬스케어 분야는 1.4MB나 높습니다.
이미지 출처 : Think with Google
이미지 출처 Think with Google3G 통신에서 1.49MB를 다운로드하기까지 7초나 걸린다고 합니다. 한국에서는 4G, 5G 등 기술이 발달하였기 때문에 3G 통신에 대해서는 관심을 둘 필요가 없지만 전 세계적으로 보면 여전히 3G를 사용 중인 국가가 일반적입니다. 이 경우 HTML이나 CSS를 HTTP 압축으로 공개하여 사이트 속도를 올리는 방법을 생각해볼 수 있으며 웹 사이트에 게재된 이미지 파일 크기를 줄이는 것도 한 가지 해결방법이 될 수 있습니다.
Pingdom 같은 웹사이트 스피드 테스트 서비스를 이용하면 '어떤 리소스에 몇 초나 소비되는가'를 구체적으로 파악할 수 있습니다. 실제로 뷰저블 웹사이트를 핑덤 툴에서 테스트해보았습니다.
Pingdom에서 뷰저블 웹사이트를 테스트해본 상세 결과 (1)
Pingdom에서 웹사이트를 테스트해 본 상세 결과 (2)여러분의 웹 사이트 속도는 몇 초인가요? 몇 %의 사용자가 페이지 속도로 인해 이탈할까요? 아래 withgoogle.com에서 또한 테스트해볼 수 있습니다. 뷰저블 웹사이트는 5초가 나왔고 이로 인해 19%의 사용자가 떠날 수 있다고 합니다. 허나 다행히도 산업과 비교해보았을 때 'Good'에 위치하며 양호한 상태입니다. 결과가 안 좋게 나왔다면 페이지를 압축하거나 이미지 호환 방식을 변경하는 등 다양한 방안을 강구하여 속도를 높여야겠죠.
Google의 Mobile Website Speed 테스터로 뷰저블 웹사이트를 측정한 결과 (1)
Google의 Mobile Website Speed 테스터로 뷰저블 웹 사이트를 측정한 결과 (2)모바일 페이지는 속도와 사이즈가 무엇보다 중요합니다. UX 디자이너, 마케팅 담당자, 기획자라면 많은 사람들이 지속적으로 모바일 페이지에서의 긍정적인 경험을 달성할 수 있도록 유도해야 합니다.
뷰저블을 통해 서비스 내 사용자 경험(UX)에 영향 끼치는 문제점을 발견하세요.
뷰저블이라면 그 많은 문제점들을 '새로운 비즈니스 기회'로 바꿔드릴 수 있습니다.
경쟁사는 이미 시작했습니다!
UX 데이터 분석을 위한 All in one 툴 : 뷰저블 홈페이지
https://www.beusable.net/
실제 웹 사이트 위에 UX 데이터를 시각화합니다 : 뷰저블리 홈페이지 (베타 기간 무료)
