WCAG 2.1: 1.3.6 Identify Purpose – How do you meet the icon requirements for this?

WCAG 2.1 has officially been released so I'd like to try to support it as much as I can.

I'm having difficulty understanding guideline 1.3.6 (Identify Purpose). https://www.w3.org/WAI/WCAG21/Understanding/identify-purpose.html

These are the examples it gives on how to pass this criterion:

  1. A website uses ARIA landmarks to identify the regions of the page,
    and users can hide areas that are not the 'main'.
  2. The links in the navigation of a website are marked-up so that users can add their own icons.
  3. Icons on a website are marked-up so that the user can substitute their own icon set into the page.

I'm fine with the first point. That basically means correctly using the new HTML5 elements <header>, <footer>, <main>, <article>, <aside>, and <section>.

The other two points (that are completely unrelated to the first point) I've got no idea on how to comply with those. I don't think the markup for such a thing even exists at the moment.

Does anyone know how to comply with points 2 and 3?

(Not using any icons on your site doesn't count as an answer).

Tags: