Skip to main content

Design e Conteúdo

0%
Progresso de Conclusão (0 / 18)

Princípios Gerais​

  • Usa design responsivo para que a interface se ajuste ao usuário (tamanho da tela, orientação, zoom). [13] [15] [NBR]
  • O conteúdo não sofre perda ou sobreposição de informações ao ser ampliado com o zoom do navegador em até 200%. [15]
  • Garante que áreas de toque (botões, links) tenham no mínimo 44x44 pixels. [17]
  • Garante espaço suficiente entre elementos interativos para evitar cliques acidentais. [17] [NBR]

Cores​

  • Não usa cores como o único meio para transmitir informação (use ícones, sublinhados ou texto). [5] [NBR]
  • Garante um contraste de cores adequado entre fundo e textos. [18] [NBR]
  • Garante contraste de cores para informações em imagens, gráficos e ícones. [18] [NBR]

Tipografia​

  • Usa fontes fluidas e de fácil entendimento (evitar fontes rebuscadas ou manuscritas). [18] [NBR]
  • Evita o alinhamento justificado em blocos de texto (preferir alinhamento à esquerda). [18] [NBR]
  • Tamanho mínimo recomendado é de 18pt (ou 14pt em negrito) para boa legibilidade. [18] [NBR]

Conteúdo​

  • Utiliza o termo "pessoa com deficiência" (PcD). [18] [NBR]
  • Constroi textos descomplicados e objetivos, evitando ambiguidades e figuras de linguagem. [18] [NBR]
  • Evita frases muito longas (ideal: 15 a 20 palavras por frase) e prefere a ordem direta. [18] [NBR]
  • Inclui legendas, audiodescrição e janela de Libras para vídeos. [2] [18] [NBR]
  • Utiliza a primeira letra de cada palavra em maiúsculas (CamelCase) em hashtags (Ex: #AcessibilidadeDigital). [18] [NBR]

Layout e Estrutura​

  • Cria uma hierarquia visual clara, usando títulos, espaçamentos e fontes para guiar o usuário. [16] [18]
  • Estrutura o conteúdo de forma lógica e previsível. [4] [16]
  • Usa Breadcrumbs (trilha de navegação) para informar a localização atual do usuário em sites complexos. [18]

Referências Bibliográficas​

[1] WCAG 2.2 Understanding Docs. SC 1.1.1 Non-text Content (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html. Acesso em: 9 Mai. 2024.

[2] WCAG 2.2 Understanding Docs. SC 1.2.2 Captions (Prerecorded) (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/captions-prerecorded.html. Acesso em: 9 Mai. 2024.

[3] WCAG 2.2 Understanding Docs. SC 2.3.1 Three Flashes or Below Threshold (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/three-flashes-or-below-threshold.html. Acesso em: 9 Mai. 2024.

[4] WCAG 2.2 Understanding Docs. SC 1.3.1 Info and Relationships (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html. Acesso em: 9 Mai. 2024.

[5] WCAG 2.2 Understanding Docs. SC 1.4.1 Use of Color (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/use-of-color.html. Acesso em: 9 Mai. 2024.

[6] WCAG 2.2 Understanding Docs. SC 2.4.7 Focus Visible (Level AA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/focus-visible.html. Acesso em: 9 Mai. 2024.

[7] WCAG 2.2 Understanding Docs. SC 2.4.1 Bypass Blocks (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/bypass-blocks.html. Acesso em: 9 Mai. 2024.

[8] WCAG 2.2 Understanding Docs. G201 Giving users advanced warning when opening a new window. Disponível em: https://www.w3.org/WAI/WCAG22/Techniques/general/G201. Acesso em: 9 Mai. 2024.

[9] WCAG 2.2 Understanding Docs. SC 3.2.2 On Input (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/on-input.html. Acesso em: 9 Mai. 2024.

[10] WCAG 2.2 Understanding Docs. SC 1.3.5 Identify Input Purpose (Level AA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html. Acesso em: 9 Mai. 2024.

[11] WCAG 2.2 Understanding Docs. SC 1.4.2 Audio Control (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/audio-control.html. Acesso em: 9 Mai. 2024.

[12] WCAG 2.2 Understanding Docs. SC 2.1.1 Keyboard (Level A). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html. Acesso em: 9 Mai. 2024.

[13] WCAG 2.2 Understanding Docs. SC 1.3.4 Orientation (Level AA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/orientation.html. Acesso em: 9 Mai. 2024.

[14] WCAG 2.2 Understanding Docs. SC 4.1.1 Orientation (Level). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/parsing.html. Acesso em: 9 Mai. 2024.

[15] WCAG 2.2 Understanding Docs. SC 1.4.10 Reflow (Level AA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/reflow.html. Acesso em: 9 Mai. 2024.

[16] WCAG 2.2 Understanding SC 2.4.6 Headings and Labels (Level AA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/headings-and-labels.html. Acesso em: 9 Mai. 2024.

[17] WCAG 2.2 Understanding Docs. SC 2.5.5 Target Size (Enhanced) (Level AAA). Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/target-size-enhanced.html. Acesso em: 9 Mai. 2024.

[18] GUIA DE BOAS PRÁTICAS PARA ACESSIBILIDADE DIGITAL. Disponível em: https://www.w3.org/WAI/WCAG22/Understanding/target-size-enhanced.html. Acesso em: 9 Mai. 2024.

[NBR] ABNT NBR 16225:2025, Acessibilidade em conteúdo e aplicações web – Requisitos. Disponível em: https://mwpt.com.br/wp-content/uploads/2025/04/ABNT-NBR-16225-Acessibilidade-Digital.pdf

Bibliografia​

DINIZ, V.; FERRAZ, R.; NASCIMENTO, C. M.; CREDIDIO, R. Guia de Boas Práticas para Acessibilidade Digital. Programa de Cooperação entre Reino Unido e Brasil em Acesso Digital, 2023. Disponível em: https://www.gov.br/governodigital/pt-br/acessibilidade-e-usuario/acessibilidade-digital/guiaboaspraaticasparaacessibilidadedigital.pdf. Acesso em: 9 Mai. 2024.