사용자 평가 도구의 이해 화면낭독기, 스크린 리더 화면낭독기의 이해 및 사용법 화면낭독기, 스크린리더와 같은 명칭의 프로그램은 윈도우 컨트롤, 응용프로그램, 웹에 제공된 정보를 시각장애인이 귀로 들을 수 있도록 음성으로 전환 스크린리더 웹페이지에 없는 정보를 스스로 판단해서 음성으로 생산하는 것이 아니라 웹 개발자에 의해 제공된 정보만 음성 정보로 제공 가상커서 스크린 리더에서 인터넷 브라우저를 지원하기 위해 사용하는 개념으로 화면에 표시되지 않는 가상의 UI 중복 테스트 스크린리더는 제품마다 최신기술 지원 여부와 동작방식에 일부 차이가 있으므로 2개 정도의 제품으로 중복 테스트를 하는 것을 권장
웹 디자인의 정보 정보디자인(Information Design), 유저 인터페이스 디자인(User Interface Design), 그래픽 디자인(Graphic Design), 컴퓨터그래픽(Computer Design) 운영 등 필요 지식을 기반으로 정보를 계층화하고 설계해야한다. 웹 디자인 정보 구조화 체계화된 정보 체계를 연결시키는 작업으로, 일반적으로 웹사이트 구조에서는 하향식 계층 구조를 갖는 것이 특징이다. 웹사이트의 계층 구조 중에서 좁고 깊은 계층구조는 사용자의 접근성이 떨어지며, 넓고 얇은 계층 구조는 하나의 페이지에 너무 많은 양의 정보를 담고 있어 복잡하고 콘텐츠가 빈약하게 보아는 단점이 있다. 가장 적절한 계층구조는 폭(Width)은 최소5개에서 최대 9개까지의 메뉴((Function..
디자인 가이드를 위한 스토리보드 스토리보드(Storyboard)란 본래 영화나 애니메이션, 광고와 같은 영상매체를 만들기 전, 주 요 장면을 사진 혹은 일러스트와 같은 시각적 형태로 정리해 놓은 문서를 의미하며, 영상 매체를 제작하는 과정에서 스텝들 간의 원활한 의사소통을 하기 위해 제작된 문서이다. 스토리보드의 구성 스토리보드는 표지, 개정 이력, 화면 설계, 서비스 흐름도의 구성으로 하며, 프레임의 사 용 여부와 메뉴의 구성 위치, 콘텐츠의 위치 등 전체적인 화면 구성을 보여 주어야 한 다. 이 때 메뉴 구성을 포함한 페이지의 구성은 디자인 요소 중 아주 중요한 부분을 차 지하게 된다. 각 페이지의 정보를 요약하며, 저장될 디렉터리, 파일 이름, 페이지 타이틀 등을 메모하 듯이 작성한 후 링크 정보를..
태스크 플로우 작성하기 사이트 맵은 웹사이트의 특정 영역을 대표하는 페이지들을 시각적으로 보여주는 것을 의미한다. 회사 조직도처럼 생겼으며 사이트의 수직적인 구조를 보여준다. 태스크 플로우는 사용자들이 웹사이트를 항해하는 중 취하는 경로나 과정을 보여준다. 사용자의 옵션이나 경로를 상세히 보여주기 위해 제작된다. 시나리오 기반의 태스크 분석 정의 사용자의 니즈와 요구사항을 기반으로 사용자가 우리 서비스를 이용하여 어떤 작업을 수행하도록 할 것인가 정해야 하는데 이를 태스크(과업)이라고 한다 이 태스크(과업)을 누가 어떤 상황에서 어떻게 수행하는가를 그리는 과정이 시나리오 작업이다. 태스크(과업) 분석은 이 서비스를 통하여 앞에서 정의한 페르소나가 무엇을 할 수 있 을지, 사용자들에게 어떤 기능들을 제공할..
1. 웹 접근성의 올바른 발전 방향 웹 접근성은 잠시의 유행으로 끝나는 것이 아니라 전 세계적인 흐름이자 반드시 필요한 영역 적용방법 웹 접근성이 마크업 영역에 머무르지 않고 , 신기술과 새로운 영역까지 발전 웹 접근성이 신기술을 규제하는 것이 아니라 연구를 통한 접근성 적용이 가능 2. 새로운 기술의 방향 HTML5와 ARIA 등 새로운 기술은 웹 접근성을 향상하는 방향으로 발전 제공방법 화면 낭독기 중심으로 적용하는 접근성 구현 방식이 프로그래밍을 통해 해결 접근성은 UX와 함께 연계하여 발전할 때 공감할 수 있는 방향으로 전환 3. 모바일 접근성 국내의 모바일 애플리케이션 접근성 지침은 7개의 준수항목과 8개의 권고항목으로 구성 제공방법 모바일 애플리케이션 접근성 지침의 업데이트가 필요하며, 한국형..
1. 마크업 오류 방지 웹페이지의 기본이 되는 HTML이나 XHTML과 같은 마크업 언어에서 정한 문법에 맞지 않게 구현한 경우 발생되는 것 필요성 마크업 언어의 문법 오류 방지 오류를 방지하는 방법 태그를 열었다면 반드시 닫아주어서 오류를 방지함 태그를 중첩되도록 제공하지 않음 태그의 중복 : 속성의 중복으로 기능의 오류를 일으키지 않음 열고 닫음, 중첩 오류, 속성 중복에 대한 주요 오류 메시지 (end tag for, duplicate specification of attribute, already defined) 2. 웹 애플리케이션 접근성 제목셀과 내용셀을 짝지어 읽게 하거나 표에 대한 설명 정보를 미리 확인할 수 있도록 함 제공방법 플래시, 실버라이트, 자바 애플릿 등 웹 애플리케이션에 대해서..
1. 콘텐츠 선형구조 웹 문서를 제작할 때 뼈대가 되는 HTML 마크업 언어 제공방법 반드시 제목과 내용 순이 아니라, 직관적으로 내용을 이해할 수 있는 형태로 구성되어 콘텐츠를 선형화하였을 때 이해가 용이하도록 제공 제목과 내용이 연속되어 있는 구조인 경우, 제목에 해당하는 내용임을 인식할 수 있도록 순서대로 구성(구조 : 제목 + 내용) 논리적인 순서에 맞게 개발 -> CSS 적용 : CSS 제거 시 콘텐츠가 상식적인 순서로 제공되고 있는가? 2. 표의 구성 제목셀과 내용셀을 짝지어 읽게 하거나 표에 대한 설명 정보를 미리 확인할 수 있도록 함 데이터 테이블과 레이아웃용 테이블 데이터 테이블: 제목, 요약과 함께 제목 셀, 내용 셀을 구분 레이아웃용 테이블 : 표의 제목, 요약 및 제목 셀과 내용 셀..
1. 기본언어 표시 기본 언어 표시는 주로 사용하는 언어를 명시해야 함 필요성 다양한 언어를 공부하거나 이용하는 사용자에게 중요한 지표 제공방법 웹페이지에서 주로 사용하는 언어를 html에 lang속성을 사용하여 제공한 경우 준수한 것으로 인정 2. 사용자 요구에 따른 실행 사용자가 의도하지 않은 기능(새 창, 초점 변화 등)은 실행되지 않아야 함 사용자가 의도하지 않은 기능이 자동 실행되지 않도록 제공한 경우 준수한 것으로 인정 3. 웹 접근성 관련 용어 페이지 제목이 콘텐츠의 내용을 나타내야 함(모든 제목에는 그 페이지의 유일한 제목을 제공하여 구별) 웹접근성의 넓은 의미 본적인 정의나 기대효과 웹접근성의 지침 ‘장애인 접근성’ 중심으로 현재까지 Active-X 사용 시각장애인 등 다양한 장애유형별 ..