웹접근성


정보통신접근성 (Web 접근성)은 「지능정보화기본법」에 따라 장애인이나 고령자분들이 웹 사이트에서 제공하는 정보를 비장애인과 동등하게 접근하고 이용 할 수 있도록 보장하는 것으로 웹 접근성 준수는 법적의무사항 입니다.

출처 :한국웹접근성인증평가원


장애인, 고령자를 포함한 모든 사람들이 동등한 정보와 지식을 습득할 수 있도록 하는 방식을 의미한다.



대체 텍스트


  • 스크린 리더가 이미지를 인식할 때 사용할 문자열을 지정해주는 것이다. 이를 통해 시각 장애인이 해당 문서를 파악할 수 있게 한다.

  • 기본적으로는 img 태그 속성인 alt값을 이용한다.

    <img src="이미지 경로" alt="이미지 대체 텍스트">
    • 이미지 요소의 정보는 빠짐 없이 대체 텍스트 값으로 넣어준다. 대체 텍스트 예제1 
      <img src="img1.png" alt="amibo, 1팩당 카드 2장 동봉 (보너스 스티커 1장 포함), 2021년 3월 26일 발매 희망소비자가격 3,500원">
    • 배경 이미지와 같은 장식적인 요소들은 alt값을 비워준다(alt=””). 대체 텍스트 예제2 
        <img src="bg.png" alt="">

    • 정보를 제공하는 텍스트가 없는 이미지는 필요한 정보를 간단하게 요약하여 alt값에 넣어준다. 대체 텍스트 예제3

        <img src="img.png" alt="감자튀김, 프라이드 윙, 그리고 호가든 맥주병이 놓여있는 사진">

IR(Image Replacement) 기법

  • 텍스트가 아닌 콘텐츠의 인식을 위한 기법들이 있다.

  • 이미지 대체텍스트 제공을 위한 CSS 기법으로, 이미지에 포함된 텍스트의 양이 많을경우
    기본 속성(ex. 의 속성 alt)으로는 처리할수없을 시
    마크업과 CSS를 이용하여 대체텍스트를 제공해주는 방법이다.