TIL / 2023.10.27

오늘은 'Tech-Verse 2022' 웹 접근성 향상을 위한 노력 이라는 글을 보며 배운 내용을 정리합니다.

'Tech-Verse 2022' 웹 접근성 향상을 위한 노력 원문

• 모든 사진자료들은 위 링크를 참고하여 가져왔음을 명시합니다.

웹 접근성이란?

웹 접근성(Web Accessibility)은 모든 사람, 포괄적으로는 장애를 가진 사람들을 포함하여 웹 사이트와 웹 애플리케이션에 쉽게 접근할 수 있도록 하는 디자인 원칙과 기술입니다.

웹 접근성을 향상 시키기 위한 국제적 표준은 웹 콘텐츠 접근성 지침(WCAG)를 기반으로 하며, WCAG는 웹 개발자와 디자이너가 웹 사이트를 보다 접근성 있게 만들기 위한 국제 표준입니다.

알고 있던 것.

1. Aria-rabel을 이용한 접근성 향상.
2. sementic-tag를 이용한 접근성 향상.
3. 다크모드
4. 국제화,

이 두가지를 통해 웹 접근성을 향상 시킬 수 있음을 기존에 알고있었습니다.

배우게 된 것.

1. 기획과 디자인으로의 접근.

   글자색과 배경색의 명암비를 충분히 확보한다. WCAG 2.1레벨 AA 명암비가 필수이다.

   
   색각이상에 대한 접근을 고려한 명암비를 고려하고, 이를 디자인 시스템에 적용 시켜야만, 더욱 접근성있는 웹을 개발할 수 있다.
   이는 디자이너의 영역이지만, 디자인 시스템을 만들게 되는 개발자의 입장에서는 반드시 고려해야 할 영역이라고 생각한다.
2. 상호작용

   자동으로 시작해서 5초 이상 움직이는 콘텐츠를 만들지 않는다.

• Line Engineering에서는 처음 페이지의 기획에서 항상 회전하는 링을 고려했다고 한다. 전,후를 비교하면 접근성을 지킨 첫 페이지의 모습이 더욱 글에 집중도가 올라가는 것이 느껴졌다.
  • 개선 전 페이지의 모습
    
    
  • 개선 후 페이지의 모습
    

3. Frontend 개발
   • 키보드 제어

     마우스나 터치 조작 등을 이요한 제어를 키보드만으로 할 수 있게 만든다.

     이는 개발을 할 때 전혀 고려하지 못했던 부분이고, 이러한 접근 방법에 대해서 더 찾아 봐야겠다는 생각이 들었다.
   • SEO 최적화

     브라우저와 지원 기술, 크롤러 등이 HTML 구문을 정확히 분석할 수 있게 한다.

     접근성 향상이 크롤러도 포함이 된다. 라는 사실을 알게 되었다.
     이를 해결하기 위해 xml 파일을 작성하여 Google Search Console로 인덱싱하도록 하는 방법이 있었다.

결론

접근성의 영역은, 끊임없이 개발자가 고민 해야만 하는 영역이라고 생각합니다.
특히 오늘 알게된 xml을 이용한 SEO 최적화 기법, 키보드 제어에 대한 고려를 이용한 개발을 실험해봐야 겠다고 생각이 들었습니다.

이외에도 청각장애인을 위한 스크린리더 경험 향상 등 단순해 보이는 Web이 더욱 디테일한 부분까지 신경쓰고 있었다는점이 놀랍고 나도 이를 모두 고려할 수 있는 개발자로서 성장하고싶다.

• 접근성 검사를 위한 사이트
  • 웹접근성 진단 서비스
    
  • 명도대비 확인 서비스
  • 마크업, 웹 접금성 오류 확인 및 웹표준 검사