Por Richard em 27/02/2008
Nunca foi tão importante se preocupar com desenvolvimento de sites para dispositivos móveis, mas apesar da mobilidade já ser uma realidade para o brasileiro, a web parece não estar preparada ainda.
Sobre a deficiência Tecnológica
O alerta começou com a disseminação dos Palms e PDAs e logo depois com a chegada dos blackberrys e smartphones às lojas de telefonia. Dispositivos que mereciam uma atenção especial por possuírem resolução de tela limitada (geralmente 320×240 a 640×480) e por não estarem inicialmente acessíveis a plugins como o do Flash Player, por exemplo.
Há alguns meses com o lançamento do OLPC (One Laptop Per Child), uma nova categoria chamada subnotebooks surgiu. O Asus EEE, o XO e o Classmate são exemplos disso, computadores portáteis com monitor de 7 a 12 polegadas, alguns com Windows e outros com Linux e com resolução de tela entre 640×480 e 800×600.
Usuários acessando a web com dezenas de dispositivos, sistemas operacionais e browsers diferentes.
Conceitos e Métodos
O feijão com arroz de um site acessível é ser criado totalmente nos novos padrões web. Ou seja, HTML semântico, Javascript não-obstrusivo e Layout todo no CSS (tableless).
Veja o que fazer para tornar o conteúdo adaptável ao máximo número de usuários:
- Evite Flash ou ofereça conteúdo alternativo.
- Use layout líquido/fluído ou ofereça alternativas de resolução
- Organize sua Tab Index e permita uma boa navegação usando apenas as teclas Tab e Enter (sem utilizar o mouse)
- Preencha todos os atributos ALT descrevendo as imagens
- Possibilite aumento da fonte – lembrem-se que definir font-size com unidade px bloqueia a alteração do tamanho da fonte em alguns browsers.
- Botão Ir para conteúdo no início da página agiliza a navegação.
Existe ainda o bom senso de evitar que a navegação dependa da interpretação de icones, imagens ou cores específicas. Mas no fim das contas acessibilidade é respeitar o usuário e simplificar a navegação, favorecendo sua usabilidade.
Na prática
Pensando na importância de desenvolver interfaces mais acessíveis, fiz alguns estudos e adicionei aqui no blog recursos como seletor de resolução e um algoritmo para identificação de dispositivos móveis.
Na imagem, a versão mobile deste site, que é carregada automaticamente quando acessado por um dispositivo móvel.
Entenda melhor as necessidades do usuário lendo as normas da WCAG aqui.
Guilherme Faria em 27/02/2008 às 09:34
Richard,
bacana seu blog.
Como você é um entusiasta das web móvel, gostaria de sugerir uma visita ao wap.telelistas.net
O serviço que desenvolvemos aqui na empresa, permite busca de telefones por nome ou atividade relacionada. E ainda exibe um mapa de localização do endereço para grande parte das empresas no Brasil.
Abraços,
Guilherme
[Responder]
Wilian Fiabani em 25/04/2008 às 11:19
Me ajudou bastante, pretendo desenvolver um sistema para dispositivos mobile usando (x)html e php, muito util sua ajuda!
[Responder]
eduardo em 29/04/2008 às 13:17
Olá Richard, fiquei intrigado a respeito do seu: algoritmo para identificação de dispositivos móveis.
Você está usando algum tipo de engine já pronto ou você fez tudo do 0.
[]´s
[Responder]
Quando o cliente não dá a mínima para padrões web - Richard Barros em 13/07/2008 às 17:08 - Pingback
[...] Veja também algumas dicas sobre como aumentar suas visitas sem fazer muito esforço e de como praticar acessibilidade para dispositivos limitados. Leia Também…Acessibilidade para dispositivos limitadosTab Index: Navegação mais acessível no FlashCSS em textos selecionados pelo mouse [...]