프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

취 준 하 자

총 방문자수

오늘

어제

  • 전체 (162)
    • Project (8)
      • 검색 솔루션 개발 (1)
      • 실시간 채팅 서비스 개발 (3)
      • 지도 서비스 개발 (2)
      • 블로그 테마 만들기 (2)
    • Frontend (33)
      • CSS (8)
      • React (14)
      • Next.js (4)
      • Flutter (1)
      • Svelte (1)
      • 웹 접근성 (1)
      • 테스트 (0)
    • Backend (22)
      • Spring (5)
      • Database (6)
      • Tomcat (1)
      • Docker (1)
      • Node.js (4)
      • Ubuntu&Linux (4)
      • Firebase (1)
    • App (1)
      • Android (1)
    • Algorithm (3)
      • BOJ (0)
      • Programmers (2)
      • 이론 (1)
    • Language (37)
      • Javascript (26)
      • Python (1)
      • Java (10)
    • Computer Science (7)
      • Network (7)
    • 기타 (51)
      • npm (1)
      • Git (3)
      • VSCode (1)
      • 일상 (6)
      • 자격증 (1)
      • 부스트캠프(챌린지) (21)
      • 부스트캠프(멤버십) (17)

Tag

performance api, object.groupby, JavaScript, app router, speculation rules api, 경로 가로채기, toSpliced, node.js 23, 병렬 경로, 뒤로가기 새로고침 구분, toReversed, map.groupby, intl.datetimeformat, findLastIndex, text fragments, toSorted, 카카오 인앱 브라우저, intl.numberformat, findLast, 이미지 fallback,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

이 기술 블로그를 만들기 위해 5년을 미뤘다.

Frontend/웹 접근성 1

웹 접근성 - 모바일 링크(a) 요소 내 초점 분리 이슈 해결법

증상 Android/iOS 모바일 기기에서 TalkBack, VoiceOver 등의 스크린 리더를 사용하여 화면을 읽는 경우, 링크(a 태그) 요소 내에 위치한 모든 텍스트 요소에 초점이 잡히는 문제가 발생한다. G마켓의 스마일프레시 모바일 화면을 예시로 가져왔다. 스마일프레시의 아이템 카드는 a 태그로 감싸져 있으며, a 태그 내에 위치한 span, p 태그 내 텍스트 요소에도 초점이 옮겨가는 문제가 발생하고 있다. 1 45,820원 할인율 14% 할인 전 금액 53,900 원 22년산 이맛쌀 20kg 평점 4.8 후기 (5,306) 건 15% 쿠폰 카드 10% 실제로 초점이 잡혀야 할 링크 요소 외에도 불필요한 초점이 늘어나기 때문에 탐색에 대한 depth도 늘어나게 되므로 스크린 리더 사용자는 웹 ..

Frontend/웹 접근성 2022.12.02
이전
1
다음
더보기

Copyright © Kakao Corp. All rights reserved.

  • Github

티스토리툴바