디자인 가이드를 위한 스토리보드 스토리보드(Storyboard)란 본래 영화나 애니메이션, 광고와 같은 영상매체를 만들기 전, 주 요 장면을 사진 혹은 일러스트와 같은 시각적 형태로 정리해 놓은 문서를 의미하며, 영상 매체를 제작하는 과정에서 스텝들 간의 원활한 의사소통을 하기 위해 제작된 문서이다. 스토리보드의 구성 스토리보드는 표지, 개정 이력, 화면 설계, 서비스 흐름도의 구성으로 하며, 프레임의 사 용 여부와 메뉴의 구성 위치, 콘텐츠의 위치 등 전체적인 화면 구성을 보여 주어야 한 다. 이 때 메뉴 구성을 포함한 페이지의 구성은 디자인 요소 중 아주 중요한 부분을 차 지하게 된다 각 페이지의 정보를 요약하며, 저장될 디렉터리, 파일 이름, 페이지 타이틀 등을 메모하 듯이 작성한 후 링크 정보를 ..
태스크 플로우 작성하기 사이트 맵은 웹사이트의 특정 영역을 대표하는 페이지들을 시각적으로 보여주는 것을 의미한다. 회사 조직도처럼 생겼으며 사이트의 수직적인 구조를 보여준다. 태스크 플로우는 사용자들이 웹사이트를 항해하는 중 취하는 경로나 과정을 보여준다. 사용자의 옵션이나 경로를 상세히 보여주기 위해 제작된다 시나리오 기반의 태스크 분석 정의 사용자의 니즈와 요구사항을 기반으로 사용자가 우리 서비스를 이용하여 어떤 작업을 수행하도록 할 것인가 정해야 하는데 이를 태스크(과업)이라고 한다. 이 태스크(과업)을 누가 어떤 상황에서 어떻게 수행하는가를 그리는 과정이 시나리오 작업이다 태스크(과업) 분석은 이 서비스를 통하여 앞에서 정의한 페르소나가 무엇을 할 수 있을지, 사용자들에게 어떤 기능들을 제공할 것..
웹 접근성의 올바른 발전 방향 웹 접근성은 잠시의 유행으로 끝나는 것이 아니라 전 세계적인 흐름이자 반드시 필요한 영역이다. 웹 접근성이 마크업 영역에 머무르지 않고 신기술과 새로운 영역까지 발전해야 한다. 웹 접근성이 신기술을 규제하는 것이 아니라 연구를 통한 접근성 적용이 가능해야 한다. 문제점의 해결 현재 웹 접근성의 문제점 - 마크업 기술 중심, 이는 html과 css 중심의 굴레를 벗어나지 못함 웹 접근성 국제 표준: WCAG 1.0→ WCAG 2.0 KWAG 2.1(한국형 웹 콘텐츠 접근성 지침) : 동적인 문서나 애플리케이션 영역에 대한 접근성 영역까지 확장 새로운 기술의 방향 html5와 aria 등 새로운 기술은 웹 접근성을 향상하는 방향으로 발전 화면 낭독기 중심으로 적용하는 접근성 구..
웹접근성에서의 견고성 웹사이트를 만들 때 다양한 기술이나 환경에서도 문제없이 잘 동작하고 오류 없이 정보를 잘 전달할 수 있도록 만들자는 원칙을 말한다. 웹접근성 검사에서 충족해야 할 지침 문법 준수 웹 애플리케이션 접근성 검사항목23. 마크업 오류 방지 개념 웹페이지의 기본이 되는 HTML이나 XHTML과 같은 마크업 언어에서 정한 문법에 맞지 않게 구현한 경우 발생되는 것을 말한다. 필요성 마크업 언어의 문법 오류를 방지함으로써 브라우저뿐만 아니라 다양한 보조기구에서 콘텐츠가 문제없이 해석될 수 있도록 제공할 수 있다. 제공방법 기준: 마크업 언어의 요소는 열고 닫음, 중첩 관개 및 속성 선언에 오류가 없어야 함. 이를 오류없이 제공한 경우 준수한 것으로 인정 오류유형 23-1. 태그의 열고 닫음 오..
검사항목19. 콘텐츠 선형구조 개념 콘텐츠 선형구조란 웹 문서를 제작할 때 뼈대가 되는 html 마크업 언어를 말하는 것으로, css제거시 콘텐츠가 상식적인 순서로 제공되고 있는가에 대한 개념이다. 제공방법 기준: 콘텐츠 순서가 논리적으로 선형화되어 제공된 경우 준수한 것으로 인정 오류유형 계층 구조가 명백하게 필요한 콘텐츠를 중첩 마크업을 이용하여 표현하지 않은 경우 '제목-내용'으로 구성된 콘텐츠 목록의 배치가 분리되어 내용을 직관적으로 이해할 수 없는 경우 주의사항 탭메뉴에서 탭1→탭2→탭3으로 이동하여 모든 탭 내용을 확인할 수 있는 경우에도 보다 논리적으로 구성 2단계 깊이를 가진 메뉴에서 1차 메뉴와 2차 메뉴, 탭 메뉴와 탭 콘텐츠는 서로 다른 계층으로 표현되어야 함 탭메뉴와 탭 콘텐츠의 계..
검사항목17. 기본 언어 표시 개념 주로 사용하는 언어를 명시해야 한다. 중간에 언어가 바뀌는 경우 lang 속성을 통해 언어를 바꿔주면 더 이해하기 좋은 사이트가 된다. 필요성 다양한 언어를 공부하거나 이용하는 사용자에게 중요한 지표가 된다. 기본언어 표시는 화면 낭독 프로그램과 같은 보조기기에서 기본 언어에 맞는 TTS(Text To Speech) 엔진을 가동시키는 역할을 한다. 제공방법 기준: 웹페이지에서 주로 사용하는 언어를 html에 lang 속성을 사용하여 제공한 경우 준수한 것으로 인정 오류유형 html에 lang 속성을 명시하거나 잘못 명시한 경우 인코딩 셋은 EUC-KR이나 UTF-8과 같은 화면에 보여주기 위한 문자 세트인 반면 기본 언어는 들려주기 위한 언어 명시이다. 주의사항 기본 ..