Articles on: Design

Accessibility options on Poptin

In this help guide, we shall discuss the various options for Accessibility available on Poptin one by one.

Autofocus

Our popups support Autofocus on input fields which is an accessibility-friendly feature. Autofocus automatically selects and focuses on the input fields of a popup so that visitors can fill in the relevant data required/asked in the popup. You can also disable Autofocus by following this help guide but it is not accessibility friendly and can also hurt conversions.

You can check out this image below we have added for reference from the WAVE extension analyzing one of our popups. WAVE is an accessibility evaluation tool:



Aria Label

We have provided the option for users to add their own Aria-labels into the popup from the Advanced Settings option in the Design settings of the popup. Aria-label is an attribute defined in the WAI-ARIA specification. This specification extends native HTML, allowing you to change the way an HTML element is "translated" into the accessibility tree. By default, an HTML element will use its text content as the accessibility label. But on Poptin, you can add your own Aria-labels too.



Image ALT Attribute

You can now add an ALT attribute to your images.ALT attribute or (alternative text) describes the appearance and function of an image. It's read aloud by screen readers usually used by visually impaired users and displays in place of the image in case it fails to load.



Custom Tab Index

We have recently added a feature that will enable you to set a custom Tab Index for each element on the popup. You can access the feature by clicking on the element and a small editing widget shall appear. You can expand the widget from the expand arrow on the left corner and find the Accessibility option at the right corner. You can edit the Aria label from this setting.
Tab index and navigation with a keyboard can be changed for custom navigation that will include the text elements - but you can use the 2 aria fields for that too.





If you do not use the custom indexes then the elements go in this order:

Inputs
Timer
Coupon
Image
Text,
Ticker
Submit
Close
Link buttons
X button

ESC to close the popup

Visitors can close the popup using the ESC button as well

Thank You Screen

You can add a thank you screen for more After Submission information. Refer to this help article on how to add a thank-you screen

You can read more about our accessibility features here

Note: Poptin is ADA-compliant. You can learn more about ADA compliance here

Updated on: 15/11/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!