본문 바로가기
휴지통/정보처리기사

012. UI 표준 및 지침

by 신재권 2022. 1. 2.

UI 표준 및 지침

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

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

웹의 3요소

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

한국형 웹 콘텐츠 접근성 지침(KWCAG : Korean Web Content Accessibility Guidelines)

한국형 웹 콘텐츠 접근성 지침은 장애인이 비장애인과 동등하게 접근할 수 있는 웹 콘텐츠의 제작 방법을 제시

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

내비게이션(Navigation)

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

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

전자정부 웹 표준 준수 지침

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

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

'휴지통 > 정보처리기사' 카테고리의 다른 글

014. UI 요구사항 확인  (0) 2022.01.02
013. UI 설계 도구  (0) 2022.01.02
011. 사용자 인터페이스  (0) 2022.01.02
011. 사용자 인터페이스  (0) 2022.01.01
010. 주요 UML 다이어그램  (0) 2022.01.01