SlideShare una empresa de Scribd logo
1 de 39
Inclusão digital através da acessibilidade na web Bruno Borges – Marketing Digital Julho / 2009
Olá! ,[object Object],[object Object],[object Object]
Inclusão Digital ,[object Object]
Inclusão Digital ,[object Object],[object Object]
Inclusão Digital ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Acessibilidade ,[object Object]
Acessibilidade na web ,[object Object]
Acessibilidade na web ,[object Object]
Acessibilidade na web ,[object Object],[object Object]
Acessibilidade e Inclusão Digital ,[object Object],[object Object],[object Object]
Acessibilidade e Inclusão Digital ,[object Object],[object Object],[object Object],[object Object],[object Object]
Importância da acessibilidade na web ,[object Object],[object Object]
Importância da acessibilidade na web ,[object Object]
Importância da acessibilidade na web ,[object Object],[object Object],[object Object],[object Object],[object Object]
Aspectos legais ,[object Object],[object Object],[object Object],[object Object]
Aspectos legais ,[object Object],[object Object],[object Object],[object Object]
Aspectos legais ,[object Object],[object Object]
Aspectos legais ,[object Object],[object Object],[object Object]
Aspectos legais ,[object Object],[object Object]
Aspectos legais ,[object Object],[object Object]
Aspectos legais ,[object Object],[object Object]
Princípios da acessibilidade na web ,[object Object],[object Object],[object Object]
Web Standards ,[object Object]
Semântica ,[object Object]
Semântica ,[object Object],[object Object],[object Object],[object Object],[object Object]
Semântica ,[object Object],[object Object],[object Object],[object Object],[object Object]
Semântica ,[object Object],[object Object],[object Object]
Semântica ,[object Object],[object Object],[object Object]
Leitores de tela ,[object Object]
Leitores de tela ,[object Object]
Leitores de tela ,[object Object],[object Object],[object Object],[object Object]
Tags Alt e Title ,[object Object],[object Object],[object Object]
Teclas de atalho ,[object Object],[object Object]
Teclas de atalho ,[object Object],[object Object]
Teclas de atalho ,[object Object],[object Object]
Cores ,[object Object]
Níveis de contraste ,[object Object]
Ajuste de tamanho do texto ,[object Object]
Obrigado! ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Más contenido relacionado

La actualidad más candente

Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...
Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...
Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...Valeria de Oliveira
 
Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?Hans Mösl
 
Acessibilidade Comunicacional
Acessibilidade ComunicacionalAcessibilidade Comunicacional
Acessibilidade ComunicacionalGovBR
 
“Guia Turismo Acessível” um País onde Todos podem Viajar!
“Guia Turismo Acessível” um País onde Todos podem Viajar!“Guia Turismo Acessível” um País onde Todos podem Viajar!
“Guia Turismo Acessível” um País onde Todos podem Viajar!GovBR
 
Acessibilidade, legislação e potencial das PcD
Acessibilidade, legislação e potencial das PcDAcessibilidade, legislação e potencial das PcD
Acessibilidade, legislação e potencial das PcDiMasters
 
E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1Leo Serrao
 
Acessibilidade nas mídias digitais
Acessibilidade nas mídias digitaisAcessibilidade nas mídias digitais
Acessibilidade nas mídias digitaisFabíola Calixto
 
Introdução a Internet
Introdução a InternetIntrodução a Internet
Introdução a InternetMarcio Duarte
 
Acessibilidade x usabilidade
Acessibilidade x usabilidadeAcessibilidade x usabilidade
Acessibilidade x usabilidadeDomingos Andrade
 
Guia de Acessibilidade de Interfaces Web focado em Aspectos do Autismo
Guia de Acessibilidade de Interfaces Web focado em Aspectos do AutismoGuia de Acessibilidade de Interfaces Web focado em Aspectos do Autismo
Guia de Acessibilidade de Interfaces Web focado em Aspectos do AutismoWomen Techmakers Sorocaba
 
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidade
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidadeConteúdos digitais multimídia: o foco na usabilidade e na acessibilidade
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidadeMárcia Silva Corrêa
 
Conceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidadeConceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidadeNécio de Lima Veras
 
cartilha-w3cbr-acessibilidade-web-fasciculo-I
cartilha-w3cbr-acessibilidade-web-fasciculo-Icartilha-w3cbr-acessibilidade-web-fasciculo-I
cartilha-w3cbr-acessibilidade-web-fasciculo-ILuca Toledo
 
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...Talita Pagani
 

La actualidad más candente (17)

Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...
Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...
Acessibilidade: Inclusão da pessoa com deficiência a partir do desenho univer...
 
Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?
 
Acessibilidade Comunicacional
Acessibilidade ComunicacionalAcessibilidade Comunicacional
Acessibilidade Comunicacional
 
“Guia Turismo Acessível” um País onde Todos podem Viajar!
“Guia Turismo Acessível” um País onde Todos podem Viajar!“Guia Turismo Acessível” um País onde Todos podem Viajar!
“Guia Turismo Acessível” um País onde Todos podem Viajar!
 
Acessibilidade, legislação e potencial das PcD
Acessibilidade, legislação e potencial das PcDAcessibilidade, legislação e potencial das PcD
Acessibilidade, legislação e potencial das PcD
 
E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1
 
Web acessível
Web acessívelWeb acessível
Web acessível
 
Acessibilidade nas mídias digitais
Acessibilidade nas mídias digitaisAcessibilidade nas mídias digitais
Acessibilidade nas mídias digitais
 
Introdução a Internet
Introdução a InternetIntrodução a Internet
Introdução a Internet
 
Acessibilidade web
Acessibilidade webAcessibilidade web
Acessibilidade web
 
Acessibilidade x usabilidade
Acessibilidade x usabilidadeAcessibilidade x usabilidade
Acessibilidade x usabilidade
 
Guia de Acessibilidade de Interfaces Web focado em Aspectos do Autismo
Guia de Acessibilidade de Interfaces Web focado em Aspectos do AutismoGuia de Acessibilidade de Interfaces Web focado em Aspectos do Autismo
Guia de Acessibilidade de Interfaces Web focado em Aspectos do Autismo
 
Web Standards
Web StandardsWeb Standards
Web Standards
 
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidade
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidadeConteúdos digitais multimídia: o foco na usabilidade e na acessibilidade
Conteúdos digitais multimídia: o foco na usabilidade e na acessibilidade
 
Conceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidadeConceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidade
 
cartilha-w3cbr-acessibilidade-web-fasciculo-I
cartilha-w3cbr-acessibilidade-web-fasciculo-Icartilha-w3cbr-acessibilidade-web-fasciculo-I
cartilha-w3cbr-acessibilidade-web-fasciculo-I
 
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...
Design de Interfaces e Acessibilidade: você está fazendo isso errado... até a...
 

Similar a Acessibilidade na web para inclusão digital

Acessibilidade Digital (19/02/2013)
Acessibilidade Digital (19/02/2013)Acessibilidade Digital (19/02/2013)
Acessibilidade Digital (19/02/2013)Rodrigo Leme
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1cdchaves
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1angeli_mk
 
Acessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC DevAcessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC DevLucas J Silva
 
DaSilva_Tutorial_Inovaday_Setembro_2011
DaSilva_Tutorial_Inovaday_Setembro_2011DaSilva_Tutorial_Inovaday_Setembro_2011
DaSilva_Tutorial_Inovaday_Setembro_2011Hudson Augusto
 
Acessibilidade computacional - Fundamentos da Computação .pptx
Acessibilidade computacional - Fundamentos da Computação .pptxAcessibilidade computacional - Fundamentos da Computação .pptx
Acessibilidade computacional - Fundamentos da Computação .pptxJessicaMoraes69
 
Acessibilidade e e-MAG
Acessibilidade e e-MAGAcessibilidade e e-MAG
Acessibilidade e e-MAGGovBR
 
Aplicações web acessíveis
Aplicações web acessíveisAplicações web acessíveis
Aplicações web acessíveisLeandro Borges
 
Aplicações Web Acessíveis
Aplicações Web AcessíveisAplicações Web Acessíveis
Aplicações Web AcessíveisDiego Pessoa
 
Dez motivos para você continuar desenvolvendo para a Web
Dez motivos para você continuar desenvolvendo para a WebDez motivos para você continuar desenvolvendo para a Web
Dez motivos para você continuar desenvolvendo para a WebReinaldo Ferraz
 
Acessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in SampaAcessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in SampaLucas J Silva
 
Rascunho do Seminário sobre Acessibilidade na Web
Rascunho do Seminário sobre Acessibilidade na WebRascunho do Seminário sobre Acessibilidade na Web
Rascunho do Seminário sobre Acessibilidade na WebLucas Augusto Carvalho
 
Web 2.0 + Foco no Usuário
Web 2.0 + Foco no UsuárioWeb 2.0 + Foco no Usuário
Web 2.0 + Foco no Usuárioguest479a40
 
Cartilha de Acessibilidade na WEB - Fascículo ll
Cartilha de Acessibilidade na WEB - Fascículo llCartilha de Acessibilidade na WEB - Fascículo ll
Cartilha de Acessibilidade na WEB - Fascículo llBrasscom
 
Conheça o e-MAG
Conheça o e-MAG Conheça o e-MAG
Conheça o e-MAG GovBR
 

Similar a Acessibilidade na web para inclusão digital (20)

Acessibilidade web
Acessibilidade webAcessibilidade web
Acessibilidade web
 
Acessibilidade Digital (19/02/2013)
Acessibilidade Digital (19/02/2013)Acessibilidade Digital (19/02/2013)
Acessibilidade Digital (19/02/2013)
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1
 
Acessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC DevAcessibilidade em CSS - ABC Dev
Acessibilidade em CSS - ABC Dev
 
DaSilva_Tutorial_Inovaday_Setembro_2011
DaSilva_Tutorial_Inovaday_Setembro_2011DaSilva_Tutorial_Inovaday_Setembro_2011
DaSilva_Tutorial_Inovaday_Setembro_2011
 
Acessibilidade computacional - Fundamentos da Computação .pptx
Acessibilidade computacional - Fundamentos da Computação .pptxAcessibilidade computacional - Fundamentos da Computação .pptx
Acessibilidade computacional - Fundamentos da Computação .pptx
 
Acessibilidade e e-MAG
Acessibilidade e e-MAGAcessibilidade e e-MAG
Acessibilidade e e-MAG
 
Introdução aos Padrões Web e Tecnologias para o Ambiente Digital - Aula 3 - 1...
Introdução aos Padrões Web e Tecnologias para o Ambiente Digital - Aula 3 - 1...Introdução aos Padrões Web e Tecnologias para o Ambiente Digital - Aula 3 - 1...
Introdução aos Padrões Web e Tecnologias para o Ambiente Digital - Aula 3 - 1...
 
Acessibilidade
AcessibilidadeAcessibilidade
Acessibilidade
 
Aplicações web acessíveis
Aplicações web acessíveisAplicações web acessíveis
Aplicações web acessíveis
 
Aplicações Web Acessíveis
Aplicações Web AcessíveisAplicações Web Acessíveis
Aplicações Web Acessíveis
 
Dez motivos para você continuar desenvolvendo para a Web
Dez motivos para você continuar desenvolvendo para a WebDez motivos para você continuar desenvolvendo para a Web
Dez motivos para você continuar desenvolvendo para a Web
 
Acessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in SampaAcessibilidade em CSS - Front in Sampa
Acessibilidade em CSS - Front in Sampa
 
Rascunho do Seminário sobre Acessibilidade na Web
Rascunho do Seminário sobre Acessibilidade na WebRascunho do Seminário sobre Acessibilidade na Web
Rascunho do Seminário sobre Acessibilidade na Web
 
Web 2.0 + Foco no Usuário
Web 2.0 + Foco no UsuárioWeb 2.0 + Foco no Usuário
Web 2.0 + Foco no Usuário
 
Cartilha de Acessibilidade na WEB - Fascículo ll
Cartilha de Acessibilidade na WEB - Fascículo llCartilha de Acessibilidade na WEB - Fascículo ll
Cartilha de Acessibilidade na WEB - Fascículo ll
 
Acessibilidade na Web - Salomão Alcolumbre
Acessibilidade na Web - Salomão AlcolumbreAcessibilidade na Web - Salomão Alcolumbre
Acessibilidade na Web - Salomão Alcolumbre
 
Conheça o e-MAG
Conheça o e-MAG Conheça o e-MAG
Conheça o e-MAG
 
Aula 07 acessibilidade
Aula 07  acessibilidadeAula 07  acessibilidade
Aula 07 acessibilidade
 

Acessibilidade na web para inclusão digital

  • 1. Inclusão digital através da acessibilidade na web Bruno Borges – Marketing Digital Julho / 2009
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.

Notas del editor

  1. A essência da inclusão digital - permitir que toda a sociedade possa ter acesso a informações disponíveis na Internet, e assim produzir e disseminar conhecimento. A inclusão digital é um parte do todo, que é a inclusão social
  2. Quando se fala em inclusão digital, a maioria das pessoas associa o termo apenas à inclusão de pessoas em condição econômica desfavorável. Sob essa ótica, são considerados 3 fatores: equipamento, acesso à rede e o domínio dessas ferramentas. Então são criadas linhas de crédito para financiamento de computadores, cursos gratuitos para a população carente aprender a utilizar a internet, centros de acesso gratuito à web, etc. Porém, a inclusão digital volta-se também para o desenvolvimento de tecnologias que ampliem a acessibilidade para usuários com deficiência, que se dá através da chamada “e-acessibility”, ou acessibilidade às TIs. Ocorre que esta fatia de pessoas sem acesso à informação online é muitas vezes esquecida.
  3. Atualmente muito se fala sobre inclusão digital. A primeira coisa que se pensa sobre o assunto é sobre a inclusão de pessoas socialmente desfavorecias. Mas há muito mais do que isso, e no que tange à internet, a inclusão dos deficientes visuais é muito importante, visto que a deficiência visual é a que mais atrapalha ou impede o acesso às informações na web, que são quase totalmente visuais.
  4. A inclusão das pessoas que possuem necessidades especiais é uma forma de inserir estas pessoas no universo de informações da internet. E isto é uma necessidade social, uma obrigação da sociedade em relação a estas pessoas.
  5. É aqui que tudo começa na prática. Para se desenvolver sites acessíveis, existem 2 pilares básicos: Webstandards e semântica
  6. A semântica é extremamente importante em vários aspectos. Além de facilitar o acesso a usuários com necessidades especiais, também favorece o acesso por dispositivos diversos e faz com que os mecanismos de busca “entendam” melhor a sua página, posicionando melhor seu site nas buscas. Além disso, é também um fator para agilizar o carregamento da página.
  7. o título de uma página deve usar <H1>, que significa Heading 1 (cabeçalho 1) e não simplesmente um parágrafo com fonte bold. Tabelas <table> são feitas para dados tabulados, e não para diagramar uma página. Menus são listas não ordenadas, por tanto devem usar a tag <UL> e assim sucessivamente.
  8. Esse termo virou moda. As pessoas costumam dizer “ah, eu faço site em tableless” como se isso fosse uma linguagem ou uma tecnologia. Na prática, tableless em tradução literal significa “sem tabelas”. Isto significa que não são usadas tabelas para “diagramar” a página. Este é apenas um dos fatores da semântica na web, que é um dos principais pontos considerados para o SEO.
  9. Quando há um link, ele emite o aviso “link” ou “link externo” e o endereço do mesmo. Quando há uma imagem, ele procura pelas tags descritivas desta (alt ou title). Caso não encontre, lê o nome do arquivo.
  10. Expressões isoladas não são bem entendidas pelos leitores de texto.
  11. - Estes elementos são responsáveis pela exibição das tool tips exibidas ao posicionarmos o mouse sobre uma imagem, por exemplo. - No caso de um link, é muito importante pois traz uma descrição do destino do link e do que se trata. O aviso é algo como “Link externo: Site do N Design”, onde link externo é pronunciado automaticamente pelo software e site do N design é o conteúdo definido na tag Alt ou Title. No caso de uma imagem, traz a descrição da mesma para o leitor de tela ou mesmo para dispositivos que não possam exibir imagens. Muito importantes também na indexação pelso mecanismos de busca
  12. Access Key é um atributo usado em algumas tags da linguagem HTML, que possibilita acessar determinada área da página simplesmente pressionando alguma tecla pré-determinada. É importante que esteja localizado no início da página, pois os leitores de tela percorrem o conteúdo linearmente, e um menu “ir para” economiza muito tempo. Deve-se listar elementos importantes da página, como menu, conteúdo e busca, por exemplo.
  13. <a name=“menuinferior"></a> <a href="#menuinferior">Texto</a>
  14. É necessário usar diferentes folhas de estilo (CSS). O usuário, ao clicar no local indicado, alterna entre o uso de cada uma delas, que já estarão pré-formatadas para os diferentes níveis de contraste.
  15. Browsers mais novos já vêm com o recurso de zoom na página, que evita quebras no layout quando apenas o texto é aumentado.