UX·UI - FrontEnd Dev. Story

웹접근성 2

스크린리더 사용해서 테스트 해보기 / Screen Reader Test 방법

Google Play [ Chrome Vox ]로 스크린리더 사용해서 테스트하기 스크린 리더(Screen Reader) 란 – 시각 장애인들에게 화면 내용과 자신이 입력한 키보드 정보나 마우스 좌표 등을 음성으로 알려주는 기능. 가끔 내가 만든 코드가 스크린 리더가 읽히기 쉽게 잘 작동되는지 궁금할때가 있었다. 그래서 테스트 해보고싶어서 검색하다가 chrome vox 라는걸 알게되었다. 사용법은 아래와 같다. 01. 구글에서 구글 앱 버튼 누르기 02. 구글 웹 스토어 들어가기 03. 검색창에 [ Chrome Vox ] 입력 후 "확장 추가" 04. 내 계정에서 접근성에 스크린 리더를 "사용"으로 설정 - 추가하자마자 바로 작동될 수도 있다. 여기까지 했다면, 마우스가 선택하는 곳마다 음성으로 스크린 리..

[HTML] 웹접근성 Skip Menu 스킵메뉴 / Skip Navigation 스킵 네비 만들기

Skip Menu / Skip Nav를 왜 사용하는가? - 사용자 편의 및 웹 접근성을 위해서다. 웹접근성이라하면 마우스가 고장났다던가, 키보드를 사용 못하는 경우 등 정상적으로 쓸 수 없는 상황에 대해서 편의를 고려해서 제작하는 방법이다. 엄청난 컨텐츠 영역을 가지고 있는 홈페이지에서 원하는 영역에 도달하고 싶을때 Tab 키를 수 없이 눌러야 할것이다. 그런 불필요한 액션을 없애기 위해 스킵메뉴(Skip menu)를 제작한다. 스킵 메뉴를 만들면 해당 영역으로 즉시 갈 수 있는 라고 생각하면 된다. 웹접근성 맞게 스킵메뉴 만들어보기 - 스킵네비게이션은 다음으로 나오는 것이 가장 적절합니다. 본문 바로가기 #skipNav{position:relative;z-index:9999;} #skipNav a{po..

반응형