핵심 요약: 소몽애드가 심리상담센터 홈페이지형 블로그의 첫 화면을 설계할 때 쓰는 기준은 하나입니다. 내담자가 인사말을 읽지 않고도 '여기가 내 이야기를 다루는 곳인가, 어떻게 연락하나, 어디에 있나' 세 가지를 확인할 수 있는가입니다. 그래서 카테고리는 센터의 조직도가 아니라 내담자의 질문 순서에서 시작하고, 다섯 칸을 넘기지 않으며, PC와 모바일에 보이는 칸 수를 따로 정합니다.
소장님이 화면을 돌려 보여 주신 블로그 첫 줄에는 칸이 아홉 개 있었습니다. 맨 앞은 센터 소개였고 그 안에 인사말과 연혁이 들어 있었습니다. 어떤 이야기를 다루는 곳인지는 여섯 번째 칸을 눌러야 나왔습니다.
상담을 찾는 사람은 검색 결과를 한 번에 여러 개 열어 둡니다. 첫 화면은 읽히지 않고 훑어집니다. 칸 이름 하나가 길을 안내하지 못하면 다음 탭으로 넘어갑니다.
그래서 카테고리를 정하는 일은 디자인이 아니라 순서를 정하는 일입니다. 무엇을 앞에 둘지는 센터가 알리고 싶은 순서가 아니라 내담자가 확인하는 순서로 결정됩니다.
내담자가 첫 화면에서 가장 먼저 찾는 것은 무엇인가요?
세 가지입니다. 여기가 내 문제를 다루는 곳인지, 연락은 어떻게 하는지, 어디에 있는지. 소개와 연혁은 이 셋을 확인한 다음에 읽히는 정보이고, 셋이 확인되지 않으면 소개는 아예 열리지 않습니다.
상담은 간판만으로 무엇을 하는 곳인지 설명되지 않는 업종입니다. 같은 심리상담센터라도 성인 개인상담이 중심인 곳과 아동·청소년이 중심인 곳은 찾아오는 사람이 다릅니다.
첫 화면이 이 구분을 대신해 주지 못하면 내담자는 전화로 물어야 하고, 전화 자체가 부담인 사람은 묻지 않고 나갑니다.
다섯 칸은 어떤 기준으로 나누나요?
내담자의 질문 순서대로 나눕니다. 상담 주제, 상담사와 자격, 이용 안내, 상담 신청, 오시는 길 다섯 칸이면 첫 화면에서 나올 질문이 대부분 덮입니다. 센터 소개는 별도 칸이 아니라 상담사 칸 안쪽에 두는 편이 자연스럽습니다.
칸을 여섯, 일곱으로 늘리면 훑는 시선 안에서 이름들이 서로를 지웁니다. 접수 자체를 어떤 순서로 받을지는 화면 구조와 다른 문제라 이 글에서는 다루지 않습니다.
칸 이름에는 내담자가 실제로 쓰는 말을 넣습니다. '프로그램'보다 개인상담·부부상담·아동청소년상담처럼 검색창에 그대로 입력되는 말이 좋습니다.
다만 지역명까지 칸 이름에 밀어 넣으면 이름이 길어져 모바일에서 줄이 바뀌고, 누르는 대상이 아니라 읽는 문장이 됩니다. 지역명은 칸 이름이 아니라 첫 화면 소개 문장과 오시는 길 칸 안에 둡니다.
첫 화면의 다섯 칸은 플레이스와 짝을 이룰 때 제 역할을 합니다. 어느 쪽으로 들어와도 같은 다섯 가지를 확인할 수 있어야 합니다.
PC와 모바일은 왜 따로 만들어야 하나요?
가로 폭이 달라 한 줄에 들어가는 칸 수가 다르기 때문입니다. PC에서 한 줄에 놓인 다섯 칸이 모바일에서는 두세 칸으로 접히거나 마지막 칸이 잘려 보이지 않습니다.
모바일에서는 상담 신청 칸이 아래로 밀리기 쉬우므로, 세로로 접혔을 때 첫 줄에 상담 주제와 상담 신청이 함께 놓이도록 순서를 조정합니다. 두 화면이 따로 관리된다는 점과 메뉴 위치는 네이버 블로그 고객센터의 스킨·레이아웃 안내가 출처이고, 화면은 개편될 수 있어 작업 직전에 한 번 확인합니다(2026년 9월 확인 기준).
또 하나, 홈페이지형 스킨은 칸 이름이 이미지 안 글자인 경우가 많습니다. 이미지 속 글자는 검색에 읽히지 않으므로, 같은 문장을 소개란이나 고정 글에 텍스트로 한 번 더 남겨 둡니다. 화면 형태별 제작 범위는 기관 홈페이지 제작에서 이어집니다.
검색으로 들어온 사람은 글 한 편만 보고 나갑니다. 첫 화면 카테고리는 그 한 편에서 다음 칸으로 넘어갈 통로를 만드는 장치입니다.
연락 수단은 화면 어디에 두나요?
두 곳입니다. 첫 화면 하단 고정 영역과 개별 글 말미입니다. 두 자리의 역할이 다릅니다. 첫 화면 하단은 카테고리를 훑다가 마음을 정한 사람을 받는 자리이고, 글 말미는 검색으로 글 하나에 바로 들어와 첫 화면을 아예 거치지 않은 사람을 받는 자리입니다.
뒤쪽을 빠뜨리는 경우가 많습니다. 첫 화면에만 연락 수단을 두면 글 하나에 도착한 사람은 그것을 보지 못한 채 나갑니다. 글 말미의 연락 안내는 매번 같은 문장, 같은 위치여야 합니다. 글마다 문구가 다르면 어느 쪽이 최신인지 내담자가 판단해야 합니다.
같은 판단을 업종 전체로 넓혀 본 것이 심리상담센터 홍보 안내이고, 운영 위탁 범위는 블로그 운영 대행 쪽에 있습니다.
첫 화면에서 가장 자주 바뀌는 것이 대표 사진과 오시는 길입니다. 이 둘은 바꾸기 쉬운 자리에 두고, 나머지 칸은 한번 정하면 오래 유지합니다.
첫 화면 구성 점검표
아래 표는 지금 쓰는 첫 화면을 열어 놓고 한 줄씩 대조하는 항목입니다.
| 점검 항목 | 확인 기준 |
|---|---|
| 첫 칸 | 인사말·연혁이 아니라 상담 주제로 시작하는가 |
| 칸 수 | 다섯 칸을 넘지 않는가 |
| 칸 이름 | 내담자가 검색창에 그대로 입력하는 말인가 |
| 지역명 위치 | 칸 이름이 아니라 소개 문장·오시는 길에 있는가 |
| 모바일 첫 줄 | 접혔을 때 상담 주제와 상담 신청이 함께 보이는가 |
| 이미지 속 글자 | 같은 문장이 텍스트로도 한 번 더 남아 있는가 |
| 연락 안내 | 첫 화면 하단과 글 말미 두 곳에 같은 문장으로 있는가 |
첫 화면은 센터를 설명하는 자리가 아니라, 아직 이름을 밝히고 싶지 않은 사람이 아무 흔적도 남기지 않고 필요한 것만 확인하고 나갈 수 있도록 비켜서 주는 자리입니다.
자주 묻는 질문
Q. 심리상담센터 홈페이지형 블로그의 카테고리는 몇 칸이 적당한가요?
다섯 칸을 기준으로 잡습니다. 상담 주제, 상담사와 자격, 이용 안내, 상담 신청, 오시는 길입니다. 여섯 칸을 넘어가면 훑어보는 시선 안에서 칸 이름들이 서로를 지워 어느 것도 눈에 남지 않습니다.
Q. 센터 소개는 첫 칸에 두면 안 되나요?
첫 칸보다는 상담사와 자격 칸 안쪽이 자연스럽습니다. 내담자가 첫 화면에서 먼저 확인하는 것은 여기가 내 문제를 다루는 곳인지, 연락은 어떻게 하는지, 어디에 있는지 세 가지이고 소개는 그 뒤에 읽히기 때문입니다.
Q. 카테고리 이름에 지역명을 넣어야 하나요?
칸 이름에는 넣지 않는 쪽이 좋습니다. 이름이 길어져 모바일에서 줄이 바뀌고 누르는 대상으로 보이지 않게 됩니다. 지역명은 첫 화면 소개 문장과 오시는 길 칸 안에 두는 것이 읽히기에도 검색에도 자연스럽습니다.
Q. PC 스킨만 만들고 모바일은 그대로 둬도 되나요?
가로 폭이 달라 한 줄에 들어가는 칸 수가 다르므로 따로 정해야 합니다. PC에서 한 줄에 놓인 다섯 칸이 모바일에서는 접히거나 마지막 칸이 잘립니다. 모바일에서는 접힌 첫 줄에 상담 주제와 상담 신청이 함께 보이도록 순서를 조정합니다.
Q. 연락처는 첫 화면에만 적어도 되나요?
첫 화면 하단과 개별 글 말미 두 곳에 같은 문장으로 둡니다. 두 자리가 받는 사람이 다르기 때문입니다. 첫 화면 하단은 카테고리를 훑다가 마음을 정한 사람을, 글 말미는 검색으로 글 하나에 바로 들어온 사람을 받습니다.