이 레포지토리는 웹 접근성에 대한 개인적인 가이드라인을 적어놓을 목적으로 만들어졌습니다.
Bad
<a href="#" onclick="close()">X</a>
Good
<a href="#" role="button" onclick="close()">X</a>
Best
<button aria-label="Close" onclick="close()">X</button>
레이블을 숨기는 것 대신 aria-label
을 사용합니다.
Bad
<button onclick="close()">X</button>
Good
<button onclick="close()">
X
<span style="position: absolute; top: -9999px; left: -9999px;">Close</span>
</button>
Best
<button aria-label="Close" onclick="close()">X</button>
Bad
<span>18 hours ago</span>
Good
<time datetime="2017-10-30T07:17:04Z">18 hours ago</time>
Best
<time datetime="2017-10-30T07:17:04Z" title="Oct 30, 2017 04:17 PM">18 hours ago</time>
모든 이미지에 alt
텍스트를 적용합니다. (더 읽기)
Bad
<img src="/IronMan/mark-3.jpg"/>
Good
<img src="/IronMan/mark-3.jpg" alt="Iron man, mark 3"/>