Desde 2007, o iPhone inspira web designers a criar páginas otimizadas. Vem com Safari da Apple. Também pode baixar Opera na App Store. Não precisa redesenhar site; ambos navegadores exibem páginas como no computador. Mas vale criar design mais enxuto para carregar rápido no iPhone. Precisa conhecimento de CSS, HTML e iPhone para testar.
O que você vai precisar
- iPhone
- Software de edição HTML e CSS
Instruções
- Abra seu arquivo ".html" atual no editor HTML/CSS. Editores de texto básicos servem: Bloco de Notas (Windows), TextEdit (Mac).
- Adicione elemento "<link>" na seção "<head>" do HTML referenciando novo arquivo ".css" (ex: "iphone.css"). Caminho igual aos outros CSS. Inclua instrução para carregar só em dispositivos com largura máx. 480px. Exemplo:
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="/iphone.css" type="text/css" />
- Crie novo arquivo ".css" no editor. Nomeie "iphone.css". Escreva como CSS normal, espelhando seu CSS principal. Para iPhone: organize tudo em coluna única, largura 100% para preencher tela. Oculte elementos desnecessários com "display:none". Experimente até design satisfatório.
- Faça upload do novo CSS para seção do site indicada no "<link>". Substitua HTML original pelo revisado.
