반응형 홈페이지 제작의 핵심은 휴대폰 화면에서도 PC와 같은 내용이 빠짐없이 보이게 하는 것입니다. 구글은 모바일 버전의 쪽을 기준으로 색인하므로, 휴대폰에서 숨긴 글·표·구조화 데이터는 검색에서도 없는 것으로 다뤄질 수 있습니다. LJH는 360px과 390px 폭에서 잘린 글자가 없는지, 핵심 웹 지표가 기준 안에 드는지 확인한 뒤 공개합니다.
휴대폰 화면이 검색의 기준이 되었습니다.
구글의 모바일 중심 색인 안내는 휴대폰과 PC에서 같은 주요 콘텐츠, 같은 제목과 설명, 같은 구조화 데이터를 쓰라고 권합니다. 휴대폰에서 글을 접어 두는 것은 괜찮지만 아예 빼 버리면 그 내용은 색인되지 않을 수 있습니다. 반응형 방식은 주소 하나로 두 화면을 처리하므로 이 조건을 맞추기 쉬운 방식입니다.
- 휴대폰 화면에서 빠진 문단·표·자주 묻는 질문이 없는지
- viewport 설정이 들어 있어 휴대폰에서 글자가 작아지지 않는지
- 휴대폰과 PC의 제목·설명·구조화 데이터가 같은지
- 휴대폰에서만 뜨는 큰 팝업이 본문을 가리지 않는지
화면 폭별 점검표
| 화면 폭 | 대표 기기 | 확인할 것 |
|---|---|---|
| 360px | 작은 안드로이드 휴대폰 | 버튼·표 안 글자가 잘리거나 가로로 넘치지 않는지 |
| 390px | 최근 아이폰 | 첫 화면에 쪽 제목과 핵심 문장이 들어오는지 |
| 768px | 태블릿 세로 | 두 칸 배치가 어색하게 끊기지 않는지 |
| 1280px 이상 | 노트북·PC | 글 한 줄이 지나치게 길어 읽기 힘들지 않은지 |
반응형이라도 느리면 휴대폰에서 먼저 떠납니다.
구글은 핵심 웹 지표로 쪽의 사용 경험을 잽니다. 가장 큰 콘텐츠가 보이는 시간(LCP) 2.5초 이내, 입력에 반응하는 시간(INP) 200밀리초 이하, 화면이 밀리는 정도(CLS) 0.1 이하를 좋은 기준으로 둡니다. 큰 이미지를 휴대폰에도 그대로 내려보내면 반응형이어도 LCP가 늦어집니다.
자주 묻는 질문
반응형 홈페이지와 모바일 홈페이지를 따로 만드는 것은 무엇이 다른가요?
따로 만들면 주소가 둘이 되어 같은 내용을 두 번 관리하고, 서로 연결하는 설정도 필요합니다. 반응형은 주소 하나로 두 화면을 처리해 관리와 검색 설정이 단순합니다.
기존 홈페이지를 반응형으로 바꾸면 검색 순위가 떨어지나요?
주소와 내용이 그대로라면 순위가 떨어질 이유는 적습니다. 바꾸는 과정에서 휴대폰 화면의 글을 빼거나 주소를 바꾸면 그 쪽의 검색 기록이 흔들릴 수 있으니 바꾸기 전 목록을 남겨 둡니다.
반응형 홈페이지 제작 비용은 무엇에 따라 달라지나요?
쪽 수보다 표·비교표·예약 양식처럼 휴대폰에서 다시 배치해야 하는 요소의 수가 비용을 더 크게 바꿉니다.
네이버도 휴대폰 화면을 기준으로 보나요?
손님이 휴대폰으로 찾아오는 업종이라면 어느 엔진이든 휴대폰 화면을 기준으로 만드는 편이 안전합니다. 네이버가 권하는 화면 기준은 서치어드바이저 안내에서 함께 확인합니다.
아래 링크는 각 회사가 공개한 안내입니다. LJH의 제휴·인증·성과를 뜻하지 않습니다.Google 검색 센터: 모바일 중심 색인 생성 권장사항 ↗Google 검색 센터: Core Web Vitals 및 Google 검색결과 이해하기 ↗Google 검색 센터: Google 페이지 경험 이해하기 ↗네이버 서치어드바이저: 콘텐츠 마크업(제목·설명·오픈 그래프) ↗