Search

Newsletter Editor: Perform accessibility test

Reading time: 2 min
Accessible emails are the key to inclusion. They ensure that every recipient, regardless of their abilities or limitations, can easily understand your content. Your mailing provides a better user experience, strengthens your brand and can even lead to higher conversion rates.

In our article Criteria for accessibility testing for your emails we have summarized further information and shown how important accessibility tests are.

How the accessibility test works in our newsletter editor:

  1. Open the mailing for which you want to carry out the test via the menu item Emails.


  2. At the top right under Preview you will find the item Accessibility test.

  3. A pop-up window opens across the entire page. Here you can View your existing test quota, carry out tests, buy more tests and retrieve previous tests.

  4. Click on Start accessibility test. Your mailing will be scanned and you will receive the following overview: 


    Under the tab Improvements you will find the criteria that you should adjust. Click on the down arrow on the right to get more information and to see and to see which HTML snippet is affected. In the table  Explanations of the rule IDs (improvement suggestions) at the end of this article you will find further explanations.
  5. Click on the x in the top right-hand corner to return to the editor and adjust the improvement suggestions there.
  6. Click on Preview again once you have made your adjustments > Accessibility test. You can click on Retrieve previous test (see screenshot step 3) to view the suggestions again or click on Start accessibility test to run the test again for a check. to run the test again.

Explanations of the rule IDs (suggestions for improvement after the test)

Your mailing is checked for these rules with the accessibility test (see screenshot step 4):

Rule ID Description
accesskeys Ensures every accesskey attribute value is unique
area-alt Ensures <area> elements of image maps have alternate text
aria-allowed-attr Ensures ARIA attributes are allowed for an element's role
aria-allowed-role Ensures role attribute has an appropriate value for the element
aria-hidden-body Ensures aria-hidden='true' is not present on the document body.
aria-progressbar-name Ensures every ARIA progressbar node has an accessible name
aria-required-attr Ensures elements with ARIA roles have all required ARIA attributes
aria-required-children Ensures elements with an ARIA role that require child roles contain them
aria-required-parent Ensures elements with an ARIA role that require parent roles are contained by them
aria-roledescription Ensure aria-roledescription is only used on elements with an implicit or explicit role
aria-roles Ensures all elements with a role attribute use a valid value
aria-toggle-field-name Ensures every ARIA toggle field has an accessible name
aria-tooltip-name Ensures every ARIA tooltip node has an accessible name
aria-valid-attr-value Ensures all ARIA attributes have valid values
aria-valid-attr Ensures attributes that begin with aria- are valid ARIA attributes
color-contrast Ensures the contrast between foreground and background colors meets WCAG 2.0 AA minimum contrast ratio thresholds
content-type Ensures "meta content-type" and character set are defined
definition-list
Ensures <dl> elements are structured correctly
dlitem
Ensures <dt> and <dd> elements are contained by a <dl>
document-title

Ensures each HTML document contains a non-empty <title> element
duplicate-id Ensures every id attribute value is unique
empty-heading Ensures headings have discernible text
heading-order Ensures the order of headings is semantically correct
html-has-lang Ensures every HTML document has a lang attribute
html-lang-valid Ensures the lang attribute of the <html> element has a valid value
html-xml-lang-mismatch Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page
image-alt Ensures <img> elements have alternate text or a role of none or presentation
image-redundant-alt Ensure image alternative is not repeated as text
justification Ensures body content is not center aligned
landmark-no-duplicate-main Ensures the document has at most one main landmark
landmark-unique Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
link-name Ensures links have discernible text
list Ensures that lists are structured correctly
listitem

Ensures <li> elements are used semantically
meta-viewport-large Ensures <meta name="viewport"> can scale a significant amount
meta-viewport Ensures <meta name="viewport"> does not disable text scaling and zooming
object-alt Ensures <object> elements have alternate text
page-has-heading-one Ensure that the page, or at least one of its frames contains a level-one heading
presentation-role-conflict Flags elements whose role is none or presentation and which cause the role conflict resolution to trigger.
role-img-alt Ensures [role='img'] elements have alternate text
tabindex Ensures tabindex attribute values are not greater than 0
table-roles Ensures table roles are defined
svg-img-alt Ensures <svg> elements with an img, graphics-document or graphics-symbol role have an accessible text
valid-lang Ensures lang attributes have valid values

Help & Support

If you have any questions or need help, you can always contact our service team.