공부하는 블로그 ✍️

✅ 21. 레이블 제공 - 사용자 입력에는 이와 대응하는 레이블을 제공해야 한다 - 레이블은 모든 사용자의 입력 용도 또는 역할에 대한 설명을 위해 사용한다 (1) 레이블이 시각적으로 노출되어 있는 경우 - 청각으로 웹을 인식하는 사용자는 입력 서식에 초점이 갔을 때 스크린 리더가 “편집창” 이라고만 읽어준다 - 입력창의 용도가 달라도 “편집창”이라고만 읽어주기 때문에 무엇을 입력해야 하는지 알 수 없다 - 따라서 이에 대한 설명을 제공해야 한다 아이디 비밀번호 - 레이블과 입력 서식이 1:1 매칭인 경우 레이블을 제공하고 태그의 for값과 의 id값을 동일하게 제공한다 - 이렇게 제공하면 입력 서식 선택 시 초점이 가는 것은 물론이고 레이블을 선택해도 입력 서식에 초점이 가게 된다 성별 성별 남자 여자..

✅ 17. 기본 언어 표시 - 웹 브라우저는 텍스트 콘텐츠의 언어 정보를 바탕으로 화면에 표시하고 전달한다 - 언어를 명시하면 자동언어 전환을 지원하는 스크린 리더는 선언된 언어로 전환하여 읽어준다 - 그렇기 때문에 웹페이지에 기본 언어, 주로 사용하는 언어를 명시해야만 한다 (1) 기본 언어 표시 - 기본 언어 표시는 HTML 태그에 lang 속성을 사용해 "ISO639-1"에서 지정한 두 글자로 된 언어 코드로 제공한다 - 기본 언어 설정을 해둔 상태에서 중간에 다른 언어를 사용한다면, 해당 영역은 langt속성을 사용해 적절하게 대응한다 ✅ 18. 사용자 요구에 따른 실행 - 사용자가 의도하지 않은 기능 (새 창, 초점에 의한 맥락 변화 등)은 실행되면 안 된다 - 사용자가 원하고 의도한 상황에서만..

✅ 12. 정지 기능 제공 - 자동으로 변경되는 콘텐츠는 움직임 제어할 수 있어야 한다 - 스크롤이나 자동 갱신되는 콘텐츠를 장애인 사용자가 이용할 수 있도록 일시 정지할 수 있는 수단을 제공해야 한다 (1) 자동 변경 슬라이드 - 이전, 다음, 정지 기능을 제공해야 한다 - 정지 버튼이 없더라도 마우스 오버 시와 키보드 접근 시에 정지되도록 구현하면 정지 기능을 제공한 것으로 인정된다 (2) 자동 변경 콘텐츠 실시간 검색어처럼 자동 변경되는 콘텐츠에 이전, 다음, 정지 기능이 제공되지 않더라도 마우스 오버, 키보드 접근 시 모든 콘텐츠가 보이고 탐색 가능하다면 준수한다고 간주한다 - 비 장애인들도 이전 콘텐츠를 보고 싶었는데 넘어간 경우, 이를 제어할 수 있는 기능을 제공해야 한다 - 스크롤 및 자동 ..

✅ 7. 콘텐츠 간의 구분 - 웹 페이지의 콘텐츠를 통해 정보를 인식할 때, 이웃한 콘텐츠는 시각적으로 구별될 수 있어야 한다 (1) 이웃한 콘텐츠 구분 방법 1. 테두리를 이용한 구분 2. 콘텐츠 사이에 시각적인 구분선을 삽입해 구분 3. 서로 다른 무늬를 이용한 구분 4. 콘텐츠 배경색 간의 명도 대비(채도)를 달리하여 구분 5. 줄 간격과 글자 간격을 조절하여 구분 6. 기타 콘텐츠를 시각적으로 구분하할 수 있는 방법을 통한 구분 ✅ 8. 키보드 사용 보장 - 마우스를 사용하지 못하는 키보드 사용자는 키보드로 웹 페이지를 탐색한다 - 웹 페이지에서 제공하는 모든 기능을 키보드만으로도 사용할 수 있도록 제공해야 한다 - 즉, 마우스로 조작 가능한 기능과 키보드로 조작 가능한 기능을 동일하게 구현해야만..

✅ 2. 자막 제공 (1) 멀티미디어 대체 수단 제공 - 청각적으로 내용을 인식할 수 없는 사용자를 위해 시각적인 인식이 가능한 대체 수단 제공이 필요하다 - 대체 콘텐츠로는 자막, 대본, 원고, 수화 등이 있다 (2) 사용자가 업로드하는 멀티미디어 - 제 3자가 영상을 업로드하는 경우, 사용자가 대체 콘텐츠를 제공할 수 있도록 툴을 제공한다 (3) 음성이 나오지 않는 영상 - 멀티미디어 콘텐츠가 음성 정보 없이 텍스트만 제공되는 경우는, 시각적 인식만이 가능하다 - 이런 경우는 따로 원고를 제공하는 등의 방법을 통해 대체 콘텐츠를 제공한다 ✅ 3. 색에 무관한 콘텐츠 인식 - 콘텐츠는 색상에 관계없이 인식이 가능하도록 작성되어야만 한다 - 색을 구분하지 못하더라도 콘텐츠 인식에 문제가 없어야 한다 - ..

✅ 1. 이미지에 대한 적절한 대체 텍스트 제공 - 시각적 정보 습득에 어려움이 있는 사용자는 스크린리더와 같은 보조 기술을 통해 콘텐츠를 이용한다 - 스크린리더가 페이지를 음성으로 설명하기 위해서 어떤 이미지인지를 말해주는 대체 텍스트가 필요하다 (1) alt로 대체 텍스트를 제공 - 이미지 요소를 마크업 할 때, 이미지를 텍스트로 설명하는 alternative 속성인 alt를 사용한다 - 이미지에 텍스트가 있는 경우에는 해당 텍스트를 'alt' 에 입력해준다 - 스크린 리더는 alt 의 값을 읽어 사용자에게 이미지를 설명하기 때문에 보는 것과 듣는 것이 동등하게 대체 텍스트를 제공한다 - alt를 사용하지 않으면, 스크린 리더는 src에 있는 파일명을 읽어준다 - alt의 값에 공백이 있는 경우도 s..

📌 웹 접근성이란 ✅ 웹 접근성 - 접근성이란 사용자가 제품이나 서비스 등을 편리하게 이용할 수 있는 정도를 의미한다 - 사용자가 어떤 기술 환경에서도 전문적인 능력 없이 웹사이트에서 제공하는 모든 정보에 접근할 수 있도록 보장한다 - 모든 사용자가 모든 기기에서 웹에 접근할 수 있도록 하는 것 ✅ 웹 접근성을 지켜야하는 이유 (1) 장애인 차별 금지법(장차법) 장애인들도 비장애인과 동등하게 전자정보 및 비전자 정보 사용을 법적으로 의무화 (2) 장애인 차별 금지법 처벌 법적 진행 절차 (1) 1. (인권위) 민/형사 고발 2. 형사의 경우 3개월 이내 수사, 민사의 경우 손해 배상 제도 절차 3. 악의로 인정된 경우 3년 이하 징역 또는 3천만원 이하의 벌금에 처한다 (3) 장애인 차별 금지법 처벌 법..