Dicas sobre como tornar seu blog mais compatível com dispositivos móveis
O Google anunciou recentemente que usará a atualização do algoritmo compatível com dispositivos móveis para verificar se todos os blogs são compatíveis com dispositivos móveis e penalizará aqueles que não forem. O que deixou muitos blogueiros se perguntando como tornar seus sites mais compatíveis com dispositivos móveis e como saber se seu blog é compatível com dispositivos móveis ou não. É por isso que reunimos as informações mais importantes sobre por que tornar seu blog mais compatível com dispositivos móveis é tão importante e como realmente fazer isso.
Hoje em dia, grande parte dos visitantes do blog está usando seus dispositivos móveis em vez de computadores para fazer isso. E como o Google prometeu aumentar a classificação dos sites adequados para visualização em dispositivos móveis, é mais importante do que nunca garantir que seu blog ou site seja compatível com dispositivos móveis.
Claro, não se trata apenas do que o Google deseja. Tornar seu blog compatível com dispositivos móveis também é do seu interesse e de seus leitores, porque, como muitas pessoas usam seus dispositivos móveis para navegar na Internet, isso tornará a leitura de seu blog mais conveniente para eles. De acordo com a pesquisa do Pew Internet Project, mais de um terço de todos os proprietários de telefones celulares usam o telefone mais do que o desktop ou laptop para acessar a Internet. Portanto, se você deseja que seu blog seja facilmente visualizado em qualquer smartphone, além de aumentar o número de leitores do seu blog, a compatibilidade com dispositivos móveis é algo em que você precisa pensar. E, na verdade, é mais fácil de alcançar do que se poderia pensar.
Teste de compatibilidade com dispositivos móveis
Como o Google criou esse algoritmo compatível com dispositivos móveis, eles também possibilitaram que todos testassem seus blogs e sites para essa métrica usando sua ferramenta de teste compatível com dispositivos móveis. Basta inserir a URL do seu blog na caixa "Inserir URL para testar", clicar em "Executar teste" e a ferramenta informará se o seu blog é compatível com dispositivos móveis ou não.
Se o seu site for compatível com dispositivos móveis, você pode relaxar um pouco, porque não precisa fazer nada. No entanto, se esta ferramenta do Google determinar que seu blog não é o mais fácil de ler em um dispositivo móvel, você precisará fazer algumas melhorias neste departamento o mais rápido possível.
Para quem usa um software de gerenciamento de conteúdo (CMS) para executar seu blog, como WordPress, Joomla!, Drupal, Blogger, Tumblr, Google Sites, Bitrix etc., a personalização não deve ser um problema, já que a maioria desses sistemas de software oferecem ferramentas que tornarão seu site compatível com dispositivos móveis automaticamente. Mas, se você optou pela raiz mais antiga de não usar nenhum software CMS para fazer seu site, ou se você usou CMS, mas seu site ainda não está de acordo com os padrões móveis, aqui estão algumas dicas sobre como melhorar compatibilidade com dispositivos móveis do seu site.
1 Atualize o CMS para a versão mais recente e use temas móveis
Se você usa CMS, tudo o que precisa fazer é atualizar seu software ou alterar o tema que está usando em seu blog. A maioria dos CMSs já fornece todas as ferramentas para tornar seu site compatível com dispositivos móveis, mas você deve certificar-se de que seu CMS esteja atualizado para a versão mais recente. Por exemplo, o Joomla vem com suporte móvel, apenas quando é atualizado para a versão mais recente do software. Outros softwares, no entanto, podem exigir que você altere o tema do seu site para torná-lo compatível com dispositivos móveis, pois alguns temas mais antigos simplesmente não ficam bem em dispositivos móveis, portanto, também não são adequados para eles. Para fazer isso, vá para o painel administrativo do seu CMS, encontre a guia de temas no seu painel e altere o tema do seu blog para um que seja responsivo e compatível com dispositivos móveis. Por exemplo, o WordPress oferece centenas de temas diferentes, e uma grande parte deles é gratuita e responsiva. Infelizmente, se você estiver usando um CMS, que não oferece suporte móvel, mais melhorias serão necessárias e pode ser mais inteligente apenas trocar seu software de gerenciamento de conteúdo.
2 Use subtítulos
Uma regra prática quando se trata de conteúdo de blog conveniente para usuários móveis é deixá-los absorver o texto em parágrafos menores, em vez de ter seu artigo em um texto longo. Portanto, o texto do seu blog post deve ser bem estruturado, para que o leitor possa se orientar facilmente no texto. Isso pode ser feito facilmente usando subtítulos. Ao usar subtítulos, o texto é automaticamente dividido em vários subcapítulos e há menor chance de o leitor se perder durante a leitura do artigo. E como perder o lugar ao ler algo em seu smartphone é um problema bastante comum para muitos usuários de dispositivos móveis, porque a rolagem móvel dificulta a leitura de textos longos e monótonos, resolva isso usando cabeçalhos.
Os cabeçalhos podem ser facilmente inseridos usando tags de cabeçalho. A tag para o título maior e mais importante é
, que é um título quase imperceptível, mas ainda ajudará você a dividir seu conteúdo e torná-lo mais fácil de ler.
3 Escolha o tamanho apropriado para as imagens
Os blogueiros geralmente escolhem o tamanho das imagens que vão usar em seus posts de acordo com o tamanho normal da tela do computador, mas quando os posts do blog estão sendo visualizados em telas menores, como a de um celular, as imagens geralmente acabam todas sendo do mesmo tamanho. Isso significa que os usuários de dispositivos móveis não veem as imagens na proporção adequada. Portanto, crie suas fotos de modo que elas não sejam apenas menores em dimensões, geralmente imagens abaixo de 1500 por 2500 pixels são melhores, mas também menores em tamanho – abaixo de 500 KB é recomendado. Além de ter fotos compatíveis com dispositivos móveis, reduzir o tamanho dos arquivos de suas imagens também permitirá que os usuários carreguem as páginas mais rapidamente, pois imagens menores usam menos dados para carregar.
Para tornar suas fotos menores em tamanho e dimensões de arquivo, use qualquer editor de fotos que você tenha em mãos, porque você não precisa do Photoshop para fazer isso. Recomendamos usar JPEGmini ou Pixlr, pois com esses editores de fotos você pode reduzir o tamanho de suas imagens sem comprometer sua qualidade.
4 Use design responsivo
O design responsivo para um blog ou site oferece a chance de visualizá-lo em várias plataformas e dispositivos diferentes com diferentes tamanhos de tela de maneira mais conveniente, pois adapta automaticamente seu site à largura da janela do navegador. E, para garantir uma leitura conveniente aos visitantes do blog, durante essa adaptação geralmente o design do blog muda, por exemplo, as imagens encolhem, as colunas se alinham verticalmente e o menu também muda. Mas se essas mudanças não acontecerem por conta própria, existem ferramentas que você pode usar para fazer isso sozinho.
Por exemplo, Foundation 3, Skeleton e Bootstrap. Essas estruturas ajustarão automaticamente seu blog, tornando-o fácil de ler em qualquer dispositivo. Para usá-los é muito mais fácil do que codificar todas as combinações possíveis sozinho. É claro que você também pode fazer isso usando as novas unidades de comprimento relativo do CSS3, como largura da viewport (vw), altura da viewport (vh), altura e largura mínimas da viewport (vmin) e altura e largura máximas da viewport (vmax). No entanto, a codificação requer habilidade, bem como tempo, e se você não for um programador experiente, sugiro ir com a primeira opção.
5 Use designs simples
Os usuários móveis preferem designs de site simples, porque sites grandes e com design complicado tornam-se lentos em um dispositivo móvel. Os designs simples também facilitam manter a atenção do leitor no conteúdo, em vez de distraí-los com um design sofisticado, porque, estatisticamente, a maioria dos usuários móveis tem períodos de atenção bastante curtos.
Isso significa tornar o layout do seu site simples e fácil de entender. Se você estiver usando um tema oferecido por seu provedor de serviços, basta alterá-lo para um mais simples. Por exemplo, o WordPress oferece muitos designs elegantes e simples que não sobrecarregam os dispositivos móveis, mas também ficam bem em um desktop. Mas se você criou seu site usando HTML, pode baixar um modelo simples, que fará com que seu site tenha uma ótima aparência e também seja compatível com dispositivos móveis. Por exemplo, o Envato Market oferece muitos designs simples diferentes para você escolher e usar em seu site.
6 Use fontes padrão
Fontes interessantes podem fazer um blog parecer mais criativo, mas essas fontes também podem ser um aborrecimento para os leitores móveis do blog, porque nem todos os dispositivos móveis suportam fontes de desktop sofisticadas. Portanto, para ver o conteúdo, os usuários de dispositivos móveis terão que baixar novas fontes para seus telefones, o que é um incômodo que não vale a pena para muitos. Além disso, mesmo que tenham todas as fontes pré-instaladas, algumas fontes mais criativas podem ser difíceis de ler em um smartphone, devido ao tamanho menor.
Portanto, escolha fontes tradicionais como Times New Roman, Verdana, Comic Sans MS, WildWest ou Bedrock. E também verifique a legibilidade da fonte que você decidir usar, para garantir que o texto não fique ilegível ao ser visualizado em uma tela menor de um smartphone. Uma regra geral é que qualquer texto em um site deve ter pelo menos 14 px, porque assim o texto será grande o suficiente para ser facilmente lido mesmo se você usar um dispositivo móvel com tela muito pequena.
7 Minimize o conteúdo por página
Quando uma página é carregada em qualquer dispositivo, seja um computador, tablet ou smartphone, o dispositivo baixa todo o conteúdo da página. Geralmente não causa problemas se você estiver usando um computador, mas grandes quantidades de dados podem sobrecarregar os dispositivos móveis. Para evitar isso, você deve minimizar a quantidade de conteúdo em cada página, pois isso garantirá que seu blog funcione em todos os dispositivos móveis.
Recomenda-se reduzir o conteúdo da sua página para menos de 5 MB por página. Você pode verificar facilmente o tamanho do conteúdo da sua página em qualquer navegador. Basta usar uma das muitas ferramentas de verificação de tamanho de página da Web disponíveis online. Se estiver acima de 5 MB, reduza o tamanho e a quantidade de texto, imagens e outros componentes da página manualmente ou use trechos do blog para facilitar a visualização do blog pelos visitantes.
8 Use vídeos do YouTube
Se você costuma postar muitos vídeos nos artigos do seu blog, lembre-se de que eles parecerão muito diferentes em um dispositivo móvel e em um computador. Além do mais, alguns dispositivos móveis nem mesmo suportam determinados formatos de vídeo, portanto, para evitar a chance de o usuário não conseguir reproduzir o vídeo em seu site, use o YouTube incorporado. O código de incorporação que o YouTube fornece para cada um de seus vídeos já é responsivo, o que significa que você poderá visualizar o vídeo em praticamente qualquer dispositivo e não precisará mais se preocupar com tamanhos e formatos de vídeo.
Você pode obter o código de incorporação para um vídeo do YouTube clicando no botão “Compartilhar", localizado abaixo do botão “Inscrever-se”, depois clique na guia “Incorporar” e copie o código fornecido em seu site. E você tem um vídeo de tamanho perfeito em sua postagem, sem precisar convertê-lo ou ajustá-lo.
Muitas vezes, os links em um site são muito pequenos para um usuário móvel tocar com facilidade e precisão com o dedo. E pode ser realmente irritante para um leitor de blog, quando eles não conseguem tocar com precisão no conteúdo que desejam visualizar. É por isso que você deve substituir todos os links em seu site por botões com tamanho mínimo de 44 x 44 pixels.
Se você estiver usando um CMS como o WordPress, basta usar plugins para criar esses botões. Vá para o painel de controle do seu CMS, encontre um plug-in apropriado, instale-o e siga as instruções para usá-lo corretamente. Mas se você mesmo codificou o site, pode usar um desses geradores de botão de link gratuitos, o que economizará o tempo que você usaria ao codificar os botões.
10 Continue testando
Por fim, quando você tiver feito todas as melhorias e achar que seu blog é o mais compatível com dispositivos móveis possível, teste seu blog novamente com a ferramenta de teste do Google ou alguma outra ferramenta de teste de compatibilidade com dispositivos móveis que você pode encontrar na Internet. Se agora está tudo bem e a ferramenta garante que seu blog não será penalizado por não ser compatível com dispositivos móveis, você pode relaxar e continuar a expandir seu site criando um ótimo conteúdo. Mas, só para ter certeza, sugiro que você teste seu site em vários dispositivos diferentes.
Peça a amigos ou familiares para ver seu blog em seus telefones e tablets. Teste seu site a partir de um dispositivo Android e IOS, bem como dispositivos que podem ter um sistema operacional completamente diferente. E percorra todas as páginas principais do seu blog nesses dispositivos. Somente testando a compatibilidade com dispositivos móveis do seu blog na vida real, você pode ter certeza de que seu site é realmente fácil de visualizar e ler em todos os gadgets.
A compatibilidade com dispositivos móveis não se trata apenas de ter um bom design de site, mas também de melhorar a experiência do usuário em seu site. É por isso que, quando você torna seu blog mais compatível com dispositivos móveis, mais pessoas estarão dispostas a voltar ao seu site, porque será fácil de visualizar e entender. E como a quantidade de pessoas que usam seus telefones celulares como dispositivos primários para navegar na web só aumenta a cada ano que vem, é de seu interesse garantir que seu site seja amigável para esses usuários de smartphones e exiba o conteúdo para de forma conveniente e fácil de ler.