ux dev

  • 홈
  • 태그
  • 미디어로그
  • 위치로그
  • 방명록

2023/05/16 1

tabindex를 ‘0’과 ‘1’만 사용해야 하는 이유와 관련 이슈

탭인덱스는 포커서블하지 않은 요소에 포커스가 갈 수 있도록 해 주거나, 포커서블한 요소에 포커스가 가지 않도록 하는 역할을 합니다. 다만 해당 요소는 스크린리딩을 하는 시스템에 따라 잘못된 순서의 탭 포커싱을 유발할 수 있으므로, 가급적 사용을 지양하는 것이 좋습니다. 또한 사용을 하더라도 ‘0’, ‘1’만 사용되는 것이 권장됨을 MDN 문서를 통해 확인할 수 있습니다. tabIndex 순서 변경의 이슈의 경우, 첫번째 포커스를 받도록 하는 요소가 아닌 요소를 대상으로 첫번째 포커스를 tabIndex를 통해 할당할 경우 정상적으로 포커스가 할당되지 않는 이슈가 있습니다. 해당 상황은 하단 코드 예제를 통해 확인할 수 있습니다. 스펙상으로는 1 이상의 숫자를 순차적으로 할당하여 포커스가 이동하는 순서를 정..

정보 접근성/접근성 (A11Y) 2023.05.16
이전
1
다음
더보기
프로필사진

ux dev

UX의 개발방법을 고민합니다.

  • 전체보기 (309)
    • UX 콜렉션 (5)
      • 디자인 프레임워크 (1)
      • 디자인 시스템 (0)
      • 아이콘 (3)
      • 폰트 (1)
    • UX 리서치 (40)
      • 디자인 시스템 가이드 (1)
      • 디자인 시스템 컴포넌트 (2)
      • 디자인 이론과 리서치 (16)
      • 디자인 트렌드와 문화 (1)
      • 디자인 케이스스터디 (15)
      • 디자인 리소스 (5)
    • UX 디자인 (54)
      • 피그마 (15)
      • 피그마 - 무료 템플릿 (3)
      • 피그마 - 무료 플러그인 (7)
      • 피그마 - 무료 리소스 (2)
      • 어피니티디자이너 (4)
      • 포토샵 (2)
      • 일러스트레이터 (9)
      • 색상과 디스플레이 (3)
      • 인쇄 (1)
      • 아이콘 디자인 (4)
      • 이메일 디자인 (1)
      • 스케치 (3)
    • UX 개발 (156)
      • HTML (8)
      • CSS (27)
      • CSS - 타이포그래피 (2)
      • CSS - 3D (3)
      • CSS - Selector (1)
      • CSS - Flex & Grid (7)
      • CSS - SASS & SCSS (1)
      • CSS - TailwindCSS (7)
      • CSS - 라이브러리 (2)
      • JS (7)
      • UX - 폼 (Forms) (1)
      • UX - 스크롤 애니메이션 (10)
      • UX - 슬라이더 (롤링배너) (1)
      • UX - 트랜지션 효과 (1)
      • UX - 반응형 (RWD) (1)
      • UX - 커서 & 클릭 & 키보드 (3)
      • Jekyll (1)
      • 노션 (0)
      • 티스토리 (2)
      • 지도API (2)
      • ChatGPT (1)
      • Git (1)
      • SEO (4)
      • 테스팅 (1)
      • Shell Script (Bash) (7)
      • 웹서버 (2)
      • 개발도구와 환경 (53)
    • 정보 접근성 (20)
      • 접근성 (A11Y) (6)
      • 접근성 (A11Y) - 웹 접근성 지침 (7)
      • 접근성 (A11Y) - 컴포넌트 (7)
    • UX 리뷰 (14)
      • 디지털디바이스 (11)
      • 음식과 공간 (0)
      • 거의 모든 것 리뷰 (3)
    • 웹디자인기능사 (17)
      • 웹디자인기능사 정보 (1)
      • 웹디자인기능사 필기 요약 (11)
      • 웹디자인기능사 필기 기출 (0)
      • 웹디자인기능사 실기 (5)
    • 프로젝트 (3)
      • 무료 웹 도구 (3)

Tag

디자인, CSS, 웹디자인기능사필기요약, 어피니티, ux디자인, 피그마, 웹디자인기능사필기, UI, 어피니티디자이너, 로고디자인, 웹디자인기능사, figma, 아이콘, html, UI디자인, MacOS, 맥OS, UX, 디자인시스템, 일러스트레이터,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

Archives

Calendar

«   2023/05   »
일 월 화 수 목 금 토
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

uxdev.org

  • siimplelab
  • siimply

티스토리툴바