Last updated: Oct-31-2023
Thanks to accessibility features in Cloudinary's Product Gallery, including keyboard accessibility, alt-text for screen readers and multiple levels of zoom, all of your site's visitors can have an amazing experience.
This video is brought to you by Cloudinary's video player - embed your own!
This tutorial presents the following topics. Click a timestamp to jump to that part of the video.
|0:00||The people using your websites may have physical disabilities and be unable to use a mouse. Instead, they rely exclusively on their keyboard to navigate and learn about your products. Moreover, those with vision impairments turn to assistive technology in order to access content on the web.|
|0:51||Keyboard-only users can navigate to the Product Gallery on a page by using the
|1:29||Visitors' screen readers can provide important product details to those who are visually impaired. Descriptions of an item's colors, materials, textures and styles can help the customer make the right choice.|
|1:47||Additionally, adding alt-text can even benefit your search engine optimization efforts for your site, helping crawlers at Google and other services to better understand the content.|
To add alt-text descriptions, open your Cloudinary Console.
|1:58||Step 1: Visit the Media Library and double-click the asset you want to manage.|
|2:09||Step 2: Move to the Metadata tab and add a description in the contextual metadata section.|
|2:22||Step 3: Add your accessibilityProps to the Product Gallery, specifying the name of the metadata key and indicating the values are associated with the contextual metadata on the assets.|
|3:02||Add zoomProps to your Product Gallery to modify its default properties, allowing for a popup to appear with plus and minus icons.|
Product GalleryEmbed a Product Gallery in your Web or WordPress site
Upload ProgrammaticallyUse a Cloudinary SDK to upload media assets
Get Started with the CLISet up the CLI and get familiar with some basic commands
Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.