1. Roles 위젯(Widget) 역할 Button Scrollbar Checkbox Searchbox Gridcell Seperator (포커스가 가능한 대상일 때) Link Slider Menuitem Spinbutton Menuitemcheckbox Switch Menuitemradio Tab Option Tabpanel Progressbar Textbox Radio Treeitem 복합적인(Composite) 역할 아래의 역할들은 요소들 각각의 복합적인 역할과 해당 요소의 하위요소들에 들어가는 필수 또는 선택적인 역할에 대해 설명합니다. Combobox Menubar Grid (including row, gridcell, rowheader, columnheader roles) Radiogroup..
📁 Screen
W3C 제안 권장사항 (2021년 9월 30일) 자료를 기준으로 작성하였습니다. https://www.w3.org/TR/html-aria/#case-sensitivity ARIA in HTML Element with contenteditable=true or element without contenteditable attribute whose closest ancestor with a contenteditable attribute has contenteditable="true". Note This is equivalent to the isContentEditable IDL attribute. aria-readonly="false" Authors www.w3.org [ role="" 부여 시 주의사항 ] ..
인식의 용이성 이란, 사용자가 장애 유무 등에 관계없이 웹 사이트에서 제공하는 모든 콘텐츠를 동등하게 인식할 수 있도록 제공하는 것을 의미한다. 인식의 용이성은 아래의 3가지 지침으로 구성되어 있다. 지침(3개) 검사 항목(7개) 5.1. 대체 텍스트 5.1.1. (적절한 대체 텍스트 제공) 텍스트 아닌 콘텐츠는 그 의미나 용도를 인식할 수 있도록 대체 텍스트를 제공해야 한다. ex) img의 alt 속성 좀 더 자세한 설명은 해당 링크에서 살펴볼 수 있음 5.2. 멀티미디어 대체 수단 5.2.1. (자막 제공) 멀티미디어 콘텐츠에는 자막, 대본 또는 수화를 제공해야 한다. 5.3 명료성 5.3.1 (색에 무관한 콘텐츠 인식) 콘텐츠는 색에 관계없이 인식될 수 있어야 한다. 5.3.2. (명확한 지시 사..
근무를 하다보니 웹 접근성을 지키고 안 지키고의 차이가 크다는 것을 실감했다. 그렇게 시작된 웹 접근성 가이드 숙지 프로젝트😎 1. 용어의 정리 용어명 설명 건너뛰기 링크 반복 영역의 순차적인 내비게이션 생략 웹 페이지의 핵심 영역으로 이동할 수 있는 수단(버튼, 텍스트 링크 등) 의미 고대비 모드 (high contrast) 전경과 배경 간의 명도 대비 강조하여 표시하는 것 해당 항목을 보다 뚜렷하게 식별 가능하도록 도움 명도 대비 또는 색대비가 큰 차이가 나도록 조정하여 화면에 표시하는 방식을 경조 모드라고 하며 최신 운영체제에서는 기본적으로 이 기능을 지원하고 있음 공백 문자 (blank text) 아무런 정보도 가지고 있지 않은 문자열 의미 공백 문자를 화면 낭독 프로그램(screen reader..
얼마 전에 프로젝트 하나를 새로 시작했습니다. 직장에서 시작한 것은 아니고 완전히 개인적인 프로젝트. 전 직장에서 같이 일했던 언니를 같이 꼬셔서 시작해서 언제 완성될지는 모르겠네요😅 아무 것도 모르는 상태에서 무턱대고 시작한 프로젝트라서 기초부터 차근차근 잡아가며 개발해보려 합니다. 일단은 사용자의 데이터를 저장해야하기 때문에 필요한 로그인/회원가입 단계! 화면을 그리기 전에 어떤 부분을 고려해야할지 알아두어야할 필요가 있어 정리해보았습니다. 1. 회원가입&로그인 UX를 향상시키는 12가지 방법 1) 사용자가 얻을 수 있는 회원가입의 이점을 설명하라 2) 소셜을 이용한 간편회원가입&간편로그인을 제공하라 3) 최소한의 정보만 요구하라 - 4) 같은 텍스트 작성을 반복시키지 마라 (ex. 비밀번호 작성을 ..
