msgbartop
SQL Server, Dicas, Rails, Mobile
msgbarbottom

15 Apr 09 Mobile: Dicas de como começar a criar um site para Mobile

Olá Pessoal,

Vou colocar aqui algumas dicas e falar um pouco sobre como criar um site para mobile.

Primeira coisa que tem que vir na cabeça quando for desenvolver um site para mobile é não pensar como um site convencional.
Para mobile menos é mais, ou seja, tem que ser objetivo e direto.
Seu site é de noticias, coloca noticia.
Se o seu site é da empresa, coloque as informações da empresa e o que ela oferece.
Site para celular não é a mesmo site do convencional, então ai vem a primeira dica para quem quer começar:

1- Ler estes dois posts da Talita Pagani
Websites para mobile não são miniaturas dos sites convencionais – parte I
Websites para mobile não são miniaturas dos sites convencionais – parte II

Lá ela fala muitas boas práticas para quando for desenvolver o site para mobile.

Outra dica que eu vou dar é que quando uma pessoa começa a desenvolver para mobile vem a pergunta onde testo e onde valido meu mobile para saber se estou no caminho certo?

2- Navegadores
Bom, para testar temos um excelente navegador chamado Opera Mini – http://www.opera.com/mini/demo, porém ele necessita o java instalado, mas é um excelente companheiro nas horas de estar desenvolvendo para mobile.

Ótimo, mas só o opera mini?
Não, esta próxima dica, além de dar nota para seu mobile, ele oferece 5 opções de celulares para testes. Vamos a terceira dica.

3- Validando e checando
Para validar seu mobile nada melhor que o W3C – http://validator.w3.org/mobile/
Nele vai ter os warning, erros e tudo mais.

Para checagem tem um site muito bom, é o ready – http://ready.mobi
Ele traz informações como: Nota do seu mobile, size(tamanho total), custo dele, tempo gasto para abrir a página, warnings e erros e mobiles para testar seu site.

Hum, mas senti falta de um site para estatistica, ótimo então aqui vai outra dica, que veio do mobileadsbrasil via twitter – http://www.twitter.com/mobileadsbrasil .
4- É um site chamado Percent Mobile – http://percentmobile.com
Ele traz quais aparelhos estão acessando, pais, fabricante, dimensão da tela e provedores.
Muito útil a ferramenta.

Outra site é este: http://www.myrtmobile.com/ dica de Andre ferraro – http://www.twitter.com/andreferraro
O site traz informações e gráficos semelhantes ao percentmobile, assim como visitas de cada celular.

Agora, vou trazer algumas informações uteis, pelo menos me ajudaram na hora de criar um site para mobile.

5- Doctype para mobile
Versão 1.0 – Mais utilizada
<!DOCTYPE html PUBLIC “-//WAPFORUM//DTD XHTML Mobile 1.0//EN” “http://www.wapforum.org/DTD/xhtml-mobile10.dtd”>

Versão 1.2
<!DOCTYPE html PUBLIC “-//WAPFORUM//DTD XHTML Mobile 1.2//EN” “http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd”>

6- Nas imagens tem que vir as proporções certas. Ex: imagem.jpg 750 x 640.
Tem que colocar com todas as informações abaixo:
<img src=”imagem.jpg” alt=”Imagem” title=”Imagem” width=”750″ height=”640″ />
Não colocar: px, tamanho diferente do real.

7- Evitar utilizar tabelas, no lugar use div.

8- Não carregar o site para mobile com muitas imagens, lembre-se muitos celulares tem custo por tamanho(size) total, faça um mobile site com menos de 10kb.

9- Site para pesquisa: www.ummobilesitepordia.com.br
Todo dia eles postam um site para mobile.

10- O meu próprio mobile desenvolvido:
http://m.logicadigital.info

11- Utilizem em links o accesskey, para a acessibilidade.

Bom pessoal por enquanto é isso, quem tiver dicas, comentários e etc…me mandem eu coloco aqui.
Fiquem a vontade, caso apareça algo novo estarei colocando também.

Abraço,
Marcelo

Tags: , , ,

Leave a Comment

Spam Protection by WP-SpamFree