병원 홈페이지 디자인
글자와 화면의 위계
제목과 본문의 크기 차이를 분명히 하고 진료 시간처럼 자주 찾는 안내를 위쪽에 배치합니다. 사진 위 문구와 버튼은 실제 기기 크기에서 다시 맞춥니다.
모바일 이용 과정
좁은 화면에서 메뉴를 열고 진료 설명을 읽은 뒤 문의까지 가는 순서를 직접 따라갑니다. 긴 표나 고정 버튼이 본문을 가리지 않도록 배치를 조정합니다.
접근성 점검 항목
이미지 대체 글과 키보드 이동, 입력 항목 이름을 점검 범위에 포함합니다. 어떤 기기와 브라우저에서 검수할지는 제작 전에 병원과 합의합니다.
화면이 완성되는 순서
시안 방향 협의
병원 로고와 사진을 바탕으로 색과 글자 분위기가 다른 시안 방향을 제안합니다.
모바일 우선 배치
휴대전화 화면에서 정보 순서를 먼저 만들고 넓은 화면으로 확장합니다.
실제 기기 검수
합의한 휴대전화와 브라우저에서 메뉴 열기와 문의 입력을 직접 시험합니다.
접근성 보완
대체 글이 빠진 이미지와 키보드로 닿지 않는 버튼을 찾아 고칩니다.
디자인 단계에서 협의할 결과물
- 메인·하위 페이지 디자인 시안
- 모바일 화면의 정보 순서
- 기기·브라우저별 검수 결과
디자인 상담에 필요한 것
- 병원 로고 원본과 사용 가능한 사진
- 참고하고 싶은 화면이나 분위기
- 지금 모바일 화면에서 불편했던 점
병원 홈페이지 디자인 자주 묻는 질문
모바일 화면은 언제 확인하나요?
화면 구성을 논의하는 첫 단계부터 모바일의 정보 순서를 함께 만들고, 구현한 화면에서 메뉴와 문의 동작을 다시 검수합니다.
디자인·모바일을 다룬 글
병원 홈페이지 디자인 주제로 묶은 글 70편입니다.
게시글이 많아지는 병원 사이트에 내부 검색이 필요한 시점
병원 사이트의 내부 검색은 게시글 수보다 메뉴와 목록만으로 원하는 글을 찾기 어려운지를 기준으로 도입을 판단합니다. 찾기 어려운 상황을 기록하고 검색 대상과 업체에 요구할 납품 항목을 정하는 절차를 안내합니다.
디자인·모바일·접근성사이트 내부 검색 결과가 없을 때의 안내
사이트 내부 검색에서 결과가 없으면 상태를 쉬운 말로 알리고, 입력 오류로 단정하지 않은 채 재검색과 병원이 확인한 안내 경로를 제시합니다. 병원이 문구와 이동 목적지를 정하고 업체가 구현한 화면의 실제 동작을 확인하는 방법을 정리합니다.
디자인·모바일·접근성작은 화면에서 주요 메뉴가 가려지는 문제의 확인 기준
작은 화면의 주요 메뉴는 기종 이름보다 가려지는 너비에서 배치가 바뀌고 항목을 찾고 조작할 수 있는지로 확인합니다. 키보드 선택 위치의 가림은 별도로 구분해 업체에 수정 화면을 요청합니다.
디자인·모바일·접근성긴 글에서 실제 탐색에 쓰이는 목차 구성
긴 글의 목차는 본문 구획을 설명하는 짧은 제목을 읽는 순서대로 배열하고 해당 구획으로 연결해야 합니다. 업체에는 보조기술이 탐색할 수 있는 제목 구조를 요구하고, 목차 문구와 도착 지점의 대응을 확인합니다.
디자인·모바일·접근성이미지나 색에만 기댄 안내의 점검
이미지나 색에만 기댄 안내는 색·모양·위치 단서를 제외해도 필요한 정보와 행동을 알 수 있는지 점검합니다. 뜻이 사라지는 부분은 업체에 텍스트나 색에 의존하지 않는 식별 표시를 요구하고 수정 화면에서 다시 확인합니다.
디자인·모바일·접근성확대하면 가로로 잘리는 진료시간 표의 설계
확대하면 잘리는 진료시간 표는 요일과 시간을 짝지어 화면 안에 다시 배치하는 안을 우선합니다. 행과 열의 관계가 필요한 표는 표 내부에서 가로로 이동해 끝 칸까지 읽도록 설계합니다.
디자인·모바일·접근성팝업이 예약 버튼을 가리는 병원 홈의 정리 순서
여러 팝업이 예약 버튼을 가리면 예약을 막는 화면부터 기록하고, 공지의 필요성과 표시 방식을 구분해 정리합니다. 수정 뒤에는 예약 버튼을 찾고 실제로 사용할 수 있는지 확인합니다.
디자인·모바일·접근성사진 교체 뒤 캐시 때문에 옛 사진이 보일 때의 확인
사진 교체 뒤 옛 사진이 나타나면 캐시 문제로 단정하지 않습니다. 교체 파일과 화면의 사진 주소, 주소의 응답을 업체에 확인해 교체 누락과 표시 문제를 구분합니다.
병원 홈페이지 디자인 주제별 글 모음
주제마다 먼저 읽을 글과 묶음별 목록, 근거가 된 공식 자료를 한곳에 모았습니다.
지금 화면에서 불편한 곳을 알려 주세요.
휴대전화로 열었을 때 읽기 어려운 페이지 주소를 보내 주시면 상담 때 개선 방향을 함께 안내합니다.
디자인 상담 02-1661-9399메일 문의 양식으로