디자인·모바일·접근성

01먼저 읽을 글

02디자인 방향과 시안 결정

디자인 방향과 첫 화면의 강조 순서를 정하고, 여러 시안 가운데 하나를 선택해 수정 요청과 변경 승인까지 진행하는 기준을 정리합니다.

03색·글꼴·이미지 표현

색·글꼴·글자 크기·사진·일러스트·아이콘·애니메이션·영상 같은 시각 요소를 어떤 범위로 쓰고 매체와 언어에 따라 어떻게 맞출지 정리합니다.

04모바일 화면과 메뉴 구성

모바일 첫 화면의 정보 순서와 버튼·메뉴·팝업·표 배치, 화면 크기별 확인과 속도 검수 방법을 정리합니다.

05접근성 기준과 확인 방법

고령 환자와 색약 환자를 위한 읽기 조건, 화면 낭독기·키보드 확인, 대체 텍스트, 접근성 인증과 법적 의무의 확인 순서를 정리합니다.

06탐색·문구·입력 양식

내부 검색과 목차, 외국어 이동 같은 탐색 경로와 버튼·링크 문구, 입력 양식과 오류 메시지를 알기 쉽게 설계하는 방법을 정리합니다.

07검수·규칙집·운영 관리

납품 검수와 직원·환자 의견 수집, 시안과 완성 화면의 차이 확인, 규칙집과 디자인 파일 보관, 부분 개편과 재설계 시점을 정리합니다.

08공식 기관 자료

이 주제의 글들이 근거로 삼은 공식 문서입니다. 원문에서 직접 확인할 수 있습니다.

• W3C웹 접근성 소개

  웹 접근성이 무엇이고 왜 필요한지 기본 개념을 한국어로 확인할 때 참고하는 W3C 자료입니다.

• W3CWeb Content Accessibility Guidelines (WCAG) 2.2

  업체에 접근성 적용 기준을 요구하거나 수정 결과를 대조할 때 근거로 확인하는 국제 웹 콘텐츠 접근성 지침 원문입니다.

• Google web.dev반응형 웹 디자인 기본사항

  화면 크기에 따라 배치가 달라지는 반응형 웹 디자인의 기본 원리를 이해하고 모바일 검수 기준을 정할 때 참고합니다.

• 디지털정부 디자인 시스템KRDS

  공통 요소와 화면 구성의 기준을 정리할 때 국내 디자인 시스템 자료로 참고합니다.

• Google 검색 센터Google 페이지 경험에 대해 이해하기

  페이지 경험에 대한 Google 검색 센터의 설명을 확인해 모바일 속도와 화면 안정성 검수의 배경을 이해할 때 참고합니다.

09이어서 볼 곳