AccessBoost, o curso mais completo que você já viu (ou não viu) sobre acessibilidade digital.

• Compreendendo a estrutura deste curso
• Sugestão para planejar os seus estudos
• Vontade de aprender Xversus pressa pra entender
• A diferença entre entender algo e resolver problemas

• acessi + bilidade
• Pra quem realmente estamos fazendo acessibilidade?
• Como podemos impactar o futuro?

• Onde está a acessibilidade no processo de design?
• Design Xversus Decoração Xversus Estética
• E o tal do "design emocional", cadê?

• do Negócio
• do Conteúdo
• da Interação
• da Usabilidade
• do Visual
• do Código
• da Pessoa

• Vivendo em bolhas na sociedade
• Diversidade Xversus Inclusão Xversus Acessibilidade
• Dados e números são apenas dados e números
• TIC (Tecnologia de Informação e Comunicação) e a Pessoa com Deficiência
• Modelo Médico Xversus Modelo Social Xversus Modelo Biopsicossocial
• Tipos de deficiência e por que não pensar (apenas) neles?
• Entendendo o funcionamento de Tecnologias Assistivas
  • Tecnologias assistivas para o desktop
  • Tecnologias assistivas para o celular
  • Tecnologias assistivas diversas
• Como pessoas com deficiências usam a internet?
• Como pessoas sem deficiências usam a internet?
  • crianças e idosos
  • canhotos
  • pessoas que não sabem ler ou escrever
  • pessoas que não tem acesso a internet
  • pessoas que (ainda) não sabem usar tecnologias
  • [insira quem você lembrar aqui]

• Acessibilidade não é uma caixinha isolada
• O que o Fogo, a Terra, a Água e o Ar tem a ver com acessibilidade?

• Abrangência Federal Xversus Abrangência Estadual

• Criando uma política para seu produto ou serviço (visão empresa)
  • Definindo o nível de conformidade
  • Definindo o escopo da política
  • Definindo objetivos de atingimento
  • Definindo o envolvimento de terceiros e fornecedores
  • Definindo um processo de revisão das políticas

• Como abordar a empresa?
• Como acionar o Ministério Público?
• Como o Ministério Público age?

• Primeira lição: Não tenha pressa pra resolver!
• Segunda lição: Reforce a primeira lição
• Terceira lição: Elabore um plano
  • Entenda como elaborar um plano nessa situação

• Liberte-se do ego
• Pare de comparar o seu trabalho
• Pare de pensar em ferramentas
• Mas entenda como usar as ferramentas...
• Pare de reclamar do tempo
• Pare de botar a culpa nos outros
• Pare de repetir as soluções
• Tenha "contatinhos"

• O mal do "senior" que acha que é "senior" em tudo
• Uma coisa de cada vez e sem pressa

• Negócios, Marketing, Conteúdo, Design, Tecnologia, Qualidade e Liderança
• Hard Skills Xversus Soft Skills

• Heurísticas de usabilidade (J. Nielsen)
• Princípios do design universal (R. Mace)
• Princípios de design de código (T. Berners-Lee)
• Princípios do design (D. Norman)
• Princípios do design de interação (B. Tognazzini)

• Os desafios no caminho
• As oportunidades no caminho

• Impacto no Uso
• Impacto na Satisfação
• Impacto na Marca
• Impacto no Consumo

• Será que essa é a preocupação real que devemos ter?

• O "real" custo da acessibilidade
• O "real" retorno que a acessibilidade pode trazer
• Será que essa é a preocupação real que devemos ter?

• VPAT (Voluntary Product Accessibility Template)
• Não, essas (e outras) empresas não nasceram "inclusivas"

• As principais desculpas para não se aplicar acessibilidade...
• Do checklist ao Processo Cultural

• Como você vai mudar sem alguém "preparado" pra mudar?
• Time A quer de um jeito, Time B quer de outro, time C não se preocupa...
• Governança, não há mudança sem ela

• O "gap" do conhecimento
• O "gap" do comportamento
• O "gap" da empatia e alteridade
• O "gap" da comunicação
• O "gap" do investimento
• O conceito deturpado da "entrega WOW"
• A abordagem equivocada da "automatização de tudo"

• Como identificar ferramentas que verdadeiramente te ajudarão no processo?

• Acessibilidade e a "Gestão de Mudanças"
• Acessibilidade e a "Metodologia Ágil"
• Acessibilidade e o "Design Thinking"
• Acessibilidade e o "Jobs to be Done"
• Acessibilidade e a "Transformação Digital"
• Acessibilidade e os mundos "VUCA" e "BANI"

• ...sob a ótica da série Chernobyl da HBO
• ...sob a ótica do 7x17 a 1 da seleção
• ...sob a ótica do filme "Fome de Poder"
• ...sob a ótica da vida, do universo e tudo o mais

• AMM - Accessibility Maturity Model

• Identificando as barreiras digitais
• Identificando áreas responsáveis e pessoas-chave
• Trabalhando com empresas terceiras, consultorias, fornecedores e similares
• Trabalhando com plugins e ferramentas de terceiros
• Iniciando uma pequena "guilda" ou um time de "pontos focais"
• Evoluindo os times: Equipe centralizada ou descentralizada?
• Desmistificando o tema para a empresa
• Convencendo C-levels e stakeholders a investir em acessibilidade
• Promovendo capacitação dos times
• Desenvolvendo uma documentação
• Criando um plano de comunicação

• Existe acessibilidade no MVP?
• Não assuma que seu produto não contempla pessoas com deficiências
• User Stories
• Critérios de aceite
• Priorizando problemas
• "Growth" a qualquer custo?
• Teste A/B de acessibilidade?
• E quanto aos Redesigns?

• O "entorno" de um site
• O "entorno" de um app
• Seu produto precisa chegar até as pessoas de alguma forma

• NSM (North Star Metric) aplicada a acessibilidade

• O que medir em cada etapa?
• Quem se responsabiliza pelas métricas?

• Princípios e Recomendações
• Anatomia de um Critério de Sucesso
• Abordagem técnica Xversus Abordagem Humana

• Quais são, como funcionam e como você pode participar?

• Elementos, Telas completas e Processos completos

EXCLUSIVIDADE: Utilizaremos durante essas aulas uma ferramenta exclusiva e autoral já utilizada pelo professor em outros cursos, mas com aprimoramentos exclusivos para este.

• 1.1.1 - Conteúdo não textual
• 1.2.1 - 1.2.9 - Apenas audio ou vídeo
• 1.2.2 - 1.2.4 - Legendas
• 1.2.3 - 1.2.5 - 1.2.7 - 1.2.8 - Audiodescrição ou mídia alternativa
• 1.2.6 - Língua de Sinais
• 1.3.1 - Informações e Relações
• 1.3.2 - Sequência com significado
• 1.3.3 - Características sensoriais
• 1.3.4 - Orientação
• 1.3.5 | 1.3.6 - Identificando objetivos
• 1.4.1 - Utilização de cores
• 1.4.2 | 1.4.7 - Áudios
• 1.4.3 | 1.4.6 | 1.4.11 - Contrastes
• 1.4.5 | 1.4.9 - Imagens de texto
• 1.4.8 - Apresentação visual
• 1.4.10 - Refluxo (Reflow)
• 1.4.12 - Espaçamento de texto
• 1.4.13 - Conteúdo em foco por mouse ou teclado
• 2.1.1 - 2.1.2 - 2.1.3 - Teclados
• 2.1.4 - Atalhos de teclado por caractere
• 2.2.1 - 2.2.3 - 2.2.6 - Limites de tempo
• 2.2.2 - Colocar em pausa, parar ou ocultar
• 2.2.4 - Interrupções
• 2.2.5 - Nova autenticação
• 2.3.1 - 2.3.2 - Flashes
• 2.3.3 - Animações de interações
• 2.4.1 - Ignorar blocos
• 2.4.2 - 2.4.6 - 2.4.10 - Títulos , Cabeçalhos e Rótulos
• 2.4.4 - 2.4.9 - Links
• 2.4.5 - Várias formas
• 2.4.7 - 2.4.11 - 2.4.12 - Foco Visível e Aparência
• 2.4.8 - Localização
• 2.5.1 - Gestos de Acionamento
• 2.5.2 - Cancelamento de acionamento
• 2.5.3 - Rótulo no nome acessível
• 2.5.4 - Atuação em movimento
• 2.5.5 - 2.5.8 - Tamanho e Espaçamento da área clicável
• 2.5.6 - Mecanismos de entrada simultâneos
• 2.5.7 - Arrastar (Dragging)
• 3.1.1 - 3.1.2 - Idiomas
• 3.1.3 - 3.1.4 - Jargões e Abreviações
• 3.1.5 - Nível de leitura
• 3.1.6 - Pronúncia
• 3.2.1 - Em foco
• 3.2.2 - Em entrada
• 3.2.3 - 3.2.4 - Consistências
• 3.2.5 - Alteração a pedido
• 3.2.6 - 3.3.5 - Ajuda
• 3.2.7 - Controles ocultos
• 3.3.1 - 3.3.3 - Erros
• 3.3.2 - Rótulos, instruções
• 3.3.4 - 3.3.6 - (Prevenção de erros)
• 3.3.7 - Autenticação acessível
• 3.3.8 - Entrada redundante
• 4.1.1 - Análise (código)
• 4.1.2 - Nome, função e valor

• 5 chances para algo dar errado em sua comunicação
• "Ninguém lê nada" é a desculpa perfeita para quem não sabe se comunicar
• Problemas diferentes pedem conteúdos e formatos diferentes

• Especialistas de SEO Xversus Especialistas de Acessibilidade
• Otimizar para robôs ou para humanos?
• Onde verdadeiramente há conflitos entre a acessibilidade e o SEO?

• Uso do "@", "X", "E" e similares
• O mito por trás do leitor de telas
• O dilema por trás dos diferentes pontos de vista

• A importância dos contextos
• Descrever cores para quem não vê cores, como assim?
• Imagem decorativa Xversus informativa Xversus funcional
• Boas práticas para descrever gráficos de todos os tipos
• Técnicas para imagens complexas

• Legendas abertas Xversus legendas fechadas
• Transcrição Xversus Áudiodescrição
• Áudiodescrição ou Autodescrição?
• Língua de Sinais

• O que é o "nome acessível"?
• Onde e como usar o "nome acessível"?
• Prefixos, sufixos e "complementos"

• TL;DR (Sem tempo, irmão!)
• Títulos: o principal método utilizado por quem não enxerga
• Links: do "saiba mais" ao "pular para o conteúdo"
• O parágrafo que não é parágrafo
• Listas: ordenadas Xversus não ordenadas Xversus de definição
• Gírias, metáforas, figuras de linguagem, abreviações e acrônimos
• Pronúncia
• Ajuda contextual Xversus Ajuda humanizada
• Mensagens de status e warnings
• Pontuações Xversus Símbolos Xversus Equações
• Emoticons Xversus Emojis

• A intersecção do visual com o conteúdo
• Conteúdo Ok, Visual Ok, mas ainda errado. O que faltou?
• Label Xversus Floting Label Xversus Placeholder
• Prevenção de erros Xversus Ajuda pra resolver
• Mensagem de Erro Xversus Sumário de Erro
• Os agrupamentos e a falta que faz um "legend"

• Internacionalização Xversus Localização
• Pensando o seu conteúdo para quem não sabe o seu idioma
• Orientação da escrita: direita para esquerda, esquerda para direita
• Idioma da página Xversus Idioma de partes de uma página

• Como funciona a acessibilidade em documentos fechados (PDF, ePUB, etc)
• Como funciona a acessibilidade em documentos abertos (doc, ppt, etc)
• Efetuando referências para documentos

• Boas práticas para e-mails acessíveis

• O que é relevante e o que não é...
• LinkedIn, Facebook, Instagram, Twitter e suas peculiaridades
• Devo usar o texto alternativo ou descrever direto na legenda do post?
• #PraCegoVer, #PraTodosVerem, #DescriçãoDeImagem
• CamelCase na hashtag, o que é e por que isso é importante?

• Não, não vou falar da ferramenta [insira o nome da sua preferida aqui]
• Por que você NÃO precisa seguir a "onda do momento" (seja ela qual for nesse momento)
• Uma interface bonita É importante, mas uma interface SÓ bonita não é

• Aliás, explicando affordance para "não designers"

• Medidas relativas Xversus Medidas fixas
• 1px NÃO é um pixel

• A ordem dos elementos na tela importa
• A direita ou a esquerda, em cima ou embaixo?
• Agrupamento de elementos, o que é isso?
• Jamais esqueça de definir o estado de "foco" nos elementos

• A importância da aparência clicável

• O que é área de clique ou toque?
• Qual é o tamanho mínimo necessário?

• O gesto que você acha simples, pode não ser tão simples assim
• Interações baseadas em gestos específicos

• O layout que você vê não é o mesmo que você ouve
• "Link Externo" e o motivo de não usar "target blank"
• Quebrar a linha ou incluir 3 pontinhos?
• Deu zoom e deu ruim!
• Botões sem labels visíveis, e agora?
• O mistério da navegação através do menu invisível
• Accordion e o dilema do "fechado" e "aberto"
• E o menu flutuante, como fica?
• Captcha tem jeito?
• Dando jeito no QR Code

• A matemática do foco visível
• Por que botões não devem ter um cursor de mão, mas sim uma seta?
• A ordem do foco importa
• Mensagens, onde eu as coloco?
• Olhinho aberto para fechar, Olhinho fechado para abrir. Não, péra!
• Por quê Play/Stop é de um jeito e Volume On/Off é de outro?
• Skeletons, loadings e afins...

• Botão é botão, link é link!
• Você precisa (de verdade) parar de pensar só no visual

• Sim, vibrações também podem representar algo visual

• Complementar sim, essencial não
• Microinterações... do visual ao não visual
• Interações avançadas como "drag'n'drop" tem solução?

• Não é só com o contraste que você precisa se preocupar, ok?
  • Mas, como trabalhar seus contrastes de uma vez por todas!
• O que muda entre a WCAG 2.x e WCAG 3.0
  • Compreendendo o APCA (Advanced Perceptual Contrast Algorithm)
• Dark Mode Xversus Light Mode
• Transparências e Degradês

• Medidas relativas Xversus Medidas Fixas
• O que torna uma fonte acessível?
• Legibilidade Xversus Leiturabilidade
• O tamanho do título não tem impacto na hierarquia
• O que realmente importa ao se pensar em fontes?

• Sim, pessoas ainda imprimem coisas, mas dá pra customizar!
• Design para Impressão Xversus Design para Telas

• As Dimensões do Design Inclusivo
• Os Princípios do Design Inclusivo

• Lente da Estrutura
• Lente da Legibilidade
• Lente do Significado
• Lente do Idioma
• Lente do Tempo
• Lente da Velocidade
• Lente do Controle
• Lente do Teclado
• Lente do Layout
• Lente da Imagem
• Lente do Audio e Vídeo
• Lente da Voz
• Lente da Animação
• Lente do Efeito
• Lente da Fonte
• Lente da Cor
• Pensando em diferentes lentes para o seu produto...

• Lei da Região Comum, da Proximidade, da Similaridade e da Conexão
• Occam, Pareto e Postel
• Miller, Jakob, Hick e Fitts
• Doherty e Tesler

• Usando "gatilhos" sem parecer que são gatilhos
• A complexidade de se compreender estímulos que não são óbvios
• "Você tem até 23:59 pra concluir essa aula!" Apenas pare...

EXCLUSIVIDADE: Utilizaremos durante essas aulas uma ferramenta exclusiva já utilizada pelo professor em outros cursos, mas com aprimoramentos exclusivos para este.

• Avaliação Heurística de Usabilidade Xversus Acessibilidade
• Aplicação em Protótipo Xversus Aplicação em Produção
• Avaliando "seus produtos" Xversus "produtos concorrentes"

• Úteis ou não para a acessibilidade?
• Evitando uma abordagem equivocada com o uso de personas inclusivas

• Quando devo efetuar pesquisas com pessoas com deficiência?
• Os diferentes momentos da pesquisa
• Pesquisa ou Teste?

• O que seria um sistema acessível "de verdade"? Se ele não é, posso declarar que é?
• Por que a referência que você considera "boa" não é tão boa assim?

• A psicologia do Design System que a razão literalmente não enxerga

• A abordagem equivocada de designers
• A abordagem equivocada de pessoas desenvolvedoras
• A abordagem equivocada de demais pessoas no projeto
• Deixando os equívocos de lado e entregando consistência

• Tokens
  • O que é importante saber sobre tokens com relação a acessibilidade?
  • Quais tokens impactam diretamente na acessibilidade?
• Medidas
  • "CSS Pixel Reference" Xversus Densidade de Pixels na Tela
  • PX, EM, VW, VH, VMIN, VMAX, FR... qual usar e onde usar?
• Estrutura
  • Flexbox ou CSS Grid? Isso impacta na acessibilidade?
  • Header
  • Footer
  • Regiões
  • Cabeçalhos (heading)
  • Tabelas (dados tabulares)
  • Listas
• Mensagens
  • Alertas
  • Caixas de Confirmação (dialogs)
  • Validação de Formulários
  • Toasts
• Navegação
  • Breadcrumb
  • Menus
  • Links
  • Paginação
  • Pular para conteúdo
  • Tabbar
  • Carrossel
• Elementos ocultos
  • Accordion
  • "Mais informações"
  • Abas
  • Tooltip
  • Popover
  • Modal
• Formulários
  • Botão
  • Checkbox
  • Inputs
  • Radio button
  • Select
  • Slider
  • Switch
• Imagens
  • Usando imagens flexíveis de forma assertiva
  • Fonte de ícones para ícones? Será que é ideal?
  • Sprites Xversus SVG
• Boas práticas "ocultas"
  • CSS Media Preferences
    • Reduced Motion
    • Reduced Transparency
    • Reduced Data
    • Contrast
    • Color Scheme
  • CSS Media Type
    • Print
  • Pseudo-classes
    • Foco no "focus" e no "focus-within"

• Devsdevelopers precisam entender que SEMÂNTICA é sobre pessoas
• Designers precisam entender que HTML e CSS não é programação

• A importância da Semântica (não apenas no HTML)
• Semântica Xversus Arquitetura de Informação
• HTML é lindo e poderoso, mas não é programação

• O "gap" do conhecimento em CSS e a "culpa" do Box Model
• A lógica por trás da nomeação de classes e onde começam os problemas de acessibilidade
• Quando o CSS pode influenciar a leitura (visual e não visual) de uma página?
• O conceito do "Atomic CSS" e como ele pode te ajudar (ou não)
• Usando variáveis no CSS de forma simples
• CSS é lindo e poderoso, mas não é programação

• DOM, CSSOM, Render Tree
• Accessibility Tree

• Primeira regra: Não use ARIA!
• Segunda regra: Reforce a primeira regra
• Terceira regra: Se realmente precisar usar, entenda alguns pontos

• Acessibilidade Web Xversus Acessibilidade Mobile
• Acessibilidade no Android
• Acessibilidade no iOS
• Acessibilidade em Frameworks e Bibliotecas

• Progressive Enhancement Xversus Graceful Degradation
• Entendendo a renderização da sua interface
• Entendendo a "árvore da acessibilidade"
• Responsabilidades de designers, devsdevelopers e demais pessoas do time

• Resposta, Animação, Ociosidade e Carregamento

• FCP, LCP, TBT e CLS

• Você também pode se basear na semântica, mas...

• Feedback
• Comportamento
• Conteúdo
• Aquele "algo a mais"...

• Onde criar e como organizar sua biblioteca
• Relacionando a sua documentação com outras já existentes
• Mantendo a documentação "viva"

• Usando checklists de forma assertiva
  • Checklist para Designers
  • Checklist para Desenvolvedores
  • Checklist para Conteúdistas
  • Checklist para Gestores de Projetos

• O que pode e o que não pode ser automatizado?
• Formando uma equipe de testes manuais
• Definindo "o que" e "como" testar em cada etapa
• Documentando e gerando relatórios para os times

• Como definir amostras para seus testes?
• Como priorizar o que será testado?

• Definindo uma "stack" de testes
• Ferramentas para testes de sites
• Ferramentas para testes de apps
• Ferramentas para testes de contraste
• Ferramentas do tipo "Bookmarklets"
• Inspetores e Depuradores dos browsers
• Extensões de browsers

• Pontuação por incidência
• Pontuação por gravidade
• Investigação inicial e conceitos de design
• Testes informais durante os ciclos de desenvolvimento
• Testes em áreas específicas
• Testes em áreas e fluxos completos

• A opinião de UMA pessoa é apenas a opinião de UMA pessoa
• Planejando o recrutamento
  • Diferenças entre testes de usabilidade e acessibilidade
  • Determinando as características dos participantes
    • Armadilhas ao categorizar os diferentes tipos de deficiência
  • Screener de Recrutamento
    • Triagem Xversus Selecionados
• Determinando o local
  • Preparando a sala de testes
  • Configurando tecnologias assistivas
  • Considerações para testes remotos
• Conduzindo os testes
  • Considerações ao lidar com pessoas com deficiências
  • Repensando o tempo dos testes
  • Pensando em alternativas (plano B)
  • A importância dos Testes-Piloto
  • Conclusão de tarefas

• Teste de apresentação visual
• Teste de navegação por teclado
• Teste de redimensionamento de conteúdo
• Teste de contraste
• Teste de links e botões
• Teste de links do tipo "pular para conteúdo"
• Teste de nome acessível
• Teste de estrutura hierárquica de títulos
• Teste de estrutura de conteúdo
• Teste de tipografia
• Teste de legendas
• Teste com leitor de telas

• Teste de apresentação visual
• Teste de navegação por swipe
• Teste de redimensionamento de conteúdo
• Teste de orientação de tela
• Teste de nome acessível
• Teste de estrutura de conteúdo
• Teste de alternativas de acesso
• Teste com leitor de telas