O que é um site compatível com dispositivos móveis e como criá-lo

This post is also available in:

Mais de 58% do tráfego mundial da Internet provém de dispositivos móveis. Esta é uma das razões pelas quais os motores de busca têm vindo a deslocar o seu foco para a pesquisa móvel. Em particular, o Google está a dar muito mais atenção à indexação mobile-first. Relativamente a SEO, isto significa que o Google bots indexa a versão móvel do seu website em vez da versão desktop. Portanto, se o seu sítio Web não for amigo dos telemóveis, as suas hipóteses de classificação não são muito boas.

Se quiser melhores classificações, o seu sítio web precisa de ser amigo dos telemóveis para que seja adorado pelos rastejadores e utilizadores do Google.

Continue a ler para descobrir mais sobre o que é um sítio Web móvel e como se pode construir um.

O que é um Website Amigável para telemóveis?

Um sítio Web móvel amigável é concebido para funcionar da mesma forma em dispositivos de diferentes tamanhos, desde desktops a smartphones e tudo o que se encontra entre eles.

Isto significa que nenhum dos elementos do website é alterado ou inutilizável em dispositivos mais pequenos. No entanto, algumas características são limitadas (tais como menus pendentes de navegação) uma vez que podem ser difíceis de utilizar em telemóveis.

Além disso, a utilização de animação Flash é evitada para evitar preocupações de usabilidade em vários tamanhos de ecrã. Na sua maioria, os dispositivos móveis não suportam flash. Flash é obsoleto, mesmo em cima de desktops. Há muitas outras tecnologias compatíveis a utilizar em seu lugar, tais como o HTML. Se precisar de fazer algo mais complicado no telemóvel, é melhor usar uma aplicação.

Algumas das principais características dos sítios Web móveis amigáveis incluem:

• Navegação simplificada
• Conteúdo estático que não muda
• Imagens e textos mais pequenos (mas ainda assim fáceis de ver e ler sem esgaravatar)
• Botões e links que são exibidos mais pequenos mas que ainda são fáceis de tocar com um dedo
• Páginas que não dependem de um sistema operativo móvel para funcionar correctamente

Fonte

Há grandes benefícios em ter um website móvel-responsivo, incluindo um sinal de classificação positivo, melhor experiência do utilizador (UX), e a capacidade de proporcionar uma experiência simplificada em todos os dispositivos.

Lembre-se de que os sites compatíveis com dispositivos móveis são codificados para facilitar a interação em dispositivos móveis, o que difere do designresponsivo da Web. Um site reactivo muda ou “responde” com base no dispositivo utilizado para visualizar o site.

Por exemplo, algumas imagens podem estar escondidas, e o texto pode ser alterado de um esquema de três colunas para um esquema de uma coluna. Consequentemente, uma página móvel-responsiva pode parecer completamente diferente de uma página num ambiente de trabalho.

Exemplos do mundo real de sites amigos dos telemóveis

Com milhares de milhões de utilizadores a aceder diariamente à Internet através dos seus smartphones, as empresas estão a reconhecer a necessidade de sites amigos dos telemóveis, e há inúmeros designs de sites para se inspirar.

Aqui estão três dos meus exemplos favoritos de websites que as empresas optimizaram para dispositivos móveis.

Exemplo #1: Shutterfly.com

Shutterfly é uma plataforma online para criar álbuns fotográficos personalizados, impressões, cartões, e presentes personalizados. A maioria das pessoas tira e utiliza fotografias nos seus smartphones. É por isso que é necessário que um serviço como este tenha um sítio Web móvel amigável.

O Shutterfly faz isto excepcionalmente bem, graças ao foco da marca em criar uma experiência móvel excepcional para todos os seus clientes.

Em primeiro lugar, a navegação é uma brisa, tornando fácil aos utilizadores encontrar rapidamente a informação de que necessitam no sítio web. Além disso, a plataforma utiliza muitas imagens bonitas e optimizadas para atrair clientes para as suas ofertas.

Porque é que este Website funciona:

• Navegação fácil
• Botões grandes para itens de menu
• Utilização de fotografias grandes e bonitas para vender diferentes ofertas

Exemplo #2: Cheetos

Cheetos utiliza uma gama emocionante de imagens apelativas no seu website. Fazem-no de uma forma móvel e amigável que não sacrifica a velocidade e a experiência do utilizador do website.

O desenho completo facilita aos visitantes móveis a navegação instantânea através de selecções de imagens e vídeos que vendem produtos populares e mantêm os utilizadores envolvidos no website.

Porque é que este Website funciona:

• Menu de navegação simples
• Os cursores de imagem facilitam a navegação
• Utilização de uma grelha de imagem que se exibe maravilhosamente no telemóvel

Exemplo #3: Huffington Post

O Huffington Post é um conhecido meio noticioso que reporta todo o tipo de notícias, desde política e eventos actuais a tecnologia, entretenimento, e muito mais.

A publicação tem um website móvel único onde mudam ligeiramente algumas das manchetes para tornar o conteúdo mais digitalizável para os utilizadores móveis.

Na sua maioria, a sua versão móvel tem tipicamente menos palavras na página inicial em comparação com a versão desktop. Isto torna-o perfeito para ler ou folhear notícias em ecrãs mais pequenos.

Um menu simples e clicável lista também todas as categorias de correio para uma navegação fácil.

Porque é que este Website funciona:

• Menu clicável simples de usar
• Menos palavras na versão móvel do site
• Títulos facilmente digitalizáveis

Como criar um sítio Web móvel

Há muitos equívocos quando se trata de construir sites reactivos e móveis amigáveis.

Um dos principais erros que os principiantes cometem quando constroem sítios Web amigos dos telemóveis é trabalhar de forma isolada. É muito melhor obter inspiração daqueles que já o fizeram.

Os exemplos acima são um óptimo começo, mas também pode consultar outros websites na sua indústria ou nicho (particularmente concorrentes). É assim que obterá mais informações sobre os seus métodos, e as melhores práticas utilizadas para criar um sítio Web móvel amigável.

1. Usar o construtor do site certo

O primeiro passo na construção de um sítio web móvel de resposta é utilizar um construtor de sítios web apropriado. Escolha um que declare especificamente que é para a concepção de sítios a serem visualizados em dispositivos móveis. A maioria dos construtores de sítios modernos tem a experiência móvel no topo da mente.

Um construtor de websites facilitar-lhe-á a criação e o lançamento de um website que seja ao mesmo tempo de fácil utilização para o ambiente de trabalho e para os telemóveis. Há muitos construtores de sítios Web diferentes à escolha, incluindo plataformas como WordPress, Zyro, Wix, Squarespace, Weebly, Shopify e muitas outras.

A maioria oferece versões gratuitas, mas terá de actualizar para uma versão paga se quiser remover limitações e aceder a funcionalidades adicionais tais como o marketing por correio electrónico.

Por exemplo, ao utilizar um construtor de websites gratuito, será capaz de construir um website amigo do telemóvel mas num subdomínio, como o YourAwesomeWebsite.weebly.com, em vez de um domínio único: YourAwesomeWebsite.com.

Dependendo do seu nível de habilidade, você pode escolher um construtor de sites que permita criar um modelo de site para sites compatíveis com dispositivos móveis ou se aprofundar no processo de design e desenvolvimento da Web para usar HTML ou CSS e converter seu design de PSD para HTML.

HTML descreve a estrutura da sua página web, e CSS diz ao navegador como apresentar essa página, incluindo cores, fontes, e layouts. Também lhe permite adaptar a sua página web a diferentes tipos de dispositivos, tamanhos de ecrã, e sistemas operativos móveis.

Independentemente dos seus conhecimentos técnicos e perícia, é sempre melhor concentrar-se em designs simples ao construir sítios Web amigos dos telemóveis.

Os utilizadores móveis têm notoriamente pouca atenção, e a concentração na simplicidade tornará fácil manter a atenção dos seus utilizadores nos conteúdos que deseja que eles vejam, em vez de ter temas elaborados e complexos.

2. Testar o Website em dispositivos móveis

Uma vez construído o seu sítio, o passo seguinte é testá-lo em dispositivos móveis para garantir que tudo funciona da forma que deveria. Para além de verificar a facilidade de utilização do seu sítio Web móvel em múltiplos dispositivos, os testes de sítios Web móveis também oferecem as seguintes vantagens:

• Torna o Seu Site Facilmente Acessível: Os utilizadores podem aceder ao seu site através de qualquer browser em múltiplos dispositivos móveis.
• Torna o Seu Site Mais Visível: A realização de testes de sítios Web móveis também torna o seu sítio Web mais fácil de encontrar, uma vez que o Google dá prioridade aos sítios móveis em comparação com as aplicações desktop.
• Melhora a experiência do utilizador: Um sítio Web móvel melhora o aspecto e a sensação do sítio Web, o que permite um melhor UX.

Para testar o seu sítio Web amigo do telemóvel, pode utilizar uma ferramenta dedicada como o Teste Amigável do Google para telemóveis, que pode aceder aqui mesmo.

Esta ferramenta permite-lhe testar a facilidade com que os visitantes podem utilizar as páginas do seu sítio web em dispositivos móveis. Basta introduzir o URL de uma página, e poderá ver como pontua a sua página.

A ferramenta pode mostrar que o seu site precisa de muito trabalho, pelo que terá de dar prioridade à transformação do seu site num site amigo dos telemóveis para que possa melhorar a sua visibilidade nos motores de busca.

Se conseguir levantar os polegares, o seu website é móvel e não requer o mesmo nível de prioridade, mas pode sempre beneficiar da melhoria da experiência do utilizador da forma que puder. Cada pequena ajuda, e o que quer que faça ajudará a garantir que mais visitantes do seu website fiquem por perto para que possa impulsionar as suas conversões e fazer mais vendas.

Em alternativa, poderá escolher uma ferramenta de navegação gratuita como o Responsinator, que lhe permite redimensionar o seu sítio web para qualquer tamanho, para que possa ver exactamente o seu aspecto em diferentes ecrãs de dispositivos.

Finalmente, para além da facilidade de mobilidade, Darshan Somashekar, que gere a plataforma de jogos Solitaired, sugere a realização de um teste de velocidade de página no seu site móvel. “Embora seja importante ser compatível com telemóveis, o Google mede agora os sinais vitais da web. Medimos isto regularmente para os nossos jogos de solitário. Se a sua página não for carregada rápida e eficientemente, não só os utilizadores saltarão, como também terá impacto na sua classificação de pesquisa”.

3. Optimizar o tamanho da imagem

Outra coisa que pode fazer para garantir que o seu sítio web é amigo do telemóvel é dimensionar correctamente as imagens para optimizar a visualização do dispositivo móvel.

Ao lidar com pequenos ecrãs, o objectivo é utilizar imagens com o menor tamanho de ficheiro possível enquanto ainda parecem claras e nítidas no ecrã em que os leitores as vêem. Isto porque os dispositivos móveis têm uma largura de banda muito menor do que os desktops, o que pode causar tempos de carregamento mais longos se não os optimizarmos.

Se os seus utilizadores precisarem de descarregar um ficheiro JPEG de 1-MB apenas para ver uma imagem do tamanho de uma miniatura, provavelmente ficarão frustrados e saltarão do seu website. Não importa o quão agradável é o design do seu sítio web. Se não conseguir melhorar a experiência do utilizador reduzindo os tempos de carga, é provável que deixe o seu site para um dos seus concorrentes.

Portanto, certifique-se de que encolhe todos os tamanhos dos seus ficheiros de imagem para poder usar menos dos seus dados e ajudar a carregar as páginas mais rapidamente. Fazendo isto contribuirá para uma imagem positiva do seu sítio web móvel.

4. Anúncios de bloqueio de texto e pop-ups de vala

Outra forma de garantir que o seu sítio web é amigo do telemóvel é utilizar apenas anúncios de marketing móvel discretos e que não distraiam ou cubram o seu conteúdo móvel.

Ninguém gosta de anúncios em qualquer contexto, e quando os utilizadores tentam ler texto num pequeno ecrã, a última coisa de que precisam é de um popup a bloquear a sua visão da página. Em vez de demorarem algum tempo a tentar encontrar aquele pequeno “x” para minimizar o anúncio popup, os utilizadores provavelmente irão apenas clicar para encontrar um website com uma melhor experiência de utilizador.

Evite incomodar os seus utilizadores e crie uma experiência melhorada ao dirigir-se sem popups e anúncios que bloqueiam o conteúdo da sua página. Se não os puder remover totalmente, então pelo menos desactive-os para utilizadores móveis.

Alternativamente, pode configurá-lo para que os popups ou anúncios só apareçam quando os utilizadores tiverem rolado até ao fundo da página, em vez de os mostrar assim que as pessoas aterrarem na página.

Além disso, certifique-se de que o “X” para cancelar o popup ou anúncio é suficientemente grande para que os utilizadores o encontrem e seleccionem facilmente.

5. Fazer da velocidade do Website uma prioridade

Finalmente, verifique se os vídeos e outros conteúdos interactivos no seu sítio não estão a causar atrasos no sítio. Os utilizadores móveis não gostam de passar mais tempo do que o necessário à procura da informação de que necessitam no website, por isso é necessário certificar-se de que lhes fornece os resultados em segundos.

Hoje em dia, as pessoas exigem gratificação instantânea, e se não conseguirem o que precisam imediatamente (como quase à primeira vista), pode ter a certeza de que não vão esperar.

O seu website não deve demorar muito tempo a carregar completamente. Deve ser apresentável, e todos os elementos importantes devem ser acessíveis em apenas um ou dois pergaminhos para baixo. A não adesão a estes pontos de concepção resultará provavelmente na mudança dos utilizadores para outro website.

Conclusão

Espero que este artigo o tenha ajudado a compreender exactamente o que é um sítio Web móvel e os passos de que necessitava para construir um. Utilize esta informação para o ajudar a conceber um website que ficará tão bem no telemóvel como no ambiente de trabalho.

Este artigo respondeu a todas as suas perguntas sobre como construir um sítio Web móvel amigável? Partilhe a sua opinião abaixo!

---

POR LINHA:

Ron Stefanski é um empresário e professor de marketing de um website que tem uma paixão por ajudar as pessoas a criar e comercializar o seu próprio negócio online. Pode aprender mais com ele, visitando OneHourProfessor.com

Você também pode se conectar com ele no YouTube ou Linkedin .