Accessibility Is Easy, Or The 5 Deadly Sins of Accessibility

, ! , Frontend- Delivery Club. . , . 5 , . , , , . , , , — .

, , %username%, 80/20: 80% 20% , 20% 80% . .

, NVDA, VoiceOver , — , , , , . - , .

, , , . , , , , , .

1.  

HTML , H1 H6 , . 

(, , ) H1—H6 . , , , .

. , H1, . H2. , H3, , H2.

, H1, H2 , , H4.

, , , , , . , . 

• H1—H6.

  
  
  
  
  

• H1 H6. 

  
  
  
  
  

2.  

: , ? , ? , , ? , , - button, .

, div CSS. , , div, JavaScript , - , . , .

button, , , aria-label , button.

, , , , button, button, button, button…. 

•   . 

  
  
  
  
  

3.  

. - . alt ( ), , , .

alt — , , , . . , «» «», .

alt , , . Facebook , , alt. 

• alt.

  
  
  
  
  

4.

. - , , - , , . , , , .

, , , , , , . , . 

label, input. , .

. , , .  

, , reCaptcha . , . , , .

 

• label .

  
  
  
  
  

• , .

  
  
  
  
  

5:  

10 , , , , , .

, , . .

 

• , .

  
  
  
  
  

• , .

  
  
  
  
  

• , .

  
  
  
  
  

, , . , , , . , accessibility , , !

!