웹 접근성
-
[웹 접근성] 명암비(Contrast Ratio) :: 마이구미HTML, CSS 2022. 10. 8. 11:41
이 글은 웹 접근성 지침중에서 "명암" 에 대해 다룬다. 한 문장으로 설명하면, 두 개의 색상의 명암비가 적합한지에 대한 지침이다. 이것이 무엇인지 알아보고, 실제 코드로 활용되고 있는 사례들을 확인해보자. WCAG - https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast WCAG(Web Content Accessibility Guidelines) 는 웹 콘텐츠 접근성 지침을 나타낸다. 많은 웹 접근성 가이드의 일부인 명암(Contrast) 에 대해 살펴본다. 명암 관련 지침은 두 개의 색상의 명암비 기준을 설명한다. 버튼을 예로 들어보자. 왼쪽 버튼의 백그라운드 색상과 텍스트 색상은 비슷한 색상으로 시각적 장애를 가진 사람에게는 불편함을 초래한다...
-
웹 접근성 API 보조공학과 상호작용 :: 마이구미HTML, CSS 2016. 8. 21. 18:33
이번 글은 어떻게 보조공학(스크린 리더) 자체가 사용자에게 어떻게 정보 전달의 원리를 볼 것이다. 조금 기술적으로 말해보자면, 웹 콘텐츠의 내부에서 일어나는 일과 보조공학(AT) 상호작용의 기본 원리를 본다. 기본적으로 알고 가야할 것들을 먼저 보자. API(Application Programming interface)란 무엇일까? 많이 들어봤을 것이다. 하지만 API가 뭐냐? 물으면 바로 말할 수 없는 사람들이 많다. 이번 계기로 확실히 알고 가보자. API에 대한 정의로는, 어떤 언어로 프로그래밍하는 데 필요한 코드나 함수, 혹은 용어를 제공하는 프레임워크나 규칙. 이번 주제에 관한 정의로 본다면, 브라우저나 보조공학 같은 소프트웨어에게 어떤 작업을 하라고 명령할 때 사용하는 코드 라이브러리. 예를 ..
-
웹 접근성 tabindex 속성 :: 마이구미HTML, CSS 2016. 8. 18. 18:17
이번 글은 tabindex 속성에 대한 웹 접근성에 대해 알아볼 것이다.참고 자료 - http://nuli.navercorp.com/sharing/blog/post/1132726tabindex 를 활용한 하나의 테크닉 - https://mygumi.tistory.com/372 tabindex 속성은 키보드 접근성에 근접한 속성이다. 키보드 접근성이란, 말 그대로 스크린 리더 사용자가 키보드를 통해 웹 페이지의 정보에 접근하는 것이다. 스크린 리더를 쓰지 않더라도, 흔히 우리도 주로 탭이나 엔터를 통해 사용하고 있다. 자 그렇다면, tabindex 란 무엇일까? 어떤 엘리먼트에 키보드 포커스를 주는 가장 흔한 방법으로 사용된다. 크게 3가지 속성값을 이용할 수 있다. 0 값 - tabindex="0" 양수..
-
웹 접근성 html lang 속성 :: 마이구미HTML, CSS 2016. 8. 16. 16:32
이번 글은 html lang 속성에 대해 알아볼 것이다. 다들 lang 속성이 무엇을 뜻하는 지는 짐작할 것이다. 단순히 언어 지정하는 것이 아닌가?맞다. 하지만 단순히 이렇게만 알고 있으면 안된다. 기본적으로 위와 같이 셋팅하여 사용한다. ko... 뭐 코리아네.. 대수롭지 않게 생각했을 것으로 예상한다. 그래도 왜 쓰는지 정확히 알고 가야하지 않겠나? 쉬운 내용이니 한번 읽어보길 바란다. lang 속성은 웹 접근성에 관한 내용이다. 한국형 웹 콘텐츠 접근성 지침(KWCAG) 2.1에는 웹페이지의 head 요소 안에 페이지의 기본 언어 선언을 규정하고 있습니다. 지침을 보다시피 필히 명시되줘야한다. 그렇다면 왜 명시해줘야하는가? 화면 낭독 프로그램 (스크린 리더) 이 언어를 인식하여 자동으로 음성을 변..