Save 37% off PRO during our Black Friday Sale! »

Rescue the Dead Horse

32b23faedcb33ad2079ad33658ac56bb?s=47 Eva Ferreira
September 07, 2021
Programming
0
100

Rescue the Dead Horse

A talk about Accessibility Technical Debt

32b23faedcb33ad2079ad33658ac56bb?s=128

Eva Ferreira

September 07, 2021
Tweet

More Decks by Eva Ferreira

See All by Eva Ferreira
32b23faedcb33ad2079ad33658ac56bb?s=48 evaferreira
0
67
32b23faedcb33ad2079ad33658ac56bb?s=48 evaferreira
1
49
32b23faedcb33ad2079ad33658ac56bb?s=48 evaferreira
3
440
32b23faedcb33ad2079ad33658ac56bb?s=48 evaferreira
1
88
32b23faedcb33ad2079ad33658ac56bb?s=48 evaferreira
1
160

Other Decks in Programming

See All in Programming
11cbdce6fef8ae507d51b96dca4a0ec5?s=48 sksat
1
330
7eca3e06edc3c69004aaf57de51900c2?s=48 ajstarks
3
4.8k
B9d723a1439affc92fcd589446f73d3b?s=48 yukukotani
2
220
A10e41b0a61d59f2258d7f6172c33479?s=48 kaityo256
2
100
15934fa2aa7b2ce21f091e9b7cffa856?s=48 manfredsteyer
PRO
0
270
198d69383210fbec8c6bea4a35863c9d?s=48 tippy
0
2.3k
8d6f91b92f4408a5ed8a4675f9034339?s=48 arigatobank
1
130
8f84b7d8869ef6005d89b378e8661f7c?s=48 masuda220
PRO
8
4.3k
5afbf65e9e32cef9ab74e5b5347a5bce?s=48 korosuke613
0
8.1k
587223eccffb4d264fd18bb9d54cd1d9?s=48 webdevwithmatt
0
250
265bcbb56e831266de7a9f9281aab57a?s=48 appleboy
1
870
635e53b96114c922fa5486b418895960?s=48 fadis
7
4.3k

Featured

See All Featured
64827b31aef81498662e8af4bd6d5157?s=48 jonrohan
1021
410k
4394ceb8b277f35ee3da7030384efb5d?s=48 davidbonilla
75
3.8k
3ab1249be442027903e1180025340b3f?s=48 reverentgeek
172
7.8k
Fde6c3a50ca518a909ef35c22c0ee0e4?s=48 destraynor
148
20k
9cde37f47e4a800ea081ea42de8d749a?s=48 dougneiner
56
5.6k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
498
130k
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
129
22k
E195ae45320d9202eaa01c9f1d31a416?s=48 marktimemedia
15
750
245cee81a9c424266e5e401d844ea881?s=48 lara
27
3.5k
Aff5641764408271f7bc398f2097edd0?s=48 denniskardys
223
120k
78b475797a14c84799063c7cd073962f?s=48 holman
451
140k
1ce0eb06fd6a9e9566a0cb310cfee635?s=48 jrick
PRO
1
19k

Transcript

  1. Rescue the Dead Horse Eva Ferreira – Shift Conference, 2021

  2. First trip since Feb. 2020

  3. Hi! I’m Eva :)

  4. Dead horse? @evaferreira92

  5. Beating a Dead horse @evaferreira92

  6. To waste time and effort trying to do something that

    is impossible. “ ” Mr. Merriam-Webster

  7. Tech Debt.

  8. TECH DEBT.

  9. Memes as a coping mechanism

  10. @evaferreira92

  11. @evaferreira92

  12. @evaferreira92

  13. @evaferreira92

  14. @evaferreira92

  15. @evaferreira92

  16. @evaferreira92

  17. None

  18. What is Technical Debt? And… what isn’t Technical Debt?

  19. ¿Bad Code?

  20. Bad Code = Lack Lack of knowledge, lack of caring,

    lack of quality control

  21. Bad code is usually more harmful than Techical Debt @evaferreira92

  22. ¿Tech Debt?

  23. Technical Debt is a conscious Trade-off

  24. It happens when we choose to gain something otherwise-unattainable immediately

    in return for paying it back (with interest) later on. “ ” Mr. Harry Roberts

  25. It happens when we choose to gain something otherwise-unattainable immediately

    in return for paying it back (with interest) later on. “ ” Mr. Harry Roberts

  26. The Theming Example

  27. !important all the things

  28. This is my garbage and I’m proud of it. @evaferreira92

  29. @evaferreira92

  30. @evaferreira92

  31. Congrats! You have just created Technical Debt! Now… will you

    repay? @evaferreira92
  32. None
  33. None

  34. Consequences of not repaying • Accumulates interests • Snowball effect

    • Team members are sad @evaferreira92

  35. Repaying Tech Debt The Accessibility Part

  36. An annual accessibility analysis of the top 1,000,000 home pages

  37. How many passed a basic WCAG test?

  38. WCAG includes (but not limited to) • Alternative texts for

    images • AA Contrast ratios • Labels for inputs • Document language attribute • Buttons and links with discernable texts @evaferreira92

  39. At least 20%? @evaferreira92 At least 10%? At least05%?

  40. At least 20%? @evaferreira92 At least 10%? At least05%?

  41. At least 20%? @evaferreira92 At least 10%? At least05%?

  42. At least 20%? @evaferreira92 At least 10%? At least05%?

  43. Only 2,6% passed. @evaferreira92

  44. Most common errors • Lack of alternative texts for images

    • Non-compliance color contrasts • Lack of labels for inputs • Lack of document language attribute • Buttons and links without discernable texts @evaferreira92

  45. <html lang="es">

  46. Fun facts “Despite being 2021, 14,501 home pages had <marquee>

    and 341 home pages had blinking content (<blink> or text-decoration: blink).” https://webaim.org/projects/million/

  47. Why does this happen? Lack of accessibility is more often

    than not, a conscious trade-off.
  48. None

  49. How do we begin repaying? Repaying accessibility technical debt

  50. Current Tech Debt Improvements to current a11y bugs

  51. Spare time to improve it • Small, well-defined tasks 

    15% of sprint • Fix bugs • Rebuild broken components • Build new features  Skip navigation, etc. @evaferreira92

  52. Track and document @evaferreira92

  53. None

  54. You can’t repay what you don’t acknowledge @evaferreira92

  55. Avoid creating more (Accessibility Technical Debt)

  56. Long term warning! The following recommendations might take soooome time

  57. Cultural change in the company You need people who care.

    @evaferreira92

  58. Update processes • Automated tests  Built into CI •

    Manual tests • QA Process • Internal demos with Screen Reader @evaferreira92

  59. Design Systems • Fix a11y here!  Colors, contrast, font-sizes,

    font families  Labels and alts • Whatever what Brad Frost and Jina Anne say @evaferreira92
  60. None

  61. https://bradfrost.com/blog/post/enforcing-accessibility-best-practices- with-automatically-generated-ids/ by Brad Frost

  62. @evaferreira92

  63. Hire Front-end developers @evaferreira92

  64. Hire Front-end developers @evaferreira92

  65. No code can fix bad design. If the design is

    inaccessible, so is the website.

  66. Bad UX flows

  67. None
  68. None
  69. None

  70. @evaferreira92

  71. Team work It’s not 1999 with webmasters doing the whole

    thing anymore
  72. None

  73. You can’t avoid Tech Debt But you CAN avoid putting

    the burden on users with disabilities

  74. Thank you! @evaferreira92