웹 접근성 체크리스트 | Notion

1. 인식의 용이성

1.1 대체 텍스트

[ ] 이미지에 alt 속성(대체 텍스트)을 제공하고 있습니까?
```
<img src="logo.png" alt="회사 로고">
```
[ ] 특수문자, 기호 포함, 조직도, 차트 등 복잡한 콘텐츠의 경우 숨김 처리로 대체 텍스트를 제공하고 있습니까?
[ ] QR코드 제공 시 해당 링크를 알 수 있도록 대체 텍스트를 제공하고 있습니까?

1.2 멀티미디어 대체 수단

[ ] 정보전달을 위한 멀티미디어 콘텐츠에 텍스트(자막, 원고) 또는 수화를 제공하고 있습니까?
[ ] 대체 콘텐츠를 제공할 수 있도록 안내하고 툴을 제공하고 있습니까?

1.3 명료성

[ ] 콘텐츠를 색에 관계없이(색약자 포함) 인식할 수 있습니까?
[ ] 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5:1 이상입니까?
```
.text {color: #FFFF00};
.bg {background-color: #000000};
```

1.4 배경음 사용금지

[ ] 자동으로 재생되는 배경음을 사용하지 않고 있습니까?
[ ] 배경음을 비활성화할 수 있는 토글 버튼이나 설정이 제공하고 있습니까?

2. 운용의 용이성

2.1 키보드 접근성

[ ] 모든 기능을 키보드만으로 사용이 가능합니까? (다음 : Tab, 이전 : Shift+Tab, 클릭 대체 : Enter 등)
[ ] 키보드의 초점을 시각적으로 구분이 가능합니까?

2.2 충분한 시간 제공

[ ] 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있습니까? (경매, 온라인 시험, 실시간 게임 등 제외)
[ ] 시간이 종료되기 전에 alert를 통한 화면 전환 및 소리로 경고를 알려주고 있습니까?
[ ] 자동으로 변경되는 콘텐츠에 움직임을 제어할 수 있는 컨트롤러(이전, 다음, 정지 기능 등)가 제공되고 있습니까?

2.3 광과민성 발작 예방

[ ] 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않습니까?
[ ] 깜빡이거나 번쩍이는 콘텐츠를 제공할 경우 시간은 3초 미만으로 제한하거나 사전에 경고하고 중단할 수 있는 수단을 제공 또는 번쩍이는 콘텐츠가 차지하는 면적의 합이 화면 전체 면적의 10% 미만입니까?

2.4 쉬운 내비게이션

[ ] 반복되는 영역에 대한 건너뛰기 링크를 제공하고 있습니까?
[ ] 링크 텍스트의 용도나 목적을 이해할 수 있게 제공하고 있습니까?
```
<a href="/file.pdf" title=“제목”>PDF보기</a>
```
[ ] 페이지, 프레임, 콘텐츠 블록에 적절한 제목 제공하고 있습니까?
```
<head>
	<title>제목</title>
</head>
```

3. 이해의 용이성

3.1 가독성

[ ] <html>에 적절한 lang 속성을 명시하고 있습니까?
```
<html lang=“ko”></html>
```

3.2 예측 가능성

[ ] 사용자가 의도하지 않은 기능(새 창, 초점 변화 등)이 자동으로 실행되고 있지는 않습니까?

3.3 콘텐츠의 논리성

[ ] 페이지의 헤딩 구조가 적절하게 사용되었고, 각 헤딩이 내용의 구조를 잘 반영하고 있습니까?
[ ] 데이터 테이블의 경우 caption, thead, tbody, th의 요소가 그룹화으로 되어 있습니까?

3.4 입력 도움

[ ] 입력 서식에 올바른 <label>을 제공하고 있습니까?

<label for=”user_id”>아이디</label>
<input type=”text” id=”user_id” />

[ ] 입력 오류를 정정할 방법을 제공하고 있습니까?