How To Build More Accessible Websites with Wagtail
summary
Workshop shows concrete wins not fluff: cites 96.3% of websites have accessibility issues, walks through WCAG basics, installs Wagtail, and demonstrates the Wagtail accessibility Checker (axe engine) plus browser tools and CI-friendly linters. It builds a blog, adds a custom image model for alt text, implements streamfield blocks, and enforces heading and image validation so editors can’t save broken content. Demos run live and the fixes validate immediately, not just promised.
AI-written summary · about
chapters (21)
- 0:00Accessible website building with Wagtail
- 3:58Why web accessibility matters
- 8:56Common accessibility issues
- 11:06Who is responsible
- 14:40Wagtail CMS benefits
- 17:36Setting up Wagtail project
- 29:36Wagtail MVC structure
- 32:27Wagtail project structure
- 37:01Extending homepage model
- 44:03Creating homepage in Wagtail
- 51:15Homepage templates
- 56:39Basic blog structure
- 1:02:19Wagtail StreamField
- 1:15:33Wagtail accessibility checker
- 1:27:43Fixing accessibility issues
- 1:44:00Images and ALT text
- 2:02:08Editor guidance in Wagtail
- 2:16:09Testing site accessibility
- 2:30:43Screen reader testing
- 2:43:32Accessibility audit
- 2:53:53Q&A
related talks
41mBest Practices for Making a Wagtail Site as Accessible as Possible
28mDjango Accessibility for Everyone
23mWeb Accessibility In Django
37mAccessibility Matters: Creating a Better Web
22mAccessibility in Practice
26mProven ways to make your website accessible in 2023
25mBeyond Compliance: Testing for a more Accessible Web
30mTesting Web Accessibility