Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Rescue the Dead Horse

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Eva Ferreira Eva Ferreira
September 07, 2021
Programming
180
0

Rescue the Dead Horse

A talk about Accessibility Technical Debt

Avatar for Eva Ferreira

Eva Ferreira

September 07, 2021

More Decks by Eva Ferreira

See All by Eva Ferreira
Criptografía para enamorados 💖
Avatar for Eva Ferreira evaferreira
0
30
Cryptography for lovers 💖
Avatar for Eva Ferreira evaferreira
0
54
Bulletproof your Design system
Avatar for Eva Ferreira evaferreira
0
110
Good intentions gone bad
Avatar for Eva Ferreira evaferreira
0
310
Bulletproof your Design System
Avatar for Eva Ferreira evaferreira
0
180
Tales of Accessibility Failures
Avatar for Eva Ferreira evaferreira
0
90
Tales of Accessibility Failures
Avatar for Eva Ferreira evaferreira
0
250
La accesibilidad de todos los días - HackAcademy
Avatar for Eva Ferreira evaferreira
0
170
De 45 a 85
Avatar for Eva Ferreira evaferreira
0
140

Other Decks in Programming

See All in Programming
20260828_品質と開発生産性を両立させる、AI時代のE2Eテストの考え方
Avatar for MagicPod magicpod
0
120
数年滞っていたダークモード対応をおよそ2週間で完了させる
Avatar for Kazuki Chigita chigichan24
0
650
PyO3 で既存 Python 評価器を Rust core 化する ー wasm-bindgen でブラウザにも配るための設計
Avatar for 𝕂' kdash
1
340
kubernetes コンポーネント開発入門 / 新卒N年目の勉強会&交流会！〜〇〇への誘い〜 #n_study
Avatar for mazrean mazrean
0
160
FastAPI の並行処理モデルを完全に理解する
Avatar for Yuki Ishikawa hoto17296
9
3.7k
【DroidKaigi 2026】「アクセシビリティを利用するとき、 アクセシビリティもまたこちらを利用している」 〜マルウェアによる攻撃と防衛について〜
Avatar for HalunoYo. halunoyo
0
300
LoopHub - ローカルで動く GitHub で、AI と共同開発
Avatar for jugyo jugyo
0
370
이 함수, 실패하면 어떻게 되나요? null부터 Rich Errors까지, Kotlin 에러 처리 15년
Avatar for TaeHee Lee haeti2
0
120
Jindong: Introducing Declarative Haptics in Compose Multiplatform
Avatar for HyunWoo Lee l2hyunwoo
0
140
片田舎のおっさん、 Swift Buildのダイアモンド問題解決の不具合修正PRを出すが、解決方法がキャッシュをしないようにすることであり、ビルド時間が伸びると言われてマージされないので高速化もする/swiftbuild
Avatar for yimajo yimajo
0
340
Webエンジニアなのにブラウザの仕組みがわからないので、Pythonで自作してみた
Avatar for Tatsuki tatsuki12
4
1.6k
30年振りにコンパイラの定数整数除算を改善した
Avatar for herumi herumi
9
4.4k

Featured

See All Featured
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
300
How to make the Groovebox
Avatar for あそなす asonas
2
2.4k
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
310
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
23k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
Evolving SEO for Evolving Search Engines
Avatar for Ryan Jones ryanjones
0
280
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
123
22k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.3k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
1k
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
3.2k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.6k

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