모두랑: 홈에 구역 바로가기를 넣기 전과 뒤
알아 두세요
이 결과가 실제 장애인 사용자의 검증을 대신하지는 못합니다. 에이전트가 막혔다면 실제로도 문제가 있을 가능성이 높지만, 끝까지 갔다고 해서 문제가 없다는 뜻은 아닙니다. 실제 스크린리더가 읽어 주는 순서나 가상 커서 동작은 흉내 내지 않습니다. 한계와 실제 사용자 검증 방법
고치기 전에는 키보드 에이전트가 상세 보기까지 가는 데 Tab을 100번 넘게 눌러 32단계가 걸렸습니다. 홈 첫머리에 구역 바로가기 링크를 넣은 뒤에는 대화상자 닫기, 메인 바로가기, 구역 바로가기, Tab 세 번으로 9단계 만에 끝까지 갔습니다. 두 번의 실행 사이에 에이전트도 바뀌었습니다. 한 단계에서 Tab을 여러 번 누를 수 있게 했고, 바로가기 링크가 있으면 먼저 쓰도록 했습니다. 단계 수가 줄어든 데에는 이 변화의 몫도 있습니다. 스크린리더 에이전트는 제목으로 건너뛸 수 있어서 두 번 모두 7~8단계로 비슷했습니다.
고치기 전
고치기 전 · 우리 지역 무장애 문화공간 목록에서 서울도서관의 상세 보기를 연다
https://www.modurang.com/
- 키보드 에이전트: 32단계 만에 끝까지 감
- 스크린리더 에이전트: 7단계 만에 끝까지 감
막힌 곳이 없었습니다. 접근성 트리의 제목·랜드마크·포커스와 키보드 조작만 살펴본 결과입니다.
고치기 전 · 키보드 에이전트: 32단계 만에 끝까지 감
페이지 구조는 보지만 마우스는 쓰지 않습니다. 포커스 표시가 보이지 않으면 지금 어디에 있는지 모릅니다.
1단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: 온보딩 대화상자가 열려 있고 '건너뛰기' 버튼이 포커스 가능한 요소로 존재함을 인지했다.
하려는 일: 대화상자를 닫기 위해 '건너뛰기' 버튼으로 포커스를 이동한다.
한 일: Tab
2단계
포커스: 건너뛰기 버튼
파악한 것: 포커스가 대화상자의 '건너뛰기' 버튼에 있음을 인지했다.
하려는 일: 온보딩 대화상자를 닫기 위해 '건너뛰기' 버튼을 활성화한다.
한 일: Enter 키
3단계
포커스: 없음
파악한 것: 온보딩 대화상자가 닫힌 후 포커스 위치가 명확하지 않다(focusVisible=false). 서울도서관 상세 보기 링크가 목록에 존재함을 확인했다.
하려는 일: 포커스 위치를 확인하며 서울도서관 상세 보기 링크로 이동하기 위해 Tab을 눌러본다.
한 일: Tab
4단계
포커스: 메인 콘텐츠로 바로가기 링크
파악한 것: 현재 포커스는 '메인 콘텐츠로 바로가기' 링크에 있으며, 목표인 '서울도서관 상세 보기' 링크까지 다수의 포커스 가능한 요소가 존재함을 확인했다.
하려는 일: 서울도서관 상세 보기 링크에 도달하기 위해 포커스 가능한 요소 개수를 세어 27회 Tab을 이동시키려 한다.
한 일: Tab
5단계
포커스: 모두랑 홈으로 이동 링크
파악한 것: 포커스가 6번 항목(모두랑 홈으로 이동)에 있음을 인지했다. 서울도서관 상세 보기 링크는 117번 항목에 위치한다.
하려는 일: 서울도서관 상세 보기 링크로 포커스를 이동시키기 위해 111회 Tab을 이동시킨다.
한 일: Tab
6단계
포커스: 홈 링크
파악한 것: 현재 포커스가 n=10('홈' 링크)에 있고, 목표인 '서울도서관 상세 보기' 링크가 n=117에 위치함을 인지했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(107회)를 계산하여 이동한다.
한 일: Tab
7단계
포커스: 검색 링크
파악한 것: 현재 포커스가 n=12 '검색' 링크에 있음을 확인했다. 목표인 '서울도서관 상세 보기' 링크는 n=117이다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(105회)를 계산하여 이동한다.
한 일: Tab
8단계
포커스: 커뮤니티 링크
파악한 것: 현재 포커스가 n=14 '커뮤니티' 링크에 있으며, 목표인 '서울도서관 상세 보기' 링크는 n=117에 위치함을 인지했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-14=103회)를 계산하여 이동한다.
한 일: Tab
9단계
포커스: 추천 코스 링크
파악한 것: 현재 포커스가 n=16 '추천 코스' 링크에 있음을 확인했다. 목표인 '서울도서관 상세 보기' 링크는 n=117이다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-16=101회)를 계산하여 이동한다.
한 일: Tab
10단계
포커스: 라이트 모드 라디오 버튼
파악한 것: 현재 포커스가 n=19(라이트 모드 라디오)에 있음을 확인했다. 목표인 '서울도서관 상세 보기' 링크는 n=117이다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-19=98회)를 계산하여 이동한다.
한 일: Tab
11단계
포커스: 다크 모드 라디오 버튼
파악한 것: 현재 포커스가 20번(다크 모드 라디오)에 있으며, 목표인 117번 서울도서관 상세 보기 링크는 97칸 뒤에 있음을 인지했다.
하려는 일: 서울도서관 상세 보기 링크로 포커스를 이동시키기 위해 97회 Tab을 이동한다.
한 일: Tab
12단계
포커스: 고대비 모드 라디오 버튼
파악한 것: 현재 포커스가 n=21(고대비 모드 라디오)에 있으며, 목표인 서울도서관 상세 보기 링크는 n=117임을 인지했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-21=96회)를 계산하여 이동한다.
한 일: Tab
13단계
포커스: 로그인 또는 회원가입 버튼
파악한 것: 현재 포커스가 n=22(로그인 버튼)에 있음을 인지했다. 목표인 서울도서관 상세 보기 링크는 n=117이다.
하려는 일: n=22에서 n=117까지 95회 Tab을 이동하여 목표 링크에 도달한다.
한 일: Tab
14단계
포커스: 문화공간 검색 검색란
파악한 것: 현재 포커스는 n=33 검색창(searchbox)에 있으며, 목표 링크는 n=117 '서울도서관 상세 보기'이다. Tab 순서상 33에서 117까지는 84회 이동이 필요하다.
하려는 일: n=33에서 n=117까지 84회 Tab을 이동하여 서울도서관 상세 보기 링크에 포커스를 맞춘다.
한 일: Tab
15단계
포커스: 검색 버튼
파악한 것: 현재 포커스가 n=34(검색 버튼)에 있고, 목표인 서울도서관 상세 보기 링크는 n=117임을 확인했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-34=83회)를 계산하여 이동한다.
한 일: Tab
16단계
포커스: 공연 둘러보기 링크
파악한 것: 현재 포커스가 n=36(공연 둘러보기 링크)에 있음을 인지했다. 목표인 n=117(서울도서관 상세 보기 링크)까지는 81회 Tab이 필요하다.
하려는 일: 목표 링크까지 도달하기 위해 81회 Tab을 이동한다.
한 일: Tab
17단계
포커스: 전시 둘러보기 링크
파악한 것: 현재 포커스가 n=41 '전시 둘러보기' 링크에 있음을 인지했다. 목표 링크 '서울도서관 상세 보기'는 n=117이다.
하려는 일: n=41에서 n=117까지 76회 Tab을 이동하여 목표 링크에 도달한다.
한 일: Tab
18단계
포커스: 문화시설 둘러보기 링크
파악한 것: 현재 n=46(문화시설 둘러보기)에 포커스가 있으며, 목표인 n=117(서울도서관 상세 보기) 링크의 위치를 확인했다.
하려는 일: n=46에서 n=117까지 71회 Tab을 이동하여 목표 링크에 도달한다.
한 일: Tab
19단계
포커스: 도서관 둘러보기 링크
파악한 것: 현재 focus가 n=51(도서관 둘러보기 링크)에 있음을 인지했다. 목표는 n=117(서울도서관 상세 보기 링크)이다.
하려는 일: n=51에서 n=117까지 66회 Tab을 이동하여 목표 링크에 도달한다.
한 일: Tab
20단계
포커스: 관광지 둘러보기 링크
파악한 것: 현재 n=56 '관광지 둘러보기' 링크에 포커스가 있으며, 목표인 n=117 '서울도서관 상세 보기' 링크까지 61회 남았음을 확인했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-56=61회)를 계산하여 이동한다.
한 일: Tab
21단계
포커스: 음식점 둘러보기 링크
파악한 것: 현재 n=61(음식점 둘러보기 링크)에 포커스가 있으며, 목표인 n=117(서울도서관 상세 보기 링크)까지는 56회 Tab이 필요함을 확인했다.
하려는 일: 목표 링크까지 도달하기 위해 필요한 Tab 횟수(117-61=56회)를 계산하여 이동한다.
한 일: Tab
22단계
포커스: 숙소 둘러보기 링크
파악한 것: 현재 n=66(숙소 둘러보기)에 포커스가 있으며, 목표인 n=117(서울도서관 상세 보기)까지 51회 Tab이 필요함을 확인했다.
하려는 일: 51회 Tab을 이동하여 서울도서관 상세 보기 링크에 정확히 도달한다.
한 일: Tab
23단계
포커스: 전체 검색 둘러보기 링크
파악한 것: 현재 포커스는 n=71 '전체 검색 둘러보기' 링크에 있으며, 목표인 n=117 '서울도서관 상세 보기' 링크는 46칸 뒤에 위치한다.
하려는 일: 목표 링크까지 46회 Tab을 이동하여 도달한다.
한 일: Tab
24단계
포커스: 로그인 없이 AI 여행 체험하기 링크
파악한 것: 현재 포커스가 n=77(로그인 없이 AI 여행 체험하기 링크)에 위치함을 인지했으며, 목표인 n=117(서울도서관 상세 보기 링크)까지 40회 Tab 이동이 필요함을 확인했다.
하려는 일: 목표 링크까지 정확히 40회 Tab을 이동하여 도달하고자 한다.
한 일: Tab
25단계
포커스: 큐레이터가 만든 무장애 문화 코스 둘러보기 → 링크
파악한 것: 현재 n=78에 포커스가 있으며, 목표인 n=117 '서울도서관 상세 보기' 링크까지 39회 Tab 이동이 필요함을 확인했다.
하려는 일: 39회 Tab을 이동하여 서울도서관 상세 보기 링크에 정확히 도달한다.
한 일: Tab
26단계
포커스: 기준 지역 수정 버튼
파악한 것: 현재 포커스가 n=83(기준 지역 수정 버튼)에 있으며, 목표인 n=117(서울도서관 상세 보기 링크)까지는 34회 Tab 이동이 필요함을 인지했다.
하려는 일: 목표 링크까지 정확한 Tab 횟수를 계산하여 이동한다.
한 일: Tab
27단계
포커스: 계획 시작하기 버튼
파악한 것: 현재 포커스가 n=88(계획 시작하기)에 있으며, 목표인 n=117(서울도서관 상세 보기)까지는 29회 Tab이 필요함을 확인했다.
하려는 일: n=88에서 n=117까지 정확히 29회 Tab을 이동하여 서울도서관 상세 보기 링크에 도달한다.
한 일: Tab
28단계
포커스: 3분 이용 안내 보기 버튼
파악한 것: 현재 포커스가 n=92(3분 이용 안내 보기 버튼)에 있음을 인지했다. 목표인 서울도서관 상세 보기 링크는 n=117이다.
하려는 일: 목표 링크까지 정확히 25회 Tab을 이동하여 도달한다.
한 일: Tab
29단계
포커스: 우리 지역 무장애 문화공간 거리순으로 더 보기 링크
파악한 것: 현재 포커스는 n=96(더 보기 링크)에 있으며, 목표인 서울도서관 상세 보기 링크는 n=117이다.
하려는 일: n=96에서 n=117까지 정확히 21회 Tab을 이동하여 도달한다.
한 일: Tab
30단계
포커스: 링크
파악한 것: 현재 포커스가 n=101(서울도서관 카드 이미지 링크)에 있음을 확인했다. 목표인 '서울도서관 상세 보기' 링크는 n=117이다.
하려는 일: n=101에서 n=117까지 정확히 16회 Tab을 이동하여 목표 링크에 도달한다.
한 일: Tab
31단계
포커스: 서울도서관 상세 보기 링크
파악한 것: 서울도서관 상세 보기 링크에 포커스가 도달했음을 인지했다.
하려는 일: 해당 링크를 활성화하여 상세 보기 페이지로 이동하고자 한다.
한 일: Enter 키
32단계
포커스: 서울도서관 상세 보기 링크
판정 근거
근거
- 성공 조건 전부 충족
실제 스크린리더에서는 다를 수 있는 점
- 접근성 트리 기준 완료이며 실제 스크린리더 발화는 검증하지 않음
고치기 전 · 스크린리더 에이전트: 7단계 만에 끝까지 감
화면은 보지 않습니다. 접근성 트리에서 제목, 랜드마크, 지금 포커스가 있는 곳과 그 주변 몇 줄만 읽습니다.
1단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: 온보딩 대화상자가 열려 있고 포커스가 대화상자에 있음을 인지했다.
하려는 일: 대화상자를 닫거나 진행하기 위해 다음 요소를 탐색한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
2단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: '모두랑에 오신 것을 환영해요' 대화상자가 여전히 열려 있고 포커스가 그 안에 있음을 인지했다.
하려는 일: 대화상자를 닫아 본문 목록에 접근하기 위해 Escape 키를 시도한다.
한 일: Esc 키
3단계
포커스: 없음
파악한 것: 대화상자가 닫혔고 헤딩 트리에 서울도서관 항목이 존재함을 인지했다.
하려는 일: 서울도서관 헤딩으로 이동하여 상세 보기를 열기 위한 컨트롤을 찾는다.
한 일: 다음 제목으로 건너뛰기
결과: 읽기 창 이동(브라우저 동작 없음)
4단계
포커스: 없음
파악한 것: 서울도서관 헤딩 주변 정보를 확인했으며, 상세 보기 버튼은 아직 읽기 창에 나타나지 않았다.
하려는 일: 상세 보기 컨트롤을 찾기 위해 다음 노드를 계속 읽어나간다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
5단계
포커스: 없음
파악한 것: 서울도서관 항목 내부의 접근성 정보(공식 접근성, +2 항목, 14개 이용 가능)를 확인했으나 상세 보기 버튼은 아직 읽기 창에 나타나지 않았음을 인지했다.
하려는 일: 상세 보기 버튼을 찾기 위해 다음 노드로 계속 이동한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
6단계
포커스: 없음
파악한 것: 읽기 창에서 '서울도서관 상세 보기' 링크(n=117, ref=e596)를 발견했다.
하려는 일: 서울도서관 상세 보기 링크를 활성화하여 상세 정보를 연다.
한 일: 누르기
7단계
포커스: 서울도서관 상세 보기 링크
판정 근거
근거
- 성공 조건 전부 충족
실제 스크린리더에서는 다를 수 있는 점
- 접근성 트리 기준 완료이며 실제 스크린리더 발화는 검증하지 않음
고친 뒤
고친 뒤 · 우리 지역 무장애 문화공간 목록에서 서울도서관의 상세 보기를 연다
https://www.modurang.com/
- 키보드 에이전트: 9단계 만에 끝까지 감
- 스크린리더 에이전트: 8단계 만에 끝까지 감
막힌 곳이 없었습니다. 접근성 트리의 제목·랜드마크·포커스와 키보드 조작만 살펴본 결과입니다.
고친 뒤 · 키보드 에이전트: 9단계 만에 끝까지 감
페이지 구조는 보지만 마우스는 쓰지 않습니다. 포커스 표시가 보이지 않으면 지금 어디에 있는지 모릅니다.
1단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: 온보딩 대화상자('모두랑에 오신 것을 환영해요')가 열려 있고 '건너뛰기'와 '다음' 버튼이 있음을 인지했다.
하려는 일: 대화상자를 닫기 위해 '건너뛰기' 버튼으로 이동한다.
한 일: Tab
2단계
포커스: 건너뛰기 버튼
파악한 것: 대화상자 안의 '건너뛰기' 버튼에 포커스가 있음을 인지했다.
하려는 일: 대화상자를 닫기 위해 '건너뛰기' 버튼을 활성화한다.
한 일: Enter 키
3단계
포커스: 없음
파악한 것: 대화상자가 닫힌 후 포커스 링이 보이지 않아 현재 포커스 위치를 알 수 없는 상태를 인지했다. 페이지에는 '서울도서관 상세 보기' 링크가 존재한다.
하려는 일: 현재 포커스 위치를 확인하기 위해 Tab을 한 번 눌러 다음 요소로 이동한다.
한 일: Tab
4단계
포커스: 메인 콘텐츠로 바로가기 링크
파악한 것: 현재 포커스가 '메인 콘텐츠로 바로가기' 링크에 있음을 인지했다. 페이지 상단에 '우리 지역 무장애 문화공간으로 바로가기' 바로가기 링크가 존재함을 확인했다.
하려는 일: 목표 구역인 '우리 지역 무장애 문화공간' 섹션으로 바로 이동하기 위해 해당 바로가기 링크까지 Tab으로 이동하려 한다.
한 일: Tab
결과: 10회
5단계
포커스: 문화공간 검색으로 바로가기 링크
파악한 것: 현재 포커스가 '문화공간 검색으로 바로가기' 링크에 있음을 인지했다. 목표인 '우리 지역 무장애 문화공간으로 바로가기' 링크는 바로 다음에 위치한다.
하려는 일: 목표 구역 바로가기 링크로 이동하기 위해 Tab을 한 번 누른다.
한 일: Tab
6단계
포커스: 우리 지역 무장애 문화공간으로 바로가기 링크
파악한 것: '우리 지역 무장애 문화공간으로 바로가기' 링크에 포커스가 있음을 인지했다.
하려는 일: 해당 바로가기 링크를 실행하여 목표 섹션으로 이동한다.
한 일: Enter 키
7단계
포커스: 근처 추천 여행지 region
파악한 것: '근처 추천 여행지' 섹션에 포커스가 도달했음을 인지했다. 목표인 서울도서관 카드의 '상세 보기' 링크가 근처에 있으며, 그 사이에 '더 보기' 링크와 카드 이미지 링크가 순서대로 위치한다.
하려는 일: 서울도서관 상세 보기 링크로 이동하기 위해 Tab을 3회 눌러 다음 포커스 가능한 요소들을 거쳐간다.
한 일: Tab
결과: 3회
9단계
포커스: 서울도서관 상세 보기 링크
파악한 것: 현재 포커스는 '서울도서관 상세 보기' 링크에 있다.
하려는 일: 목표 링크에 도달했으므로 이를 활성화하여 상세 보기를 연다.
한 일: Enter 키
10단계
포커스: 본문
판정 근거
근거
- 성공 조건 전부 충족
실제 스크린리더에서는 다를 수 있는 점
- 접근성 트리 기준 완료이며 실제 스크린리더 발화는 검증하지 않음
고친 뒤 · 스크린리더 에이전트: 8단계 만에 끝까지 감
화면은 보지 않습니다. 접근성 트리에서 제목, 랜드마크, 지금 포커스가 있는 곳과 그 주변 몇 줄만 읽습니다.
1단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: '모두랑에 오신 것을 환영해요' 대화상자가 열려 있으며 1/5단계 온보딩 화면임을 인지했다.
하려는 일: 대화상자 내용을 확인하고 닫거나 진행할 수 있는 컨트롤을 찾기 위해 읽기 창을 다음으로 이동한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
2단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: 대화상자가 열려 있고 읽기 창에는 헤더/내비게이션 관련 요소만 보여 닫기 버튼을 아직 찾지 못했다고 인지했다.
하려는 일: 대화상자를 닫을 수 있는 컨트롤을 찾기 위해 읽기 창을 계속 다음으로 이동한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
3단계
포커스: 모두랑에 오신 것을 환영해요 대화상자
파악한 것: 대화상자가 열려 있고 읽기 창에는 배경 콘텐츠(홈, 검색 링크)만 보이며 대화상자 내부의 닫기 버튼을 아직 찾지 못했음을 인지했다.
하려는 일: 대화상자를 닫기 위해 Escape 키를 시도한다.
한 일: Esc 키
4단계
포커스: 없음
파악한 것: 대화상자가 닫힌 것을 확인했으며, 헤딩 목록에 '서울도서관' 항목이 있음을 인지했다.
하려는 일: 서울도서관 헤딩으로 이동하여 상세 보기 컨트롤을 찾는다.
한 일: 다음 제목으로 건너뛰기
결과: 읽기 창 이동(브라우저 동작 없음)
5단계
포커스: 없음
파악한 것: 서울도서관 헤딩 아래 주소와 접근성 아이콘을 확인했으나 상세 보기 버튼은 아직 읽기 창에 나타나지 않았다.
하려는 일: 상세 보기 컨트롤을 찾기 위해 읽기 창을 계속 다음으로 이동한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
6단계
포커스: 없음
파악한 것: 읽기 창에 서울도서관 카드의 접근성 항목들이 보이나, 상세 보기 버튼은 아직 나타나지 않았다.
하려는 일: 상세 보기 컨트롤을 찾기 위해 읽기 창을 계속 다음으로 이동한다.
한 일: 다음 줄 읽기
결과: 읽기 창 이동(브라우저 동작 없음)
7단계
포커스: 없음
파악한 것: 읽기 창에서 '서울도서관 상세 보기' 링크를 발견했다.
하려는 일: 해당 링크를 활성화하여 서울도서관 상세 보기를 연다.
한 일: 누르기
8단계
포커스: 서울도서관 상세 보기 링크
판정 근거
근거
- 성공 조건 전부 충족
실제 스크린리더에서는 다를 수 있는 점
- 접근성 트리 기준 완료이며 실제 스크린리더 발화는 검증하지 않음