접근성을 위한 role

<input type="image" src="btn-submit.png" role="button">

class 속성을 사용하는 것과 유사하다. 예를 들어 type image인 요소를 버튼처럼 사용하려면 다음처럼 해당 input 요소의 속성에 button 값을 저장하면 된다.
이 방법의 장점은 개발자 스스로 input 이미지의 역할이 버튼이라는 것을 바로 알수 있다는 것이다. 더 깊이 생각해보면 브라우저나 기타 다른 기기, 장애인과 더불어 모든 사용자가 더 쉽게 이 요소에 접근할 수 있다는 장점도 있다.

aria- 접두어를 사용하여 요소의 상태를 정의

<input type="image" src="btn-submit.png" role="button" aria-pressed="false"> <!-- 마우스 클릭 여부 -->

해당 요소가 선택되거나 엔터 키가 입력되었을 때 자바스크립트를 사용해서 aria-pressed 상태 값을 변경할 수 있다.

출처: https://webdir.tistory.com/89 [WEBDIR]