■ UI 검토 세부 사항

1. 화면해상도와 레이아웃

2. 그리드시스템 : 공간 규정에 대한 것으로, 페이지 구성 요소에 대한 기능 또는 내용에
의한 화면 영역 분할, 콘텐츠의 분할을 위한 기본 레이아웃 영역을 설정한다.
(1) Top Area : 화면검색, 업무 메뉴 내비게이션, 단축 아이콘 툴바, 기능 및 설정 메뉴
등이 위치하는 영역.
(2) Left Area : 업무메뉴, 처가 메뉴, 배너 등이 위치하는 영역.
(3) Content Area : 업무화면 영역
(4) Footer Area : 콘텐츠영역의 보조영역으로 필요에 따라 생성을 선택적으로 제공하는 영역

3. 메뉴구조 : 고정된 콘텐츠 영역을 확보하여 일관된 배치로 메뉴선택의 편의성을 제공하고 각 업무를 위한 화면으로 원활한 이동이
가능하도록 하여 클릭수(터치수)를 최소화 하고 사용자의 편의성을 강화하는 효과적인 사용자 인터페이스로 메뉴구조를 제공하여야 한다.

4. 컬러 : 컬러는 사용자 인터페이스에 있어서 기능적인 역할뿐 아니라 정체성의 중요한 역할을 수행한다. 일관성을 유지하기 위하여
모든 페이지에 발생하는 이미지 요소 및시스템 컬러를 적용한다. 특별한 서비스나 콘텐츠의 강조 및 특별한 내용을 표현하기 위해서는
컬러 시스템의 강조 색상을 적용할 수 있다.

5. 타이포그래피 : 유형별로 일관성 있는 폰트 및 서식의 표준화가 필요한데 이는 명확한 가독성을 위한 폰트 스타일 즉, 자간, 장평, 패딩,
사이즈 등에 대한 표준이 정립되어야 한다.

6. 버튼 : 버튼의 세부가이드로 위치와 배치기준 그리고 레이블링 등의 디자인스타일에 대한 표준을 정립하여 사용자가 관리 인터페이스(MI)를
직관적으로 이해할 수 있도록 한다.

7. 아이콘 : 직관적인 아이콘을 사용하거나 중요정보는 텍스트와 아이콘을 병행하여 사용 한다.

8. 탭 : UI 화면에서 함께 구성되는 각각의 탭은 인과성, 일련순서, 종속 여부가 없어야 한다.
기본적으로 선택되어 있는 탭은 사용빈도에 따라 혹은 작업 흐름에 준하여 선택되어
있도록 한다.

9. 팝업 : 팝업은 메뉴화면을 보조하는 화면으로 상세 및 부가적 데이터 조회 및 연동데이터 처리 등에 사용한다.

학습 2 UI 구현 표준 수립하기

- UI 구현 표준의 정의
1. 큰 프로젝트에서는 다양한 개발자들이 협업을 통해 각기 개발한 화면들 간에 갖춰야 할
최소한의 공통 규격이 필요한데 이 때 전체 시스템에 공통으로 적용되는 화면 간 이동,
화면 구성 등에 대한 규약을 UI 표준 혹은 표준 UI라고 한다.
2. 표준프레임워크는 웹 또는 어플리케이션 구축 시 화면 구현이 필요한 기능에 대해 기본
적인 화면 표준을 정의하여 개발 및 유지보수를 위한 화면 개발 가이드를 제시한다.

- UI 구현 표준안의 구성 요소
1. UI화면 표준안 : 웹 또는 어플리케이션 구축 시 화면 구현이 필요한 기능에 대해
기본적인 화면 표준을 정의하여 개발 및 유지보수를 위한 화면 개발 가이드를 제시한다.
2. 디렉터리 구성 정의 : 디자인 이미지 디렉터리의 명명 규칙을 나타낸다. 디렉터리 구성
정의는 하나의 예시로써 사용자의 개발환경에 따라 변경 가능하다.
예) Web-root/images/표준코드/이미지파일명 3. 파일 명명규칙 정의
(1) 이미지타입 구분코드 : 이미지의 사용 용도에 따라 유형을 구분하여 파일 명명에
사용한다.

(2) 파일 명명규칙 : 파일 이름은 소문자로 작성하며, 통상적으로 서브시스템 코드와 유형 일련번호의 조합으로 구성한다.
(표준은 하나의 예시로써 사용자의 개발환경에 따라 변경 가능하다.)

- 웹 표준 및 호환성
1. 웹 표준이란 웹의 필수 구성요소인 HTML, CSS, Java sc_ej_ript 등에 대해서 W3C 국제
표준 문법을 정확히 준수하여 웹 문서가 작성되었음을 의미한다.
2. 웹 호환성이란 사용자의 웹브라우저와는 상관없이 웹 콘텐츠가 동등하게 표현되고
웹서 비스가 오류 없이 동작해야함을 말한다. 웹브라우저 간의 호환성 확보를 위해
기본적으로 Cross Browsing 을 지원해야 하며, 액티브X 대체기술 활용 등은 인터넷이
용환경 개선을 위한 방송통신위원회 권장사항을 따르도록 한다.

- 웹 접근성 준수
1. 한국형 웹 콘텐츠 접근성 지침 2.1(Korean Web Content accessibility guidelines
2. 1)은 웹콘텐츠의 접근성을 향상시키기 위한 기술적 규격을 포함하고 있다. 이 표준에서
는 장애 인이 비장애인과 동등하게 웹 콘텐츠에 접근할 수 있도록 웹 콘텐츠를 제작하는
방법에 관하여 기술하고 있다. 이 표준에 포함된 지침들은 웹 콘텐츠 저자, 웹 사이트 설
계 자들이 관련된 지침을 준수하여 접근성(accessibility)을 보장하는 웹콘텐츠를 쉽게
만들수 있도록 도와주기 위하여 기획되었다.