Neste artigo
Há anos, os especialistas dizem que o tráfego de visitantes em dispositivos móveis para sites tem aumentado drasticamente. Por esse motivo, muitas empresas começaram a adotar de forma inteligente uma estratégia móvel para sua presença online, criando experiências adequadas para telefones e outros dispositivos móveis. Depois de aprender a criar páginas da Web para telefones celulares e implementar sua estratégia, você também desejará ter certeza de que os visitantes do seu site podem ver esses designs. Há muitas maneiras de fazer isso e algumas funcionam melhor do que outras. Aqui está uma olhada no método que você pode usar para implementar o suporte móvel em seus sites – junto com uma recomendação próxima ao final sobre qual é o melhor método para conseguir isso na Web hoje.
Forneça um link para outra versão do site
Este é, de longe, o método mais fácil de lidar com usuários de telefones celulares. Em vez de se preocupar se eles podem ou não ver suas páginas, basta colocar um link em algum lugar próximo ao topo da página que aponta para uma versão móvel separada do seu site. Em seguida, os leitores podem selecionar se desejam ver a versão móvel ou continuar com a versão “normal”. O benefício dessa solução é que ela é fácil de implementar. Ele requer que você crie uma versão otimizada para celular e, em seguida, adicione um link em algum lugar próximo ao topo das páginas normais do site. As desvantagens são:
- Você deve manter uma versão separada do site para usuários móveis. À medida que seu site fica maior, você pode esquecer de manter a segunda versão e seus sites podem perder a sincronia.
- Você também cria uma terceira versão para tablets? Que tal uma quarta versão para wearables? Este conceito de versões específicas do dispositivo pode sair do controle muito rapidamente.
- Você deve colocar um link feio no topo da página que os leitores não móveis possam ver (e possivelmente clicar nele).
Em última análise, essa abordagem está desatualizada e provavelmente não fará parte de uma estratégia móvel moderna. Às vezes, é usado como uma solução temporária enquanto uma solução melhor está sendo desenvolvida, mas é realmente um band-aid de curto prazo neste momento.
Use JavaScript
Em uma variação da abordagem mencionada acima, alguns desenvolvedores usam algum tipo de script de detecção de navegador para detectar se o cliente está em um dispositivo móvel e, em seguida, redirecioná-lo para esse site móvel separado. O problema com a detecção de navegador e dispositivos móveis é que existem milhares de dispositivos móveis por aí. Tentar detectá-los todos com um JavaScript pode transformar todas as suas páginas em um pesadelo de download – e você ainda está sujeito a muitas das mesmas desvantagens da abordagem mencionada acima.
Usar CSS @media Handheld
O comando CSS @media handheld parece ser uma forma ideal de exibir estilos CSS apenas para dispositivos portáteis – como telefones celulares. Esta parece ser a solução ideal para exibir páginas para dispositivos móveis. Você escreve uma página da Web e, em seguida, cria duas folhas de estilo. O primeiro para o tipo de mídia “tela” estiliza sua página para monitores e telas de computador. O segundo para o “handheld” estiliza sua página para pequenos dispositivos como esses telefones celulares. Parece fácil, mas não funciona na prática. A maior vantagem desse método é que você não precisa manter duas versões do seu site. Você apenas mantém um, e a folha de estilo define como deve ser – o que na verdade está se aproximando da solução final que desejamos. Um problema com esse método é que muitos telefones não suportam o tipo de mídia – eles exibem suas páginas com o tipo de mídia de tela. E muitos telefones celulares e handhelds mais antigos não suportam CSS de forma alguma. No final das contas, esse método não é confiável e, portanto, raramente é usado para fornecer versões móveis de um site.
Use PHP, JSP, ASP para detectar o agente do usuário
Esta é uma maneira muito melhor de redirecionar usuários móveis para uma versão móvel do site porque não depende de uma linguagem de script ou CSS que o dispositivo móvel não usa. Em vez disso, ele usa uma linguagem do lado do servidor (PHP, ASP, JSP, ColdFusion, etc.) para examinar o agente do usuário e, em seguida, alterar a solicitação HTTP para apontar para uma página móvel se for um dispositivo móvel. Um código PHP simples para fazer isso teria a seguinte aparência: O problema aqui é que existem muitos e muitos outros agentes de usuário em potencial que são usados por dispositivos móveis. Este script irá capturar e redirecionar muitos deles, mas não todos de forma alguma. E mais são adicionados o tempo todo. Além disso, como com as outras soluções acima, você ainda terá que manter um site móvel separado para esses leitores! Essa desvantagem de ter que gerenciar dois (ou mais!) Sites é motivo suficiente para buscar uma solução melhor.
Use WURFL
Se você ainda está determinado a redirecionar seus usuários móveis para um site separado, o WURFL (Wireless Universal Resource File) é uma boa solução. Este é um arquivo XML (e agora um arquivo DB) e várias bibliotecas DBI que não apenas contêm dados atualizados do agente do usuário sem fio, mas também quais recursos e capacidades esses agentes do usuário suportam. Para usar o WURFL, você baixa o arquivo de configuração XML, escolhe o seu idioma e implementa a API no seu site. Existem ferramentas para usar WURFL com Java, PHP, Perl, Ruby, Python, Net, XSLT e C ++. A vantagem de usar o WURFL é que há muitas pessoas atualizando e adicionando ao arquivo de configuração o tempo todo. Portanto, embora o arquivo que você está usando esteja desatualizado quase antes de você terminar de baixá-lo, é provável que, se você baixá-lo uma vez por mês ou mais, terá todos os navegadores móveis que seus leitores usam habitualmente, sem nenhum problemas. A desvantagem, é claro, é que você tem que baixar e atualizar continuamente – tudo para direcionar os usuários a um segundo site e às desvantagens que isso cria.
A melhor solução é o design responsivo
Portanto, se manter sites diferentes para dispositivos diferentes não é a resposta, qual é? Web design responsivo. O design responsivo é onde você usa consultas de mídia CSS para definir estilos para dispositivos de várias larguras. O design responsivo permite que você crie uma página da Web para usuários móveis e não móveis. Então, você não precisa se preocupar com o conteúdo a ser exibido no site para celular ou lembre-se de transferir as alterações mais recentes para o seu site para celular. Além disso, depois de ter escrito o CSS, você não precisa baixar nada novo. O design responsivo pode não funcionar perfeitamente em dispositivos e navegadores extremamente antigos (a maioria dos quais são muito pouco usados hoje e não devem ser uma grande preocupação para você), mas porque é aditivo (adicionar estilos ao conteúdo, em vez de pegar conteúdo distância) esses leitores ainda serão capazes de ler seu site, mas não terá a aparência ideal em seus dispositivos ou navegadores antigos.