When designing for accessibility in Ceros, it’s important to take note of the layout of your assets on the canvas, as this will impact the order in which a screen reader reads out the experience. When you select an asset, you’ll see that each asset on your canvas will have a blue bounding box around it.
A screen reader is going to use these bounding boxes to determine the order it will read the content out loud. The screen reader will navigate the experience and read out each asset based on the topmost part of the bounding box, from the top down and left to right.
If you’d like more control over the order your content is being read out, you can group assets together to have them in the same bounding box. This will ensure that those assets are read out together. So, for example, if you group together a few different text boxes, they will have the same larger bounding box. When a screen reader hits that bounding box, it will read out everything grouped in that bounding box from the top down and left to right.
So in the screenshot above, you’ll see the 4 text bubbles have been grouped together. So a screen reader would read all of those assets first from the top down and left to right (Layout, Header, HTML, SEO), before then reading out the computer image last, as the computer is not within the group and has a lower bounding box on the canvas.
If you have any questions on how to best lay out your content for accessibility, be sure to reach out to your Customer Success Manager here at Ceros.