버튼은 button태그. anchor태그는 페이지 이동. input에 label을 매칭 못할 때는 title 사용. a링크 텍스트에 aria-label="" a href="javascript:void(0)" 대체텍스트는 aria-label 적용. aria-label적용이 아닐 시 sr-only 클래스 적용. .sr-only { position:absolute; overflow:hidden; width:1px; height:1px; margin:-1px; padding:0px; clip:rect(0,0,0,0); } 마크업은 탭 포커스 위치로 만든다.(팝업의 닫기버튼은 마지막에 적용되야 함) 부트스트랩은 마크업 웹접근성을 참고하기 좋다. Q. sr-only가 있는데 왜 font-size:0px을 사용할까?..

웹접근성 주의할 부분 1. label || title form에서 label과 input이 들어갈 때 label에 input 의 아이디를 넣어 연결시켜준다. 하지만 label이 없을 경우 input에 title=""를 넣어 명시해준다. 2. aria-hidden 화면상 숨겨지거나 가려진 콘텐츠 ARIA를 적용하여 모바일 스크린리더기가 접근하지 않도록 구현. undefined(default) true 접근성 API 차단. (화면표시 여부와 무관 API 차단) false 접근성 API 사용. (화면에 표시한 경우 API 사용) aria-hidden vs hidden aria-hidden :: 화면에 표시되나 접근성API(보조기기 접근 가능성) 차단 상태 결정. hidden :: 화면에 표시되지 않아 접근 불..