가게 웹사이트를 사무실 컴퓨터에서 열어 보면 멀쩡한데, 정작 손님은 폰으로 봅니다. 그것도 매장 근처에서 데이터 신호가 약한 채로 열어 보는 경우가 많습니다. 이때 첫 화면이 몇 초씩 비어 있으면 손님은 전화 버튼을 누르기 전에 뒤로 가기를 누릅니다. 이 글은 사장님이 개발 지식 없이도 속도를 직접 재고, 효과가 큰 순서대로 고치는 방법을 정리합니다.
먼저 속도를 재 보세요
감으로 "느린 것 같다"고 하기보다 숫자로 확인하는 편이 빠릅니다. 구글이 무료로 제공하는 PageSpeed Insights에 홈페이지 주소를 넣으면 모바일 기준 결과가 나옵니다. 바로 열려면 무료 도구 모음의 PageSpeed Insights에서 들어가세요. 화면에 나오는 세 가지 지표를 기억해 두세요. 구글이 공식 문서(web.dev)에서 '좋음'으로 안내하는 기준은 다음과 같습니다.
| 지표 | 무엇을 뜻하나 | 좋음 기준 |
|---|---|---|
| LCP | 화면의 가장 큰 사진·제목이 뜨는 시간 | 2.5초 이내 |
| INP | 버튼을 눌렀을 때 반응하는 시간 | 200ms 이내 |
| CLS | 로딩 중 화면이 밀리는 정도 | 0.1 이하 |
방문자가 적은 사이트는 '실제 사용자 데이터' 칸이 비어 있을 수 있습니다. 그럴 때는 아래쪽 '진단' 항목의 시험 측정값을 참고하면 됩니다. 이 값은 실험실 환경에서 나온 추정치이므로, 같은 페이지를 두세 번 재면 조금씩 다르게 나옵니다.
직접 확인하는 방법: 폰으로 5분 테스트
도구 점수와 별개로 실제 폰에서 아래를 해 보세요.
- 와이파이를 끄고 데이터로만 연결한 상태에서 주소를 입력합니다.
- 첫 화면에서 가게 이름과 전화 버튼이 보일 때까지 초를 셉니다.
- 스크롤하는 중에 글자나 버튼이 갑자기 밀리지 않는지 봅니다.
- 전화 버튼을 눌렀을 때 바로 반응하는지 확인합니다.
가능하면 가게에서 가장 신호가 약한 자리에서 해 보세요. 손님이 실제로 겪는 환경에 가장 가깝습니다.
느려지는 흔한 원인과 고치는 순서
대부분의 가게 사이트는 원인이 비슷합니다. 효과가 큰 순서로 정리했습니다.
1. 사진 용량이 너무 큽니다
휴대폰으로 찍은 원본 사진을 그대로 올리면 한 장이 수 MB가 되기도 합니다. 화면에 작게 보이는 사진도 원본 크기로 내려받습니다. 사진을 올리기 전에 가로 1,600px 안팎으로 줄이고, 가능하면 WebP나 JPG로 저장하세요. 첫 화면 아래에 있는 사진은 '지연 로딩(lazy loading)'을 켜면 스크롤할 때 불러옵니다. 웹사이트 빌더에는 대개 이 옵션이 있습니다.
2. 첫 화면에 영상이나 슬라이드쇼를 넣었습니다
자동 재생 배경 영상과 큰 슬라이드는 가장 무거운 요소입니다. 멋은 있지만 폰에서는 첫 화면이 늦게 뜨는 대가를 치릅니다. 영상은 클릭해야 재생되게 하고, 첫 화면은 사진 한 장과 전화 버튼으로 가볍게 두는 것을 권합니다.
3. 외부 위젯과 스크립트가 많습니다
채팅 위젯, 예약 플러그인, SNS 피드, 지도, 분석 도구가 각각 외부 파일을 불러옵니다. 지금도 쓰는 것인지 하나씩 점검하고, 쓰지 않는 것은 지웁니다. 지도는 페이지 맨 아래 '오시는 길'에만 두는 방법이 있습니다.
4. 글꼴을 너무 많이 씁니다
한글 웹폰트는 파일이 커서 특히 느려지기 쉽습니다. 글꼴은 한 가지, 굵기는 두 가지 이내로 줄이면 부담이 크게 줄어듭니다.
5. 화면이 밀립니다 (CLS)
사진 크기가 정해지지 않았거나, 늦게 뜨는 배너가 위쪽에 끼어들면 글자가 밀립니다. 손님이 누르려던 전화 버튼이 순간 아래로 내려가 엉뚱한 곳을 누르게 됩니다. 사진에는 가로·세로 크기를 지정하고, 팝업 배너는 화면 위쪽에 끼어들지 않게 합니다.
업종별로 먼저 볼 곳
| 업종 | 가장 흔한 원인 | 먼저 할 일 |
|---|---|---|
| 식당·카페 | 음식 사진 수십 장, PDF 메뉴판 | 사진 압축, 메뉴를 글자 페이지로 |
| 미용·네일 | 전후 비교 사진, 인스타 피드 위젯 | 사진 압축, 피드 위젯 제거 |
| 학원·병원 | 예약 플러그인, 채팅 위젯 | 쓰지 않는 위젯 정리 |
| 부동산·융자 | 상담 폼 스크립트, 큰 배너 | 배너 크기 줄이기 |
메뉴를 PDF나 사진으로 올렸다면 속도와 검색 양쪽에서 손해입니다. 글자 메뉴로 바꾸는 방법은 메뉴판을 온라인에 올리는 올바른 방법에서 다뤘습니다.
속도 개선 점검표
- [ ] PageSpeed Insights에서 모바일 결과를 캡처해 '고치기 전' 기록을 남겼다
- [ ] 올린 사진을 가로 1,600px 안팎으로 줄였다
- [ ] 첫 화면 아래 사진에 지연 로딩을 켰다
- [ ] 자동 재생 영상·큰 슬라이드를 첫 화면에서 뺐다
- [ ] 쓰지 않는 플러그인·위젯을 지웠다
- [ ] 글꼴을 한 가지로 줄였다
- [ ] 폰 데이터 연결에서 전화 버튼이 바로 눌린다
- [ ] 고친 뒤 다시 재서 '고치기 후' 기록을 남겼다
주의할 점
점수 100점을 목표로 삼지 마세요. 점수를 올리려고 사진을 지나치게 줄이거나 필요한 기능을 빼면 손님이 보기에는 오히려 나빠집니다. 기준은 '손님이 폰에서 원하는 정보와 전화 버튼을 빨리 만나는가'입니다. 또한 속도는 순위를 결정하는 여러 요소 중 하나일 뿐, 속도만 고쳐서 검색 순위가 오른다고 보장할 수는 없습니다. 다만 느려서 손님이 떠나는 문제는 확실히 줄일 수 있습니다.
속도를 고친 뒤에도 전화가 늘지 않는다면 첫 화면 구성이 원인일 수 있습니다. 점검법은 홈페이지 방문자는 있는데 전화가 안 오는 이유를, 웹사이트 전체 흐름은 가게 웹사이트 완전 가이드를 참고하세요.
자주 묻는 질문
모바일 속도 점수가 몇 점이면 괜찮은가요?
점수 자체보다 LCP 2.5초, INP 200ms, CLS 0.1 이하라는 세 지표의 '좋음' 기준에 들어오는지를 보세요. 점수는 측정할 때마다 조금씩 달라지므로 두세 번 재서 경향을 보는 것이 좋습니다.
사이트 속도가 구글 순위에 영향을 주나요?
구글은 페이지 경험 요소의 하나로 속도를 안내하지만, 내용의 관련성이 더 중요하다고 밝혀 왔습니다. 속도만으로 순위가 오른다고 기대하기보다, 손님이 떠나지 않게 하는 기본 조건으로 보는 편이 현실적입니다.
개발자 없이 제가 직접 고칠 수 있나요?
사진 압축, 영상 제거, 쓰지 않는 위젯 삭제는 대부분 직접 할 수 있습니다. 글꼴 교체나 코드 수정이 필요한 부분은 웹사이트 빌더의 설정을 먼저 확인하고, 어려우면 제작한 곳이나 전문가에게 요청하세요.
고친 뒤 얼마나 지나서 다시 재야 하나요?
수정 직후 바로 다시 재도 시험 측정값은 반영됩니다. 반면 '실제 사용자 데이터'는 최근 약 28일 방문 기록을 모으므로 변화가 보이기까지 시간이 걸립니다.