Acessibilidade no Design System

Acesso Restrito!

Para acessar o conteúdo, você precisa de uma assinatura ativa!

Acesso Restrito!

Para acessar o conteúdo, você precisa de uma assinatura ativa!

Os fundamentos de um Design System

0
0

Acessibilidade no Design System

Acessibilidade no Design System

Acessibilidade é um tema importante para garantir que todos os usuários possam acessar e utilizar os conteúdos online sem dificuldades. Para orientar o desenvolvimento de produtos digitais acessíveis, são utilizados quatro princípios fundamentais, conhecidos como:

  • Perceptível: O primeiro princípio é "Perceptível". Isso significa que os usuários devem ser capazes de perceber as informações digitais de forma clara. Isso inclui garantir que imagens tenham descrições alternativas para pessoas com deficiência visual, que o contraste de cores seja adequado e que legendas sejam fornecidas para conteúdos de áudio.

  • Operável: O segundo princípio é "Operável". Um site deve ser fácil de operar e interagir, com uma navegação simples. Isso significa que os usuários devem conseguir encontrar e utilizar os recursos do site de forma intuitiva.

  • Compreensível: O terceiro princípio é "Compreensível". Um site deve ser construído com linguagem clara e ter uma navegação e operações previsíveis. Isso ajuda os usuários a entenderem como utilizar o site e evita erros.

  • Robusto​: O quarto princípio é "Robusto". O conteúdo do site deve ser confiável em diferentes tecnologias e adaptável a diversas ferramentas de acessibilidade. Isso inclui utilizar uma formatação adequada do código e atributos únicos para identificar elementos.


Para garantir a acessibilidade, é importante que um site esteja em conformidade com esses princípios. Existem diferentes níveis de conformidade, chamados de WCAG A, WCAG AA e WCAG AAA. O nível A é o mais básico, enquanto o nível AAA é o mais rigoroso e abrangente.

Onível AAé considerado o mais desejável e é frequentemente utilizado em processos legais relacionados à acessibilidade. Alguns países reconhecem o WCAG 2.0 AA como um padrão legal para acessibilidade na web.

Embora seja um desafio garantir a acessibilidade para todos, seguir esses princípios e níveis de conformidade torna os produtos mais fáceis de usar para todos os usuários.

Introdução ao cfPRO
0 de 5 aulas concluidas
Introdução ao Design System
0 de 10 aulas concluidas
Governança & Documentação
0 de 11 aulas concluidas
Os fundamentos de um Design System
0 de 12 aulas concluidas

Os Fundamentos de um Design System

02:20

Acessibilidade no Design System

21:15

Baralho WCAG 2.2

14:53

Checklist de Acessibilidade [Toolkit]

05:57

Cores no Design System

14:24

Escala de cores no Figma (Color Ramp)

17:18

Escala & Espaçamento (Spacing)

18:13

Sistema de Grid (Grid System)

13:59

Tipografia Escalável

21:32

Iconografia

14:56

Design Tokens & Convenção de Nomes

40:40

Design Tokens [TOOLKIT]

24:49
Introdução ao cfPRO
0 de 5 aulas concluidas
Introdução ao Design System
0 de 10 aulas concluidas
Governança & Documentação
0 de 11 aulas concluidas
Os fundamentos de um Design System
0 de 12 aulas concluidas

Os Fundamentos de um Design System

02:20

Acessibilidade no Design System

21:15

Baralho WCAG 2.2

14:53

Checklist de Acessibilidade [Toolkit]

05:57

Cores no Design System

14:24

Escala de cores no Figma (Color Ramp)

17:18

Escala & Espaçamento (Spacing)

18:13

Sistema de Grid (Grid System)

13:59

Tipografia Escalável

21:32

Iconografia

14:56

Design Tokens & Convenção de Nomes

40:40

Design Tokens [TOOLKIT]

24:49

Data de lançamento

04/03/2025

Duração

21:15

Legendas

Português [PT-BR]

Tags

acessibilidade, webdesign, inclusão, usabilidade, WCAG

Introdução ao cfPRO
0 de 5 aulas concluidas
Introdução ao Design System
0 de 10 aulas concluidas
Governança & Documentação
0 de 11 aulas concluidas
Os fundamentos de um Design System
0 de 12 aulas concluidas

Os Fundamentos de um Design System

02:20

Acessibilidade no Design System

21:15

Baralho WCAG 2.2

14:53

Checklist de Acessibilidade [Toolkit]

05:57

Cores no Design System

14:24

Escala de cores no Figma (Color Ramp)

17:18

Escala & Espaçamento (Spacing)

18:13

Sistema de Grid (Grid System)

13:59

Tipografia Escalável

21:32

Iconografia

14:56

Design Tokens & Convenção de Nomes

40:40

Design Tokens [TOOLKIT]

24:49

Title Example

Message Example