르 푸 노 트Eat Study Record♥

디자인 가이드 구성 서비스, 제작물의 통합적인 아이덴티티를 고려하여 디자인 가이드를 조합할 수 있다. 콘셉트와 트랜드 디자인 리서치(Design Research) 디자인을 기획하기 전에 과학적 연구의 방법과 도구를 기반으로 자료를 수집하고 분석하는 활동이다. 영국 왕립예술대학의 크리스토퍼 프레이링(Sir Christopher Fryling) 경은 디자인 리서치를 3가지의 중요 분류로 제안하였다 디자인에 투입되는 리서치 디자인을 통한 리서치 디자인을 위한 리서치 비주얼 콘셉트(Visual Concept) 디자인 리서치를 한 후 디자이너가 전달하고자하는 주제인 잘 표현될 수 있도록 여러가지 시각적인 표현 방법 및 접근 방법을 비주얼을 정하여 나타내는 것을 비주얼 콘셉트라고 한다. 웹 사이트의 성격에 따라 정..

웹 디자인 정보 정보디자인(Information Design), 유저 인터페이스 디자인(User Interface Design), 그래픽 디 자인(Graphic Design), 컴퓨터그래픽(Computer Design) 운영 등 필요 지식을 기반으로 정보 를 계층화하고 설계해야한다. 웹 디자인의 정보 종류 디지털 콘텐츠를 기반으로 사용자에게 전달되는 정보는 다음과 같다. 구체적 사실(Facts): 실제의 사실을 말하며, 특별한 설명이 없어도 이해할 수 있는 구체 적인 정보 개념(Concept): 대상을 이해하기 쉽도록 나타내는 정의 절차(Procedures): 순차적으로 진행되어야하는 과정에 대한 정보 과정(Process): 특정한 주제를 전달되는 원리에 대한 정보 웹 디자인의 정보 구조화 체계화된 정보..

센스리더 음성 출력 방식 이해의 중요성 이미지의 대체 텍스트 alt값 정의 안됨 → 파일명 그대로 출력 alt값 홍길동 → 홍길동 출력 alt값 홍길동, title 남자 → 홍길동 출력, title은 출력 안됨 alt값 공백 → 이미지를 숨기는 효과 alt값 사업취지, longdesc로 파일 연결 → 사업취지 설명있음 이미지, alt + enter로 연결된 긴 설명글을 볼 수 있음 링크와 title, target 링크에서 title과 target 속성을 이용해 새 창 열림 제공시, 센스리더 음성 출력 새 창 알림에 target="_blank" 속성 사용한 경우 → 이벤트페이지로 새창 링크 title="새 창 열림" 속성 사용한 경우 → 이벤트페이지로 새 창 열림 링크 target="_blank"와 tit..

화면낭독기의 이해 화면낭독기, 스크린리더와 같은 명칭의 프로그램은 윈도우 컨트롤, 응용프로그램, 웹에 제공된 정보를 시각장애인이 귀로 들을 수 있도록 음성으로 전환한다. 스크린리더는 웹페이지에 없는 정보를 스스로 판단해서 음성으로 생산하는 것이 아니라 웹 개발자에 의해 제공된 정보만 음성 정보로 제공된다. 가상커서는 스크린리더에서 인터넷브라우저를 지원하기 위해 사용하는 개념으로 화면에 표시되지 않는 가상의 UI다. 스크린리더는 제품마다 최신기술 지원 여부와 동작방식에 일부 차이가 있으므로 2개 정도의 제품으로 중복 테스트를 하는 것을 권장한다. 참고: 가상 커서 인터넷 브라우저를 지원하는 개념으로 모든 스크린 리더에서 사용하고 있다. 키 조작 방식은 스크린리더 종류에 따라 다르게 설정하고 있다. X,Y축..

웹 접근성 평가 도구 웹 접근성 평가 도구는 평가의 정확성과 시간 단축을 위한 보조적인 수단으로, 평가 도구 점검 결과를 분석하여 웹 접근성 지침의 준수여부를 확인해야 한다. 평가도구는 HTML 코드를 분석하여 기계적으로 추출 가능한 항목만을 점검한다. 웹 접근성에 관한 정밀한가를 위해서는 도구에 의한 자동평가와 사람에 의한 수동평가가 병행되어야 한다. 평가도구의 종류로는 OpenWAX CCA, WAT, 웹 브라우저 개발자 도구 등이 있다. 웹 접근성 평가 도구 Open-Wax 특징 브라우저 플러그인 방식(FireFox, Chrome 등과 함께 사용) 1페이지씩 검사 16개 항목 검사 설치방법 Chrome: 브라우저 > 도구 더보기 > 확장 프로그램 > “OpenWAX” 검색 FireFox: 브라우저 >..

디자인 가이드를 위한 스토리보드 스토리보드(Storyboard)란 본래 영화나 애니메이션, 광고와 같은 영상매체를 만들기 전, 주 요 장면을 사진 혹은 일러스트와 같은 시각적 형태로 정리해 놓은 문서를 의미하며, 영상 매체를 제작하는 과정에서 스텝들 간의 원활한 의사소통을 하기 위해 제작된 문서이다. 스토리보드의 구성 스토리보드는 표지, 개정 이력, 화면 설계, 서비스 흐름도의 구성으로 하며, 프레임의 사 용 여부와 메뉴의 구성 위치, 콘텐츠의 위치 등 전체적인 화면 구성을 보여 주어야 한 다. 이 때 메뉴 구성을 포함한 페이지의 구성은 디자인 요소 중 아주 중요한 부분을 차 지하게 된다 각 페이지의 정보를 요약하며, 저장될 디렉터리, 파일 이름, 페이지 타이틀 등을 메모하 듯이 작성한 후 링크 정보를 ..

태스크 플로우 작성하기 사이트 맵은 웹사이트의 특정 영역을 대표하는 페이지들을 시각적으로 보여주는 것을 의미한다. 회사 조직도처럼 생겼으며 사이트의 수직적인 구조를 보여준다. 태스크 플로우는 사용자들이 웹사이트를 항해하는 중 취하는 경로나 과정을 보여준다. 사용자의 옵션이나 경로를 상세히 보여주기 위해 제작된다 시나리오 기반의 태스크 분석 정의 사용자의 니즈와 요구사항을 기반으로 사용자가 우리 서비스를 이용하여 어떤 작업을 수행하도록 할 것인가 정해야 하는데 이를 태스크(과업)이라고 한다. 이 태스크(과업)을 누가 어떤 상황에서 어떻게 수행하는가를 그리는 과정이 시나리오 작업이다 태스크(과업) 분석은 이 서비스를 통하여 앞에서 정의한 페르소나가 무엇을 할 수 있을지, 사용자들에게 어떤 기능들을 제공할 것..

웹 접근성의 올바른 발전 방향 웹 접근성은 잠시의 유행으로 끝나는 것이 아니라 전 세계적인 흐름이자 반드시 필요한 영역이다. 웹 접근성이 마크업 영역에 머무르지 않고 신기술과 새로운 영역까지 발전해야 한다. 웹 접근성이 신기술을 규제하는 것이 아니라 연구를 통한 접근성 적용이 가능해야 한다. 문제점의 해결 현재 웹 접근성의 문제점 - 마크업 기술 중심, 이는 html과 css 중심의 굴레를 벗어나지 못함 웹 접근성 국제 표준: WCAG 1.0→ WCAG 2.0 KWAG 2.1(한국형 웹 콘텐츠 접근성 지침) : 동적인 문서나 애플리케이션 영역에 대한 접근성 영역까지 확장 새로운 기술의 방향 html5와 aria 등 새로운 기술은 웹 접근성을 향상하는 방향으로 발전 화면 낭독기 중심으로 적용하는 접근성 구..