O iPhone não é apenas um telefone celular, sua principal vantagem está na possibilidade de acessar a internet na sua plenitude através do seu navegador Safari que vem instalado por padrão. Esse navegador suporta as mais avançadas tecnologias como CSS e Javascript e faz com que ter um site adaptado ao tamanho da tela do iPhone seja fundamental para ampliar ainda mais o alcance da sua empresa.

Uma das formas de melhorar essa experiência do usuário do iPhone com o seu site é disponibilizar um ícone criado especificamente para ser incluído na home screen do aparelho, permitindo que com apenas um toque o usuário seja levado diretamente para o seu site, sem que seja preciso digitar a url na barra de endereço.

Esse ícone deve ser criado de acordo com algumas regras bem específicas determinadas pela Apple. A primeira delas diz respeito ao formato do arquivo, que deve ser em PNG para tirar vantagem de tudo que o iPhone pode oferecer.

Esse PNG não deve incluir o canal alpha de transparência e também não pode ter nenhum brilho ou efeito de gloss, já que ele será acrescentado automaticamente pelo iPhone. E, por fim, o arquivo deve ter o tamanho de 57 x 57 pixels e ter cantos retos para que o próprio aparelho possa criar os cantos arredondados sem causar distorções na imagem.

Para instalar esse ícone no seu site você deve seguir um procedimento bem simples e rápido. O primeiro passo é colocar o arquivo do ícone no diretório raiz do seu site e em seguida renomeá-lo para apple-touch-icon.png, que é o nome padrão que o iPhone busca automaticamente no site.

Você também pode usar um outro nome para o arquivo, para isso basta incluir no header do seu arquivo HTML a seguinte linha:

<link rel="apple-touch-icon" href="/icons/icone_iphone.png" />

Com ela você pode não somente alterar o nome do arquivo como também colocá-lo em uma outra pasta que não seja a raiz do seu site.

Pronto! Com essa dica você pode personalizar ainda mais o seu site dentro do iPhone.