공종 공통 · 반응형 홈페이지
반응형 홈페이지는
작은 화면에서도
먼저 연락이 닿게 만듭니다.
‘반응형 홈페이지’ 검색에 내 업체 먼저
현장 업종 업체 홈페이지 상담 — 번호만 남기면 접수됩니다.
반응형 홈페이지는 한 주소의 한 쪽이 휴대폰·태블릿·PC 화면 폭에 맞춰 글자 크기와 배치를 스스로 바꾸는 홈페이지입니다. 휴대폰용 주소를 따로 두지 않아 고칠 곳이 한 군데이고, 검색엔진도 주소 하나만 보면 됩니다.
급한 일이 생긴 자리에서 휴대폰으로 업체를 찾는 고객에게는 작은 화면 첫 화면이 곧 홈페이지입니다. 그래서 반응형에서 가장 먼저 볼 것은 휴대폰 첫 화면에 하는 일·가는 지역·연락 버튼이 잘리지 않고 보이는지입니다. MATZIP.TODAY가 직접 만들어 운영 중인 다섯 사이트도 휴대폰 첫 화면 위쪽에 첫 문장과 상담 버튼을 둡니다.
화면 폭별로 바뀌는 것
같은 쪽이
화면 폭마다 이렇게 바뀝니다.
| 바뀌는 것 | 휴대폰 | PC | 시공·설비업체가 볼 것 |
|---|---|---|---|
| 메뉴 | 버튼 하나 안에 접힘 | 위쪽에 펼쳐 둠 | 메뉴를 열지 않아도 하는 일이 첫 화면에 보이는지 |
| 연락 버튼 | 누르면 바로 전화·문자 | 번호와 문의 양식을 함께 보여 줌 | 손가락으로 누르기 넉넉한 크기와 간격인지 |
| 사진 | 화면 폭에 맞춰 한 줄에 한 장 | 여러 장을 나란히 | 현장 사진이 잘려 중요한 곳이 가려지지 않는지 |
| 표 | 옆으로 밀거나 줄을 접어 보임 | 한눈에 다 보임 | 가는 지역·공종 표가 휴대폰에서 잘리지 않는지 |
| 글 | 줄 길이를 줄이고 글자 크기는 유지 | 한 줄을 길게 | 확대하지 않고 읽히는지, 낱말이 화면 밖으로 밀리지 않는지 |
휴대폰 첫 화면
휴대폰 첫 화면에
이 다섯 가지가 보여야 합니다.
- 업체 이름과 하는 일(공종) 한 줄
- 가는 지역
- 바로 누를 수 있는 전화·문자 버튼
- 눌러도 다른 버튼과 겹치지 않는 간격
- 글자가 화면 밖으로 잘리지 않는 줄바꿈
직접 만든 사이트
직접 만들어 운영 중인
사이트의 휴대폰 첫 화면입니다.
첫 화면 문장: “누수의 흔적이 아니라, 물이 시작된 곳을 찾습니다”
- 첫 화면 버튼: 현장 상담 요청 · 문자 상담 · 출동 가능 지역
- 메뉴: 방수누수 · 공간별 방수 · 증상별 진단 · 출동지역 · 방수상식
- 화면 아래에 늘 보이는 전화 상담 띠
첫 화면 문장: “샤프트와 고압세척이라야 끝까지 뚫립니다.”
- 맨 위 띠: 역류·악취가 진행 중일 때의 연락 안내와 전화번호
- 첫 화면 버튼: 지금 바로 통화 상담 · 문자로 현장사진 보내기
- 메뉴: 특수 장비 안내 · 상업공간 · 공법 · 출동지역 · 자주묻는질문
첫 화면 문장: “막힌 건 배관인데, 멈추는 건 영업입니다.”
- 맨 위 띠: 식당·카페·상가 배관 고압세척 / 서울·경기·인천
- 첫 화면 버튼: 전화번호 · 사진·주소 문자 보내기
- ‘도착 시간은 배차 확인 후 안내’라는 한 줄
- 메뉴: 증상별 안내 · 출장 상권 · 고압세척 · 자주 묻는 질문
첫 화면 문장: “싱크대 아래의 누수, 걱정까지 살피다.”
- 첫 화면 버튼: 내 상황 상담하기 · 증상 먼저 살펴보기
- 메뉴: 누수 증상 확인 · 원인과 해결 안내 · 서비스 지역 · 상담 안내
- 설명용 사진에는 ‘설명 이미지’라고 적어 둠
첫 화면 문장: “거실누수, 아무 데나 뜯기 전에 원인부터 정확하게.”
- 첫 화면 버튼: 문자 상담하기 · 전화 바로 연결
- 첫 화면 요약: 비파괴 탐지 우선 · 원인 확인 후 공사 · 서울 전 지역 출동
- 화면 아래 고정 띠: 증상 상담하기 · 문자 상담 · 전화 연결
다섯 곳 모두 휴대폰 첫 화면 위쪽에 첫 문장과 상담 버튼을 둡니다. 반응형 홈페이지를 볼 때도 PC 화면이 화려한지보다, 휴대폰 첫 화면만 보고 무슨 일을 하는 곳이고 어떻게 연락하는지 알 수 있는지를 봅니다.
KO방수 제작·문의 사례 보기직접 만들어 운영 중인 사이트의 휴대폰 첫 화면 위쪽을 2026-10-01에 캡처했습니다. 문의 기록은 개인정보를 가려 사례 페이지에 일부만 공개했습니다. 과거 사례가 새 홈페이지의 검색노출이나 문의를 보장하지는 않습니다.
공개 전 확인
공개하기 전에
화면 폭마다 이렇게 봅니다.
- 좁은 휴대폰 폭
가장 좁은 휴대폰 화면 폭에서 글자와 버튼이 화면 밖으로 잘리는 곳이 없는지 봅니다.
- 흔한 휴대폰 폭
많이 쓰는 휴대폰 화면 폭에서 첫 화면에 하는 일·지역·연락 버튼이 한 번에 보이는지 봅니다.
- PC 폭
넓은 화면에서 글 줄이 너무 길어지지 않는지, 사진이 늘어나 흐려지지 않는지 봅니다.
- 실제 휴대폰으로 누르기
전화·문자 버튼을 실제 휴대폰으로 눌러 번호가 맞게 걸리는지 확인합니다.
휴대폰 사이트를 따로 두면
휴대폰용 사이트를
따로 두면 생기는 일.
- 고칠 곳이 두 군데가 됩니다
- PC용과 휴대폰용 사이트를 따로 두면 번호·영업시간 하나를 바꿀 때도 두 곳을 고쳐야 하고, 한쪽만 바뀌는 일이 생깁니다.
- 주소가 둘로 갈립니다
- 같은 내용이 두 주소로 나뉘면 검색엔진에 어느 쪽이 대표인지 따로 알려야 합니다. 반응형은 주소가 하나라 이 일이 없습니다.
- 예전 휴대폰 사이트가 남습니다
- 예전에 만든 휴대폰 전용 사이트가 정리되지 않고 남으면 옛 번호나 옛 사진이 계속 보일 수 있어, 개편 때 함께 정리합니다.
자주 묻는 내용
반응형 홈페이지, 자주 묻는 점.
반응형 홈페이지와 모바일 홈페이지는 다른가요?
모바일 홈페이지는 휴대폰용 사이트를 따로 만든 것을 가리킬 때도 있고, 반응형은 한 사이트가 화면 폭에 맞춰 바뀌는 방식입니다. MATZIP.TODAY는 주소 하나로 휴대폰과 PC를 함께 맞추는 반응형으로 만듭니다.
지금 홈페이지를 반응형으로만 바꿀 수 있나요?
지금 사이트의 구조와 계정 상태를 함께 본 뒤 정합니다. 손볼 곳이 많으면 고치기보다 새로 만드는 편이 나을 때도 있어, 두 경우를 나눠 안내합니다.
반응형 홈페이지 제작 비용은 따로 드나요?
휴대폰·PC 화면을 함께 맞추는 일은 제작 범위 안에서 정합니다. 자료와 범위를 확인한 뒤 일회성 제작비를 안내하며 당사가 받는 월 관리비는 없습니다. 상담 신청으로 결제나 계약이 생기지 않습니다.
휴대폰에서 글자가 잘려 보이는데 왜 그런가요?
화면 폭보다 넓게 고정된 표·사진이나 긴 낱말이 있으면 글이 화면 밖으로 밀립니다. 어느 폭에서 잘리는지 화면을 함께 보며 찾습니다.
근거로 삼은 공개 자료
- 표시·광고의 공정화에 관한 법률 제3조(부당한 표시·광고 행위의 금지)거짓·과장, 기만, 부당 비교, 비방 광고 금지 · 2026-10-31 확인
이제, 대표님 홈페이지 이야기
휴대폰 첫 화면, 같이 볼까요?
지금 홈페이지 주소와 하시는 일을 남겨주시면 휴대폰에서 보이는 첫 화면부터 함께 봅니다.