📌 웹 접근성 마스터하기

지난 4월 20일은 장애인의 날이었습니다. 토스에서는 점자카드 만들기 이벤트(https://service.toss.im/disabled-day-2023)가 열리기도 했죠. 저도 점자카드를 만들면서 장애인의 날에 제가 할 수 있는 일에 대해 생각해보게 됐습니다. 그래서 오늘은 프론트엔드 엔지니어가 바로 실천할 수 있는 웹 접근성에 대해 다룬 글을 소개합니다. - 웹 접근성이 중요한 이유는 무엇인가요? - 웹 접근성은 능력이나 장애에 관계없이 모든 사람이 웹에 접근해서 사용할 수 있도록 보장하기 때문에 중요합니다. 또한 정보와 기술에 대한 장벽을 제거하여 포용성, 다양성, 평등을 증진하는 데에도 도움이 됩니다. - 대체 텍스트를 제공하세요. - 웹사이트에 이미지, 동영상 또는 시각적 콘텐츠를 추가할 때는 반드시 콘텐츠가 묘사하는 내용을 텍스트로 제공해야 합니다. HTML에서는 이를 대체 텍스트라고 합니다. 이러한 설명은 스크린 리더 사용자가 웹사이트의 내용을 이해할 수 있도록 도와줍니다. 다음은 동영상 및 이미지 마크업에 대한 대체 텍스트가 어떻게 보이는지 보여주는 코드 예시입니다. - 디자인을 테스트하세요. - 다양한 장치와 화면 해상도에서 웹사이트를 테스트하여 글꼴 크기와 유형이 모든 사용자가 읽기 쉽고 접근 가능한지 확인하세요. - ARIA 속성을 사용합니다. - ARIA(Accessible Rich Internet Applications) 속성은 HTML 태그에 추가하여 요소의 역할 및 속성에 대한 자세한 정보를 제공할 수 있는 추가 속성입니다. 이러한 속성은 스크린 리더가 읽어 사용자 경험을 개선하는데 사용될 수 있습니다.