Publicado por: euchuma | 30 setembro 2009

Faça seu site para o iPhone

iPhone é um celular inovador e sucesso de vendas no mundo inteiro, inclusive aqui no Brasil. Consequentemente o aparelho da Apple corresponde a mais da metade dos acessos de internet móvel, para ser mais preciso, da última vez que vi as estatísticas, elas apontavam que 61% dos acessos a internet móvel eram realizados por meio do iPhone.

Então se você quer que o seu site esteja presente na internet móvel, mais da metade do caminho consiste em tornar o seu site compatível com o iPhone. E para isso produzi um exemplo de website que pode ser baixado aqui e um roteiro com os pontos mais importantes para tornar seu site compatível com o iPhone.

Antes de mais nada, vale a pena conferir o site para iPhone que fiz para a minha agência especializada no desenvolvimento de web sites: http://www.w2c.com.br

Vamos então ao nosso roteiro:

1- Sites e animações em Flash não funcionam no iPhone. Temos então que utilizar a famosa combinação HTML + Javascript para construir nosso site.

2- É muito importante utilizar as dimensões corretas, e isso vale quando o iPhone está na vertical ou na horizontal. Na vertical a área útil para o conteúdo do site é de 320×356 pixels e na horizontal a área útil é 480×208 pixels.

dimensões do site para iPhone

3- Determine o viewport correto para a sua página. O viewport é uma área retangular que determina o layout do conteúdo e as quebras de linhas dos textos, funciona como um “zoom” da página. Em nosso exemplo utilizamos o viewport igual a “1.0”, pois nosso exemplo foi construído utilizando as dimensões da tela do iPhone.

4- Redimensione o site para a vertical e horizontal. Vale a pena gastar um pouco mais de tempo fazendo e utilizar esse recurso bacana do iPhone. O nosso exemplo tem esse recurso, estude como ele funciona, é bem simples.

5- Fique atento ao tamanho da página, principalmente ao tamanho das imagens. Lembre-se que nem todo mundo tem rede 3G, muito ainda utilizam o EDGE que é bastante lento, então não abuse da paciência do usuário.

-> Clique aqui para download do site exemplo para iPhone


Deixe uma resposta

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

Categorias

%d blogueiros gostam disto: