본문 바로가기
728x90
반응형

접근성9

접근성 관련 자주 묻는 질문! 툴팁 형태의 말풍선을 버튼 위에 제공할 때, 본문 콘텐츠를 가리지 않아야 하는 기준이 어떻게 되나요? 더보기 마우스 오버 또는 포커스 이동 시 말풍선이 발생하는 실제 툴팁으로 마크업된 경우에는 화면을 가려도 마우스 오버를 해제하거나 포커스 적용을 해제하여 툴팁이 닫히기 때문에 상관 없습니다. 접근성에 문제가 되는 부분은 툴팁과 동일하거나 비슷한 형태의 말풍선이 항상 화면에 노출되어 있어서 본문 콘텐츠를 가리는 경우 본문 콘텐츠를 가리지 않도록 말풍선의 위치를 재배치하거나, 말풍선을 닫을 수 있는 매커니즘(닫기 버튼, 열고 닫을 수 있는 확장/축소 버튼)이 필요합니다. 다만, 키보드 또는 마우스를 사용하여(페이지 스크롤 등) 말풍선에 가려진 본문 콘텐츠를 볼 수 있다면 본문 영역을 가리고 있어도 예외 사항.. 2024. 2. 14.
접근성 관련 자주 묻는 질문! 입력 필드에는 레이블이 무조건 제공되어야 하나요? 더보기 네, 사용자가 입력이 필요한 콘텐츠(, 등)에 올바른 입력 목적을 확인할 수 있도록 시각적으로 확인할 수 있는 레이블 또는 지시문을 제공해야 합니다. 입력 후 사라져서 시각적으로 입력 목적을 확인할 수 없는 입력 자리 표시자(Placeholder)는 레이블로 사용할 수 없습니다. AEM 컴포넌트(SVLA 등)에서 동영상 재생 시 등록한 자막이 표출되지 않는데, 어떻게 조치해야되나요? 더보기 자막이 WebVTT 파일 형태인지 확인합니다. 파일 형태가 동일하다면, WebVTT 파일 작성 시 정해진 자막 형식에 맞게 작성되었는지 확인합니다. 첫 줄은 파일 형식을 나타내기 위해 파일 시작 시 헤더를 넣습니다. WebVTT 파일( .VTT)에는 큐(Cues.. 2024. 2. 13.
접근성 관련 자주 묻는 질문! 입력 필드의 명도 대비가 3:1 미만인 경우 접근성 위배인가요? 더보기 입력 필드의 명도 대비가 3:1 미만으로 제공되어도 입력 필드에 제공된 입력 자리 표시자(Placeholder)의 명도 대비가 4.5:1 이상이면 1.4.11 Non-text Contrast 지표에 위배되지 않습니다. 동일하게 버튼의 명도 대비가 3:1 미만으로 제공되어도 버튼명(텍스트)의 명도 대비가 4.5:1 이상이면 접근성에 위배되지 않습니다. [ 1.4.11 Non-text Contrast 지표 중 질문에 대한 내용 발췌 ] 이 성공 기준은 컨트롤의 선택 영역을 나타내는 시각적 표시가 있을 것을 요구하지 않지만, 컨트롤의 시각적 표시가 컨트롤을 식별하는 유일한 방법인 경우 해당 표시의 명도 대비는 충분해야 합니다. 다만, 버튼.. 2024. 2. 8.
퍼블리셔가 체크해야 할 접근성 준수 항목 레이블 또는 지시문 제공 모든 양식 필드(,, 등)에 시각적인 레이블을 제공하고 있는가? 특정 규칙이 있는 양식 필드의 경우 사용자가 규칙을 확인할 수 있도록 지시문을 제공하고 있는가? 오류 수정 제안 입력 방식에 대한 오류가 발생하였을 때 방식을 수정할 수 있는 오류 문구를 제시하고 있는가? 특정 형식이 요구되는 경우 입력 오류 발생 시 입력해야 하는 예시를 구체적으로 제공하고 있는가? 오류 방지 매커니즘 제공 구매와 같은 제출의 경우, 거래를 수정하거나 취소할 수 있는 기능 또는 제출 전에 사용자가 검토할 수 있는 수단이나 절차를 제공하고 있는가? 데이터 삭제를 일으키는 제출의 경우, 삭제된 정보를 복구하거나 제출 전에 사용자의 삭제 의도를 확인할 수 있는 수단이나 절차를 제공하고 있는가? 데이터 작.. 2024. 2. 3.
퍼블리셔가 체크해야 할 접근성 준수 항목 포커스를 받을 때 컨텍스트 변경 금지 포커스를 받는 순간 페이지가 이동되거나 열리지 않는가? 포커스를 받는 순간 새 창이 열리지 않는가? 포커스를 받는 순간 다른 컴포넌트로 포커스가 이동되지 않는가? 포커스를 받는 순간 자동으로 양식이 제출되지 않는가? 입력 시 컨텍스트 변경 금지 체크박스, 입력 필드 등 컴포넌트의 값 또는 상태 등의 설정 변경만으로 포커스가 자동으로 이동되지 않는가? 체크박스, 입력 필드 등 컴포넌트의 값 또는 상태 등의 설정 변경 중 양식이 자동으로 제출되지 않는가?v 체크박스, 입력 필드 등 컴포넌트의 값 또는 상태 등의 설정 변경만으로 자동으로 새창이 열리지 않는가? 체크박스, 입력 필드 등 컴포넌트의 값 또는 상태 등의 설정 변경만으로 페이지가 이동되지 않는가? 일관된 네비게이.. 2024. 2. 2.
퍼블리셔가 체크해야 할 접근성 준수 항목 헤딩과 레이블 각 섹션의 제목은 헤딩태그로 사용하였는가? 각 헤딩태그는 구조화되어 목적에 맞게 사용하고 있는가? 페이지 본문 내 제목이 최상위 레벨 헤딩(h1)으로 지정되었는가? 식별 가능한 포커스 포커스 또는 키보드의 위치를 나타내는 요소가 시각적으로 표시되고 있는가? 포커스는 시각적으로 잘리는 부분 없이 보여지고 있는가? 포커스가 변경되는 배경 이미지와 결합한 경우 포커스와 배경 사이에 3:1 이상의 명도 대비를 준수하고 있는가? 단일 포인터 입력 지원 멀티 포인트(두 손가락으로 제어해야 하는 기능)는 한 손가락 터치 기능으로 대체가 가능한가? 경로기반 제스처(스와이프나 슬라이드 등)은 단순 터치 기능으로 대체가 가능한가? 우발적 포인터 입력 작동 방지 버튼 기능은 마우스로 누른 상태에서 실행되지 않.. 2024. 2. 1.
퍼블리셔가 체크해야 할 접근성 준수 항목 시간 제한 조정 가능 시간 제한이 있는 콘텐츠를 해제할 수 있거나 연장할 수 있는 방법이 있는가? 시간 제한의 간단한 방법(스페이스바 누르기)으로 20초 이상으로 10회 이상 연장할 수 있는가? 일시정지, 중지, 숨김 5초 이상 시간에 따라 자동으로 변경되는 콘텐츠를 정지할 수 있는 방법이 있는가? 5초 이상 깜빡이는 요소를 사용한 경우 정지할 수 있는 방법이 있는가? 번쩍임을 3회 또는 임계값 이하로 설정 빠르게 깜빡이는 콘텐츠를 제공하는 경우 1초 동안 3번 이상 깜빡이지 않게 하거나, 임계값 이하로 설정하고 있는가? 반복되는 콘텐츠 건너뛰기 웹페이지의 반복되는 영역(GNB 등)을 건너뛸 수 있는 링크를 제공하고 있는가? 반복영역을 건너뛰는 링크는 정상적으로 동작하고 있는가? 페이지 제목 지정 웹페이.. 2024. 1. 31.
퍼블리셔 접근성 준수 체크 항목 텍스트 간격 텍스트는 행간 1.5배, 단락 간 2배, 자간 0.12배, 단어 간 0.16배 간격으로 사용하고 있는가? 마우스 호버 또는 키보드 포커스로 나타나는 콘텐츠 마우스 호버 또는 키보드 포커스 이동 시 나타나는 추가 콘텐츠는 ESC 키를 눌러 닫을 수 있는 방법을 제공하고 있는가? 추가 콘텐츠 위로 포인터가 이동하여도 사라지지 않는가? 포커스가 밖으로 이동하거나 사용자가 닫을 때까지 추가 콘텐츠가 노출되도록 유지되고 있는가? 텍스트 콘텐츠의 명도 대비 텍스트와 배경 간의 명도대비는 4.5:1 이상을 준수하고 있는가? 링크 텍스트가 방문 링크인 경우 마우스 호버나 키보드 포커스 상태에서도 명도대비를 준수하고 있는가? 키보드 웹 페이지의 모든 기능이 키보드만으로 사용이 가능한가? UI 컴포넌트, 폼.. 2024. 1. 30.
퍼블리싱을 위한 접근성 체크항목 자막 제공 비디오 콘텐츠에 삽입된 오디오(나래이션 등)에 대한 동기화된 자막을 제공하고 있는가? 동영상에 대한 대체 정보 제공 비디오 콘텐츠에 오디오 설명을 제공하지 않는 경우 모든 정보를 텍스트로 제공하고 있는가? 비디오 콘텐츠에서 오디오로 화면에 대한 설명을 제공하고 있는가? 마크업 구조 및 관계 정보 데이터 테이블에서 과 와 scope를 사용하고, 병합 데이터 테이블에서 id와 headers를 사용하여 데이터셀과 제목셀 간의 관계를 제공하고 있는가? 양식 컨트롤 그룹은 role=group나 으로 그루핑하고 그룹레이블을 aria-labelledby나 로 제공하고 있는가? 콘텐츠의 목적에 맞게 시맨틱한 태그를 활용하여 마크업되어 있는가? 레이아웃 테이블에 role=presentation을 삽입하고 이나.. 2024. 1. 27.
728x90
반응형