Accessibility Order Helper

About this plugin

Easily generate numbered markers for documenting Focus Order or Reading Order, aligned with the following WCAG success criteria 2.4.3: Focus Order.

By default, the sequence follows a top-to-bottom, left-to-right logic.

How it works

1. Open the plugin.
2. Select the elements/layers that should be part of the reading/focus order.
3. Click Generate Sequence.
4. Markers will be automatically added in order, in a grouped layer.
5. Need to add one more? Just duplicate a marker, place it, and click Reorder to update the sequence.

Customizable

You can also customize the marker style by editing the base component — changes will reflect across all markers in your file.

by Rodrigo Matos - Accessibility & Design System Specialist

=============================

[PT-Br]

Gere facilmente marcadores numerados para documentar a Ordem de Leitura da tela ou Ordem de Foco, alinhado ao critério WCAG 2.4.3: Focus Order.

Por padrão, a sequência segue uma lógica de cima para baixo e da esquerda para a direita.

Como funciona:

1. Abra o plugin.
2. Selecione os elementos que devem fazer parte da ordem de leitura ou de foco.
3. Clique em "Generate Sequence".
4. Os marcadores serão adicionados automaticamente em sequência, em uma camada agrupada.
5. Quer adicionar mais um? Basta duplicar um marcador, posicioná-lo no novo elemento e clicar em Reorder para atualizar a numeração.

Customizável

Você também pode personalizar o estilo dos marcadores editando o componente-base — as alterações serão aplicadas a todos os marcadores do arquivo.

por Rodrigo Matos - Accessibility & Design System Specialist