HTML Image Slider | Make Carousel Web Accessible with Start and Stop Buttons.
Today, we will make the HTML slideshow or carousel web-accessible using HTML5 Semantics, WAI-ARIA Attributes, and simple Javascript.
Slideshows are a collection of items, displaying one at a time, these are commonly used for image galleries for products, and for news headlines.
Do watch the video till the end and let me know for what purpose are you using a Carousel or slideshow in your application?
You can connect with me on Social Media:
🕊 Twitter: / skillssingh
✈ Telegram: https://t.me/webAccessibilityTutorials
🤖 Discord: / discord
📚 Materials/References:
🕸 GitHub Code: https://github.com/skillssingh/ADASer...
🖼Images: https://unsplash.com/
🛠aXe Devtool: https://www.deque.com/
Please refer to the following timeline to jump to the section that you are interested in:
Timecodes
0:00 - What is a Carousel?
0:35 - Need for Web Accessible Slideshows?
1:01 - Intro to Skills Singh channel
1:23 - Carousel: Accessibility behavior
2:00 - Code to make a slideshow Web Accessible?
21:06 - What JAWS announces for a slideshow/carousel?
Thank you for your continued support in liking, sharing, and watching my videos.
Hit the SUBSCRIBE Button for more educational videos on Web Accessibility.
#Accessibility #carousel #slideshow