SlideShare uma empresa Scribd logo
1 de 35
Baixar para ler offline
Daltonismo no
Desenvolvimento Web
O que é o daltonismo, problemas mais frequentes
encontrados e como resolvê-los
Lucas Silva
Agenda
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Daltonismo
(Discromatopsia)
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Hora de aventura: Fome de vermelho, ep 38, 5ª
temporada.
Daltonismo
“O daltonismo (também chamado de
discromatopsia ou discromopsia) é
uma perturbação da percepção visual
caracterizada pela incapacidade de
diferenciar todas ou algumas cores,
manifestando-se muitas vezes pela
dificuldade em distinguir o verde do
vermelho.”
Problemas mais
frequentes
1- CAPTCHA
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
CAPTCHA
Completely Automated Public Turing test to tell Computers and Humans Apart.
Teste de Turing público completamente automatizado para distinguir entre
computadores e pessoas.
CAPTCHA
Visão Normal Visão com Protanopia
CAPTCHA
● A quantidade de spam que você está recebendo realmente vale perder
conversões?
● Se a resposta for sim, o seu CAPTCHA é amigável para todos os usuários,
inclusive para aqueles que são deficientes visuais?
● CAPTCHAs são para robôs, não para seres humanos. Infelizmente, tudo o que
uma pessoa pode codificar para tentar evitar os robôs de entrarem em um site
é algo que o outro pode encontrar um caminho. A verdadeira consideração é:
estamos apenas empurrando o problema com spam para os nossos clientes?
ReCAPTCHA
www.google.com/recaptcha
2- Seletor de Cor
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Seletor de Cor
Seletor de Cor
Seletor de cor do Microsoft Word
Seletor de Cor
Seletor de cor do Google Docs
Seletor de Cor
www.jqueryrain.com/demo/jquery-color-picker
3- Gráficos
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Gráficos
Visão Normal Visão com Protanopia
Gráficos
Gráficos do Google Analytics em 2012.
Gráficos
Gráficos do Google Analytics em 2016.
Gráficos
Gráficos do Google Forms em 2016.
Gráficos
Gráficos no Visual Website Optimizer antes de 2012.
Gráficos
Gráficos no Visual Website Optimizer em de 2012.
4- Tabelas
Comparativas
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Tabelas Comparativas
Tabela em uma matéria do uol.com.br
Tabelas Comparativas
Comparativo de celulares no tudoparacelular.com
5- Games
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
Games
Telas do jogo Wordfeud.
Games
Telas do jogo Trainyard
Games
Telas do jogo Trainyard
Ferramentas para
teste
Sobre CAPTCHA Seletor
de Cor
Gráficos Tabelas
Comparativas
Games Ferramentas
para teste
NoCoffe Vision Simulator
Extensão para o Google Chrome
Colour Contrast Analyser
www.paciellogroup.com/resources/contrastanalyser/
Obrigado!!
lucasjsilva.com

Mais conteúdo relacionado

Mais procurados

Síndrome de down
Síndrome de down Síndrome de down
Síndrome de down
Fisioterapeuta
 
Genética pós Mendel
Genética pós MendelGenética pós Mendel
Genética pós Mendel
Elaine
 
Síndrome de Down
Síndrome de DownSíndrome de Down
Síndrome de Down
Harry Niger
 
Principais ameaças à biodiversidade
Principais ameaças à biodiversidadePrincipais ameaças à biodiversidade
Principais ameaças à biodiversidade
Anaïs André
 
Genética - Cor dos Olhos
Genética - Cor dos OlhosGenética - Cor dos Olhos
Genética - Cor dos Olhos
Nuno Correia
 
Ciências naturais 7 exercicios de cn
Ciências naturais 7   exercicios de cnCiências naturais 7   exercicios de cn
Ciências naturais 7 exercicios de cn
Nuno Correia
 

Mais procurados (20)

Síndrome de down
Síndrome de down Síndrome de down
Síndrome de down
 
Síndrome
 Síndrome Síndrome
Síndrome
 
Genética: Noções de Hereditariedade
Genética: Noções de HereditariedadeGenética: Noções de Hereditariedade
Genética: Noções de Hereditariedade
 
Síndrome de Down
Síndrome de Down Síndrome de Down
Síndrome de Down
 
Mendel e hereditariedade
Mendel e hereditariedadeMendel e hereditariedade
Mendel e hereditariedade
 
Síndrome de patau
Síndrome de patauSíndrome de patau
Síndrome de patau
 
Genética pós Mendel
Genética pós MendelGenética pós Mendel
Genética pós Mendel
 
Herança ligada ao sexo
Herança ligada ao sexoHerança ligada ao sexo
Herança ligada ao sexo
 
Síndrome de Down
Síndrome de DownSíndrome de Down
Síndrome de Down
 
Exercícios de genética
Exercícios de genéticaExercícios de genética
Exercícios de genética
 
OS TIPOS DE SOLO e ROCHAS.pptx
OS TIPOS DE SOLO e  ROCHAS.pptxOS TIPOS DE SOLO e  ROCHAS.pptx
OS TIPOS DE SOLO e ROCHAS.pptx
 
Principais ameaças à biodiversidade
Principais ameaças à biodiversidadePrincipais ameaças à biodiversidade
Principais ameaças à biodiversidade
 
Trissomia 21
Trissomia 21Trissomia 21
Trissomia 21
 
Genética - Cor dos Olhos
Genética - Cor dos OlhosGenética - Cor dos Olhos
Genética - Cor dos Olhos
 
Síndrome de patauuyf
Síndrome de patauuyfSíndrome de patauuyf
Síndrome de patauuyf
 
Ciências naturais 7 exercicios de cn
Ciências naturais 7   exercicios de cnCiências naturais 7   exercicios de cn
Ciências naturais 7 exercicios de cn
 
Charles Darwin ppt
Charles Darwin pptCharles Darwin ppt
Charles Darwin ppt
 
Slide -Sindrome de Down
Slide -Sindrome de DownSlide -Sindrome de Down
Slide -Sindrome de Down
 
Expressividade e penetrância
Expressividade e penetrânciaExpressividade e penetrância
Expressividade e penetrância
 
Mutações genéticas
Mutações genéticasMutações genéticas
Mutações genéticas
 

Destaque

Construindo um framework CSS
Construindo um framework CSSConstruindo um framework CSS
Construindo um framework CSS
Diego Eis
 

Destaque (17)

I Promise You
I Promise YouI Promise You
I Promise You
 
Repensando seu CSS - Boas práticas e performance
Repensando seu CSS - Boas práticas e performanceRepensando seu CSS - Boas práticas e performance
Repensando seu CSS - Boas práticas e performance
 
Como manter seu css escalável e organizado. - Eder Eduardo
Como manter seu css escalável  e organizado. - Eder EduardoComo manter seu css escalável  e organizado. - Eder Eduardo
Como manter seu css escalável e organizado. - Eder Eduardo
 
Organic CSS
Organic CSSOrganic CSS
Organic CSS
 
Os camaradas Grunt e Bower
Os camaradas Grunt e BowerOs camaradas Grunt e Bower
Os camaradas Grunt e Bower
 
SMACSS - Como estruturar CSS para projetos em larga escala
SMACSS - Como estruturar CSS para projetos em larga escalaSMACSS - Como estruturar CSS para projetos em larga escala
SMACSS - Como estruturar CSS para projetos em larga escala
 
Construindo seu framework CSS
Construindo seu framework CSSConstruindo seu framework CSS
Construindo seu framework CSS
 
Time de Desenvolvimento: Trabalhando em equipe sem matar o coleguinha
Time de Desenvolvimento: Trabalhando em equipe sem matar o coleguinhaTime de Desenvolvimento: Trabalhando em equipe sem matar o coleguinha
Time de Desenvolvimento: Trabalhando em equipe sem matar o coleguinha
 
SASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endSASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-end
 
Smacss e-css-faz-bem
Smacss e-css-faz-bemSmacss e-css-faz-bem
Smacss e-css-faz-bem
 
Construindo um framework CSS
Construindo um framework CSSConstruindo um framework CSS
Construindo um framework CSS
 
Arquitetura CSS
Arquitetura CSSArquitetura CSS
Arquitetura CSS
 
Gulp
GulpGulp
Gulp
 
Desenvolvendo uma aplicacao Full Javascript
Desenvolvendo uma aplicacao Full JavascriptDesenvolvendo uma aplicacao Full Javascript
Desenvolvendo uma aplicacao Full Javascript
 
Aplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV DigitalAplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV Digital
 
O que você precisa saber para se tornar um dev front-end
O que você precisa saber para se tornar um dev front-endO que você precisa saber para se tornar um dev front-end
O que você precisa saber para se tornar um dev front-end
 
A verdadeira semântica do HTML
A verdadeira semântica do HTMLA verdadeira semântica do HTML
A verdadeira semântica do HTML
 

Mais de Lucas J Silva (8)

Desenvolvedores & Designers: Guerra Infinita
Desenvolvedores & Designers: Guerra InfinitaDesenvolvedores & Designers: Guerra Infinita
Desenvolvedores & Designers: Guerra Infinita
 
Acessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC DevAcessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC Dev
 
Acessibilidade em CSS - TDC
Acessibilidade em CSS - TDCAcessibilidade em CSS - TDC
Acessibilidade em CSS - TDC
 
Acessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in SampaAcessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in Sampa
 
Daltonismo no desenvolvimento web - ABC Dev 2017
Daltonismo no desenvolvimento web - ABC Dev 2017Daltonismo no desenvolvimento web - ABC Dev 2017
Daltonismo no desenvolvimento web - ABC Dev 2017
 
Acessibilidade no design e desenvolvimento web - Meetup Front-End SP
Acessibilidade no design e desenvolvimento web - Meetup Front-End SPAcessibilidade no design e desenvolvimento web - Meetup Front-End SP
Acessibilidade no design e desenvolvimento web - Meetup Front-End SP
 
Daltonismo no desenvolvimento - Front in Vale
Daltonismo no desenvolvimento - Front in ValeDaltonismo no desenvolvimento - Front in Vale
Daltonismo no desenvolvimento - Front in Vale
 
Acessibilidade no design e desenvolvimento web - R design 2017
Acessibilidade no design e desenvolvimento web - R design 2017Acessibilidade no design e desenvolvimento web - R design 2017
Acessibilidade no design e desenvolvimento web - R design 2017
 

Último

Último (8)

Programação Orientada a Objetos - 4 Pilares.pdf
Programação Orientada a Objetos - 4 Pilares.pdfProgramação Orientada a Objetos - 4 Pilares.pdf
Programação Orientada a Objetos - 4 Pilares.pdf
 
Luís Kitota AWS Discovery Day Ka Solution.pdf
Luís Kitota AWS Discovery Day Ka Solution.pdfLuís Kitota AWS Discovery Day Ka Solution.pdf
Luís Kitota AWS Discovery Day Ka Solution.pdf
 
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docxATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ESTRUTURA DE DADOS II - 52_2024.docx
 
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docxATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
 
Padrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemploPadrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemplo
 
Boas práticas de programação com Object Calisthenics
Boas práticas de programação com Object CalisthenicsBoas práticas de programação com Object Calisthenics
Boas práticas de programação com Object Calisthenics
 
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docxATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
 
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docxATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
 

Daltonismo no desenvolvimento web