visuallyhidden1 [css-real] 웹접근성을 고려한 .blind(hidden) 처리 스크린리더와 브라우저별, 그리고 매해 업데이트되는 내용들 때문에 여간 웹 접근성을 지키며 블라인드 처리하기가 쉽지 않다. 그래서 '이 방법으로 해결될 수 있습니다~'라는 방법은 아직 없다고 봐야 한다. 이 글에서는 잘못 쓰이고 있는 blind 처리 방법들과, 해외의 훌륭하신 분들이 다수의 리딩 테스트를 거쳐 공개한 코드들을 소개하려고 한다. 우선, 기본으로, display:none과, visibility:hidden, font-size:0, line-height:0, width:0; height:0과 같이 화면상 영역을 지니지 않게 하는 속성들은, 스크린 리딩 시 화면에 없는 영역으로 판단해 스킵한다. 따라서 blind 처리 시 위 요소 중 단 한 개라도 들어가서는 안된다. 한 줄 안에 들어가는 내용은 .. 2021. 1. 20. 이전 1 다음
