acessibilidade para REDES SOCIAIS

Prévia do material em texto

Acessibilidade 
de Conteúdo 
para Redes Sociais
Boas práticas de copywriting
para redes sociais5 Segundo a linguagem inclusiva acessível
1 - Use parágrafos curtos
2 - Use uma linguagem inclusiva
3 - Por que abandonar X/@?
4 - Seja preciso com o significado
5 - Evite usar metáforas 
Boas práticas de copywriting para redes sociais
1 - Use parágrafos curtos
ERRADO CERTO
2 - Use linguagem inclusiva
CERTOERRADO
Pessoa com deficiênciaDeficiente
CERTOERRADO
Pessoas especiais Pessoas com deficiência
2 - Use linguagem inclusiva
3 - Por que abandonar X/@?
- Porque é inaplicável à linguagem falada.
- Não são identificados pelo leitor de telas.
- Dificulta a leitura para pessoas com dislexia.
4- Evite usar metáforas
Textos com estruturas simples, com frases e parágrafos curtos, em voz
ativa, sem figuras de linguagem.
Aquele rapaz é um gato!
Boas práticas de
Audiovisual
Aprendendo a acessibilizar vídeos para o maior
número de seguidores.6
libras
audiodescrição 
legenda através da
estenotipia
Recursos de acessibilidade live
Audiodescrição
Transcrição
Timestamps
Janela de libras
Legendas
Closed caption
Estenotipia
Legenda manual
Legenda automática
 
Recursos de acessibilidade vídeos
Audiodescrição
Modalidade que consiste em traduzir imagens em palavras.
https://www.youtube.com/watch?v=I7l4ZGoo9PE
Descrição - imagem
texto alternativo descrição na legenda
Descrição - vídeo 
Descrição - Stories
Autodescrição - lives
Autodescrição - lives
Reprodução escrita de um material de áudio ou vídeo.
Transcrição - YouTube 
Transcrição - WhatsApp 
E se você pudesse dizer exatamente onde está cada conteúdo dentro do seu vídeo?
Linha do Tempo / Timestamp - YouTube 
Plano de fundo 
Vestimenta
Tamanho da
janela libras 
Recomendações da 
ABNT 15.290.
Janela de libras
Janela de libras
No Brasil existe cerca de 10
milhões de surdos.
Em média 85% de todos os
conteúdos no Facebook são
assistidos sem áudio ? (pesquisa
Digiday)
 Legendas
 Closed Caption (Legenda Descritiva ou legenda oculta)
https://www.youtube.com/watch?v=XrKdPctnj5E
O que é uma máquina
Stenograph?
Estenotipia
Legendas manuais 
Legendas Automáticas IGTV - inserir
Legendas Automáticas IGTV - ativar
Legendas Automáticas Facebook 
https://business.facebook.com/creatorstudio/
Legendas Automáticas Twitter 
Legendas Automáticas YouTube
Selecione a legenda
automática do YouTube.
Demora um pouco o
processamento.
Ferramentas para legendar seu conteúdo
getsubly.com kapwing.com
veed.io
headliner.app
celular - CapCut app celular - Inshot
manual
https://www.veed.io/
https://www.getsubly.com/
https://www.kapwing.com/
https://www.headliner.app/
https://www.getsubly.com/
https://www.kapwing.com/
https://www.veed.io/
https://www.headliner.app/
Headliner - desktop
CapCut - celular /
legendas automáticas 
Inshot - celular/
 legendas manuais
Boas práticas
de Design
Descobrindo como melhorar a experiência 
de seguidores nas redes sociais.6
Tipos mais comuns de daltonismo
Protanopia
Não enxerga cores verde,
amarelo e vermelho.
Tritanopia
Não enxerga cores azul
e amarelo.
Deuteranopia
Não enxerga cores verde,
amarelo e vermelho.
Visão sem
daltonismo
Como um daltônico
enxerga?
O design só revela boas
práticas quando é feito 
para pessoas.
Boas práticas para tornar 
seus conteúdos acessíveis:
- Posicionamento de legendas
- Contraste 
- Uso de fontes
- Alinhamento de texto
Banco Central anuncia lançamento
de nova cédula de R$ 200
Banco Central anuncia lançamento
de nova cédula de R$ 200
Garanta boa visibilidade e legibilidade 
das informações visuais.
Use contraste entre as cores
do fundo e o texto.
Evite efeitos de imagem com
visibilidade ruim.
ERRADO CERTO
Utilize a ferramenta Whocanuse para verificar 
o contraste.
1 - O contraste deve ser
verificado com relação ao
hexadecimal 
da cor do fundo e a cor da
letra.
2 - A relação de contraste deve
alcançar 4.5 para o critério 
AA da WCAG 2.2 (Web Content
Accessibility Guidelines) 
e 7 para o critério AAA. WHOCANUSE.COM
https://whocanuse.com/
Texto principal sem contraste
Elementos sem contraste com o fundo
Informações visuais sem contraste
causam invisbilidade do conteúdo.
Logo sem contraste com o fundo
Informações visuais sem contraste
causam invisbilidade do conteúdo.
Texto principal sem contraste
Texto branco sobre fundo claro
Elementos sem contraste com o fundo
Chamada para a ação (CTA) sem contraste
Informações visuais sem contraste
causam invisbilidade do conteúdo.
Boas práticas para tornar 
seus conteúdos acessíveis:
- Posicionamento de legendas
- Contraste 
- Uso de fontes
- Alinhamento de texto
Uma fonte com serifa é uma fonte com enfeites 
nas letras e geralmente é mais difícil de ler.
Ser simples é ser
acesssível e a
simplicidade
da acessibilidade torna 
a vida mais leve 
e muito, muito mais
gostosa!
Evite usar em
parágrafos longos.
ERRADO CERTO
Utilize fontes sem serifa
em parágrafos.
Este é um exemplo 
de texto mostrando
como seu conteúdo
pode ser acessível
quando usamos 
uma fonte legível,
facilitando a leitura.
Evite usar fontes condensadas
em parágrafos.
Boas práticas
de Design
Aprenda técnicas e
ferramentas de contraste,
imagens e tipografia
acessíveis.
Não somos iguais, 
cada ser humano possui
suas peculiaridades 
e diferenças,
precisamos sair da
nossa bolha e aceitar
quem não se parece
conosco.
- Marianna Moreno
Use pesos diferentes 
em títulos e parágrafos.
ERRADO CERTO
Uma fonte sem serifa é uma fonte sem enfeites 
nas letras e geralmente é mais fácil de ler.
Este é um exemplo
de texto mostrando
como seu conteúdo
pode ficar acessível
quando existe
espaçamento entre
as letras e linhas.
1 - ESPAÇO ENTRE LINHAS
2 - ESPAÇO ENTRE LETRAS
3 - FONTE LEGÍVEL
Garanta que o texto fique agradável para leitura com um espaçamento
adequado e tamanho de fonte legível.
Boas práticas para tornar 
seus conteúdos acessíveis:
- Posicionamento de legendas
- Contraste 
- Uso de fontes
- Alinhamento de texto
ERRADO
Este é um exemplo de
texto mostrando como
seu conteúdo pode
ficar sem
acessibilidade
quando está alinhado
ao centro com uma
fonte pouco legível,
dificultando a leitura.
Este é um exemplo
de texto mostrando
como seu conteúdo
pode ser acessível
quando está
alinhado à esquerda
com uma fonte
legível, facilitando a
leitura.
Evite alinhar textos longos
ao centro.
Priorize usar o alinhamento
do texto à esquerda.
CERTO
Uma boa prática é manter o alinhamento do texto 
da forma que facilite a leitura.
Boas práticas para tornar 
seus conteúdos acessíveis:
- Posicionamento de legendas
- Contraste 
- Uso de fontes
- Alinhamento de texto
Mantenha o texto acima 
da descrição do vídeo
TikTok
Mantenha o texto na área mais escura 
ou crie uma para contraste de fundo
Instagram 
Observação: se for Reels, 
posicionar igual ao TikTok.
Use a ferramenta para legendar ou crie
uma área escura para contraste de fundo
Facebook
Crie um espaço para as legendas
automáticas, evitando interferência
com elementos visuais no fundo
YouTube
Além de ser visualmente agradável, 
o design deve gerar acesso ao conteúdo,
através de melhores experiências 
de interação das pessoas com 
as informações apresentadas.
A imagem sobreposta 
por um degradê dificultava
a compreensão do conteúdo
para pessoas com baixa visão.
Visibilidade
para a pessoa
Legibilidade
das informações
Destaque
do logo
Informações visuais em excesso 
causam incompreensão do conteúdo.
Símbolos gráficos em movimento
Transição de várias imagens ao mesmo tempo
Legenda com fonte pequena sem contraste