Este primeiro parágrafo do MAQ me botou uma pulga na orelha: se eu coloco numa imagem ALT e TITLE iguais, o leitor de tela não vai ler os dois, gerando verborragia?
Abraços!
Carlos
De: acessodigital@googlegroups.com [mailto:acessodigital@googlegroups.com] Em nome de MAQ
Enviada em: quinta-feira, 12 de julho de 2012 16:52
Para: acessodigital@googlegroups.com
Assunto: Re: [Acesso Digital] Re: Imagem como logomarca
Oi Cynthia, boa tarde.
Vários aspectos podem ser observados a favor do elemento h1/h6 para colocarmos os títulos dos documentos. O principal deles é justamente o salto. Se estou no topo da página e teclo a letra h e houver o nome do site em um h1, independente de estar com imagem ou apenas com texto, o conteúdo de h1 será falado para mim. Na imagem, claro, utilizando-se alt para IE e title para FF e Chrome.
A tag title não possui salto, apenas sonoralização e, mesmo assim, quando se chega nela em um link ao qual, para chegarmos diretamente, teríamos de utilizar outros recursos como um accesskey. O único leitor de tela que sonoriza diretamente um title colocado em um link é o Virtual Vision e, mesmo assim, por erro. Ele quando sonoriza o title deixa de sonorizar (falar) o texto do link.
Resumindo a história, os h1/h6 (headings) são utilizados internacionalmente para se fazer títulos, assim como seu próprio nome indica (headings), e o nome de um site é o primeiro e maior heading que ele possui.
Considero, inclusive, um erro de acessibilidade na web a não colocação de um h1 no título que dá nome ao site. Mas, estamos aqui para aprender e gostaria de saber qual o motivo semântico de não se colocar um h no título do site? Para que serve, nos padrões web, os headings?
Quanto aos hiperlinks com o atributo title, além de não possuirem saltos passam dispercebidos pela maioria dos leitores de tela. Poucos deles leem titles. Sendo assim, não são universais. Entretanto, como já disse em e-mail anterior, os headings também não são universais, pois navegadores como o Webvox e o Virtual Vision o ignoram.
A amiga lembra das questões criadas em CSS pelo IE6 e outros navegadores, a difícil harmonia da apresentação que tínha-se de se criar entre os navegadores devido ao fato do IE estar fora dos padrões? Isso acontece também com nossos leitores de tela. Os modernos, como o NVDA e Jaws fazem saltos nos elementos, os antigos Webvox e Virtual Vision não. Dessa forma, os saltos para os antigos leitores são feitos apenas por âncoras criadas pelo desenvolvedor e nos links também. Assim, como em geral colocam a volta a página principal nas logomarcas dos sites para que, nas páginas internas possa se chegar à principal, caso se faça isso, pode-se acabar fazendo um link para a página principal na própria página principal caso não se tome cuidado em alguns CMSs. Caramba, vamos chegar ao final do mundo conversando sobre isso. Mas, te garanto que, se colocarmos um h na logomarca, estaremos fazendo acessibilidade. Tentamos aproveitar o melhor possível os recursos oferecidos para podermos navegar da forma mais rápida e otimizada possível e o recurso do h1 na logomarca é um deles.
Não sei se a amiga sabe, mas no caso dos h1/h6 se teclarmos o número do h ele navega diretamente para cada número... assim, se eu quiser somente navegar por h2, basta eu ir teclando 2, 2, 2, e irei passando de h2 em h2 na página... Se teclar apenas o número 1... pimba, estarei diretamente sabendo o nome do site! Não há nada mais rápido que isso para nós... para quem enxerga, basta direcionar o olhar... para nós, temos de direcionar o cursor. Que acha?
Abraços acessíveis e fáceis de usar do MAQ.
***
Bengala Legal - Cegos, Inclusão e Acessibilidade: www.bengalalegal.com
Acessibilidade Legal - Sites Acessíveis para todos:
www.acessibilidadelegal.com
Twitter: http://twitter.com/bengala_legal
***
P. S.: Você está recebendo um e-mail de uma pessoa cega. Isto é inclusão
digital! Comemore conosco.
Uma sociedade inclusiva é aquela que reconhece, respeita e valoriza a
diversidade humana.
MAQ - Rio de Janeiro - CEL: (21) 9912-0000.
***
From: Cynthia Azevedo
Sent: Thursday, July 12, 2012 10:48 AM
Subject: Re: [Acesso Digital] Re: Imagem como logomarca
Oi MAQ,
Muito obrigada pelos esclarecimentos.
Já tinha lido a respeito da navegação através dos títulos, mas não me toquei desse aspecto com relação ao logotipo e, em especial, ao nome do site.
Ainda assim, não estou completamente convencida (risos). Me falta mais experiência com os leitores de tela.
Não seria menos repetitivo, e até faria mais sentido se, ao invés do H1 na imagem do logo, o nome do site fosse acessado pela tag title do documento?
Abraços,
Cynthia Azevedo Magalhães
(21) 7293.1103 \ 3176.1991
@cynazem
Em 12 de julho de 2012 00:21, MAQ <maq@bengalalegal.com> escreveu:
Oi Bruno e Sintia,
Antes de mais nada, Sintia, desculpe-me por não escrever direito seu nome, não consigo soletração nos leitores de tela para os nomes que vem antes do assunto na caixa de entrada e não há subscrição de seu nome no corpo do e-mail.
Quanto ao assunto, sempre coloco h1 nas logomarcas de meus sites pelo fato do h1 servir para salto e a logomarca com o título do site ser a coisa mais importante de todos os títulos. A semantica do dos headings são exatamente para títulos e nos servem para saltos nas páginas web. Toda vez que, em navegadores modernos como o NVDA e o Jaws, teclamos a letra h em qualquer parte do site, a página rola até o próximo H, assim como se teclarmos t para a próxima tabela, c para a próxima combo, f para o próximo formulário, e para o próximo campo de edição,l para a próxima lista, i para o próximo item de lista, g para a próxima imagem etc. Assim, um h1 na logomarca faz com que tenhamos uma acessibilidade incrível na navegação, pois poderemos saber de imediato o título do site. Eu o coloco como primeiro título em todas as páginas do site por esse motivo de acesso rápido.
Atualmente, com html5, podemos colocar uma role com banner para que esse salto aconteça, mas o costume ainda me faz preferir teclar h e sair navegando pelo site com esses saltos por objetos, eu também os chamo de saltos por elementos, pois a maioria os possui. A página de resultados do Google utiliza h1 e landmarks, role banner ao mesmo tempo. Ele não deixa de ser semântico porque o título de um site é o primeiro e principal título de uma página, sob o qual virão outros títulos e elementos.
Para pessoas com deficiência visual acaba por tornar-se uma excelente acessibilidade a navegação por títulos quando se quer ter uma ideia global do que existe no site e nada como se saber seu nome, certo? Deixar de colocar um h1 nessa informação deixa muitos cegos desconhecedores do nome do site, embora possamos navegar com setas para baixo até chegar o nome dele. Em navegadores e leitores de tela mais antigos é assim que fazemos, mas nos navegadores e leitores de tela que respeitam os padrões web esse tipo de navegação é esperada.
Abraços acessíveis do MAQ.
***
Bengala Legal - Cegos, Inclusão e Acessibilidade: www.bengalalegal.com
Acessibilidade Legal - Sites Acessíveis para todos:
www.acessibilidadelegal.com
Twitter: http://twitter.com/bengala_legal
***
P. S.: Você está recebendo um e-mail de uma pessoa cega. Isto é inclusão
digital! Comemore conosco.
Uma sociedade inclusiva é aquela que reconhece, respeita e valoriza a
diversidade humana.
MAQ - Rio de Janeiro - CEL: (21) 9912-0000.
***
From: Cynthia Azevedo
Sent: Wednesday, July 11, 2012 5:47 PM
Subject: [Acesso Digital] Re: Imagem como logomarca
Bruno, acredito que basta assegurar que sua imagem informe o atributo alt. Quanto às técnicas de identação do texto e imagem dentro de H1, embora muito utilizado, não acho que seja "semântico". Já comparei em vários sites considerados referência na área de desenvolvimento frontend e cada um está de um jeito diferente. Do ponto de vista da SEO, vi alguns vídeos de especialistas do Google no Youtube, que não incentivavam tais práticas. Se o logotipo é uma forma abstrata ou de uma tipografia difícil de se reproduzir com os elementos adequados para texto oferecidos com xhtml/css, então a imagem, apenas, é um elemento válido para comunicação, tanto do ponto de vista da semântica, como da acessibilidade e SEO.
Vale ressaltar que não encontrei argumentos contra as práticas de identação de texto e imagem dentro de H1, mas a idéia de não usá-los é a que mais faz sentido para mim.
Em quarta-feira, 11 de julho de 2012 01h10min21s UTC-3, @brunopulis escreveu:
Boa Madrugada prezados,
Estou com uma dúvida no ponto de vista da acessibilidade tenha uma imagem referente a uma logomarca de um website que estou desenvolvendo.
Qual seria a melhor técnica prezando a acessibilidade, utilizar um text-indent na minha tag <h1> ou inserir uma imagem dentro do meu <h1> ?
Desde já agradeco a atencao de todos!
--
Abraços,
Bruno Pulis - (31) 9480-3164
Desenvolvedor Web
Linux User #535231
Ubuntu User #33747
Twitter: @brunopulis
--
Grupo "Acesso Digital" em Grupos do Google.
Para postar neste grupo, envie um e-mail para acessodigital@googlegroups.com
Para cancelar a sua inscrição neste grupo, envie um e-mail para acessodigital-unsubscribe@googlegroups.com
Para ver mais opções, visite este grupo em http://groups.google.com/group/acessodigital?hl=pt-BR
Acesso Digital - http://acessodigital.net
--
Grupo "Acesso Digital" em Grupos do Google.
Para postar neste grupo, envie um e-mail para acessodigital@googlegroups.com
Para cancelar a sua inscrição neste grupo, envie um e-mail para acessodigital-unsubscribe@googlegroups.com
Para ver mais opções, visite este grupo em http://groups.google.com/group/acessodigital?hl=pt-BR
Acesso Digital - http://acessodigital.net
--
Grupo "Acesso Digital" em Grupos do Google.
Para postar neste grupo, envie um e-mail para acessodigital@googlegroups.com
Para cancelar a sua inscrição neste grupo, envie um e-mail para acessodigital-unsubscribe@googlegroups.com
Para ver mais opções, visite este grupo em http://groups.google.com/group/acessodigital?hl=pt-BR
Acesso Digital - http://acessodigital.net
--
Grupo "Acesso Digital" em Grupos do Google.
Para postar neste grupo, envie um e-mail para acessodigital@googlegroups.com
Para cancelar a sua inscrição neste grupo, envie um e-mail para acessodigital-unsubscribe@googlegroups.com
Para ver mais opções, visite este grupo em http://groups.google.com/group/acessodigital?hl=pt-BR
Acesso Digital - http://acessodigital.net






0 comentários:
Postar um comentário