📌화면 설계 - UI 표준 및 지침

 

 

목차

 

 

UI 표준 및 지침

UI 표준과 지침을 토대로 기술의 중립성(웹 표준), 보편적 표현 보장성(웹 접근성), 기능의 호환성(웹 호환성)이 고려되었는지 확인한다.

 

• UI 표준 : 전체 시스템에 포함된 모든 UI에 공통적으로 적용될 내용으로, 화면 구성이나 화면 이동 등이 포함된다.
• UI 지침 : UI 요구사항, 구현 시 제약사항 등 UI 개발 과정에서 꼭 지켜야 할 공통의 조건을 의미 한다.

 

웹의 3요소는 웹 사이트 개발 시 고려할 사항으로 웹 표준, 웹 접근성, 웹 호환성을 말한다.

 

• 웹 표준 (Web Standards) : 웹에서 사용되는 규칙 또는 기술을 의미하는 것으로 웹 사이트 작성시 이용하는 HTML, JavaScript 등에 대한 규정, 웹 페이지가 다른 기종이나 플랫폼에서도 구현되도록 제작하는 기법 등을 포함한다.
• 웹 접근성 (Web Accessibility) : 누구나, 어떠한 환경에서도 웹 사이트에서 제공하는 모든 정보를 접근하여 이용할 수 있도록 보장하는 것을 의미한다.
• 웹 호환성 (Cross Browsing) : 하드웨어나 소프트웨어 등이 다른 환경에서도 모든 이용자에게 동등한 서비스를 제공하는 것을 의미한다.

 

한국형 웹 콘텐츠 접근성 지침 (KWCAG)

KWCAG : Korea Web Content Accessibility Guidelines

 

한국형 웹 콘텐츠 접근성 지침은 2015년 3월에 미래창조 과학부가 발표한 것으로 장애인이 비장애인과 동등하게 접근할 수 있는 웹 콘텐츠의 제작방법을 제시한다.

 

• '한국형 웹 콘텐츠 접근성 지침'의 목적은 웹 콘텐츠 저작자, 웹 사이트 설계자 등이 접근성이 보장된 웹 콘텐츠를 쉽게 제작할 수 있도록 도와주는 것이다.
• '한국형 웹 콘텐츠 접근성 지침'에는 웹 접근성의 준수 여부를 평가할 수 있는 요구조건과 이를 모두 준수할 경우 얻을 수 있는 기대 효과가 제시되어 있다.

 

웹 콘텐츠 접근성 (사용성) 지침 준수를 위한 고려 사항

 

지침		고려 사항
인식의 용이성	대체 텍스트	텍스트가 아닌 이미지 등의 콘텐츠에는 그 의미를 인식할 수 있는 대체 텍스트를 제공해야한다.
	멀티미디어 대체 수단	동영상, 음성 등 멀티미디어 콘텐츠에 대한 이해도를 높일 수 있도록 대체 수단을 제공해야 한다.
	명료성	콘텐츠는 색이나 명도, 방향, 모양, 크기, 소리 등에 관계없이 명확하게 전달될 수 있어야 한다.
운용의 용이성	키보드 접근성	콘텐츠는 키보드만으로도 접근할 수 있어야 한다.
	충분한 시간 제공	콘텐츠를 읽고 사용하는데 충분한 시간을 제공햐여 한다.
	광과민성 발작 예방	광과민성 발작을 일으킬 수 있는 콘텐츠는 제공하지 않아야 한다.
	쉬운 내비게이션	반복되는 영역은 건너뛸수 있도록 하거나 용도나 목적을 이해할 수 있도록 링크 텍스트를 제공하는 등 콘텐츠를 쉽고 편리하게 내비게이션 할 수 있어야 한다.
이해의 용이성	가독성	콘텐츠는 읽고 이해하기 쉬워야 한다.
	예측 가능성	콘텐츠의 기능과실행 결과는 예측이 가능해야 한다.
	콘텐츠의 논리성	콘텐츠는 선형 구조로 작성되어야 하고 논리적인 순서를 제공해야 한다.
	입력 도움	입력 오류를 방지하거나 정정할 수 있어야 한다.
견고성	문법 준수	웹 콘텐츠는 마크업 언어(Markup Language)의 문법을 준수해야 한다.
	접근성	웹 어플리케이션은 접근성이 있어야 한다.

 

광과민성 발작은 사람이 장시간 불규칙적으로 깜빡거리거나 번쩍이는 빛의 자극으로 인해 발생하는 발작으로, 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠는 제공하지 않아야 한다.

 

내비게션은 사용자가 사이트에서 원하는 정보를 빠르게 찾을 수 있도록 안내하는 것으로 사용자가 중심이 되어야 한다.

 

• 내비게이션은 원하는 정보를 쉽고 빠르게 찾을 수 있도록 다양한 경로나 방법을 제공해야 한다.
• 내비게이션은 메뉴, 사이트 맵 버튼, 링크, 등으로 구성되는데, 이들 구성 요소는 사용자기 직관적으로 찾아 사용할 수 있도록 설계되어야 하고, 사용자가 혼동하지 않도록 전체 페이지에서 일관성이 있어야 한다.
• 내비게이션 구조의 요소
  • 메뉴(단추) : 계층 구조를 표현하는 기본 요소로 사용자가 원하는 페이지로 이동할 수 있게 한다.
  • 링크 : 원하는 페이지로 이동할 수 있게 하는 하이퍼링크를 의미한다.
  • 이미지 맵 : 그림에 하이퍼 링크를 연결하여 원하는 페이지로 이동할 수 있게 한다.
  • 사이트 맵 : 사이트의 전체 구조를 한 눈에 알아볼 수 있도록 트리 구조 형태로 만든 것이다.
  • 사이트 메뉴바 : 사이트의 좌측이나 우측에 메뉴, 링크 등을 모아둔 것이다.
  • 내비게이션 바 : 메뉴를 한 곳에 모아 놓은 그래픽이나 문자열 모음이다.
  • 디렉터리 : 주제나 항목을 카테고리 별로 표현한 방식이다.

 

 

전자정부 웹 표준 준수 지침

'전자정부 웹 표준 준수 지침'은 정부기관의 홈페이지 구축 시 반영해야 할 최소한의 규약을 정의한 것으로, 모든 사람이 시스템 환경에 구애 받지 않고 정부기관의 홈페이지를 이용할 수 있도록 하기 위한 것이다.

 

• '전자정부 웹 표준 지침'에는 이를 준수할 경우의 기대 효과가 제시되어 있다.
• 전자정부 웹 표준 준수 지침 사항

 

내용의 문법 준수	- 모든 웹 문서는 적절한 문서타입을 명시해야 한다. - 명시한 문서타입에 맞는 문법을 준수해야 한다. - 모든 페이지는 사용할 인코딩 방식을 표기해야 한다.
내용과 표현의 분리	- 논리적인 마크업 언어를 사용하여 웹 문서를 구조화 해야 한다. - 사용된 스타일 언어는 표준적인 문법을 준수해야 한다.
동작의 기술 중립성 보장	- 스크립트의 비표준 문법을 확장하는 것은 배제해야 한다. - 스크립트 비 사용자를 위해 대체 텍스트나 정보를 제공해야 한다.
플러그인의 호환성	플러그인은 다양한 웹 브라우저에서 호환되는 것을 사용해야 한다.
콘텐츠의 보편적 표현	- 메뉴는 다양한 브라우저에서 접근할 수 있어야 한다. - 웹 사이트를 다양한 인터페이스로 이용할 수 있어야 한다.
운영체제에 독립적인 콘텐츠 제공	제공되는 미디어는 운영체제에 종속적이지 않은 범용적인 포맷을 사용해야 한다.
부가 기능의 호환성 확보	실명 인증, 전자인증 등의 부가 기능은 다양한 브라우저에서 사용할 수 있어야 한다.
다양한 프로그램 제공	- 정보를 열람하는 기능은 다양한 브라우저에서 사용할 수 있어야 한다. - 별도의 다운로드가 필요한 프로그램은 윈도우, 리눈스 등 2개 이상의 운영체제를 지원해야 한다.