Mohit Savaliya
Design for Diversity: Mastering Accessibility with WordPress
v
Mohit Savaliya
v
Speaker & Trainer
v
SME (UI/UX & Graphic Design)
v
Design Community Founder
Need 2 Strangers on the Stage
I am Raj
A Visually Impaired Person
I am Raj
A Visually Impaired Person
1.3 Billion
16% of the world’s population has some degree of disability.
What Does this
MEAN???
India
China
1.45 Billion
1.41 Billion
Let’s Understand Accessibility
Access
the right or permission to enter, approach, or use something
Capacity or
Power of doing
something
Ability
Accessibility
means making sure everyone can access and use things, no matter their abilities.
Types of Disability
Vision
Low vision or blind or Color Blind
Hearing & Speaking
Completely Deaf & Dumb or Can’t hear or speak properly
Cognitive
Mentally Challenged or Memory loss or depressed
Mobility
Not able to move or handicap
These people can’t access your beautifully crafted Websites/Apps
14,000
Year 2017 - 2021
3,000
Year 2022
4600
Year 2023
Web Accessibility lawsuits filed in USA
The Solution to these…
WCAG
Web Content Accessibility Guidelines
POUR Principles
P Perceivable
O Operable
U Understandable
R Robust
How can we make accessible Website in
WordPress?
Let’s understand
Perceivable
Users must be able to perceive the content on the website using their senses.
Use Alt Text for Images
Ensure Proper Contrast Ratios
Add Transcripts & Captions for Media
HTML5 Video Player – mp4 Video Player Plugin and Block
Operable
Make the interface and navigation usable for everyone, including keyboard-only users.
Enable KB Nav. & Skip to Content
Use accessibility-compliant themes
Avoid Automatic Content Movement
Smart Slider 3 MetaSlider
Use Controllable Sliders Like
Understandable
Make content and interfaces easy to understand for all users.
Use Clear and Consistent Navigation
Keep menus, layouts, and buttons consistent across all pages
Clear Error Messages
For forms, display clear and descriptive error messages
Readable Fonts
Set a minimum font size of 16px
Robust
Ensure content and functionality are compatible with a wide range of devices and assistive technologies.
Responsive Design
Website works seamlessly on mobile, tablet, and desktop
Test with Assistive Tools
Test screen readers like NVDA or VoiceOver with Website
Braille Displays
Audio Labeler
Let’s Connect
savaliyamohit5/
Thank You