Dicas sobre como tornar seu blog mais amigável para dispositivos móveis

O Google anunciou recentemente que usará a atualização do algoritmo amigável para 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 até mesmo 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 fazê-lo.

Hoje em dia, uma 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 as classificações dos sites adequados para visualização em dispositivos móveis, é mais importante do que nunca garantir que seu blog ou site seja amigável para dispositivos móveis.

Claro, não se trata apenas do que o Google quer. 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 do 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 mais o telefone 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 que você precisa pensar. E na verdade é mais fácil conseguir do que se imagina.

Teste de compatibilidade com dispositivos móveis

À medida que o Google criou esse algoritmo amigável para dispositivos móveis, eles também possibilitaram que todos testassem seus blogs e sites para essa métrica usando sua ferramenta de teste amigável para dispositivos móveis. Basta digitar a URL do seu blog na caixa “ Inserir URL para testar ”, clicar em “ Executar teste ” e a ferramenta informará se 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 nesse 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, pois a maioria desses sistemas de software oferecer ferramentas, que tornarão automaticamente seu site compatível com dispositivos móveis. Mas, se você foi a raiz mais antiga de não usar nenhum software CMS para criar 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 a 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 para 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, já que 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á ao painel administrativo do seu CMS, encontre a aba de temas no seu painel e mude 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 grande parte deles é gratuito e responsivo. 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 simplesmente trocar seu software de gerenciamento de conteúdo.

2. Use subtítulos

Uma regra prática quando se trata de conteúdo de blog que é 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 deve ser bem estruturado, para que o leitor possa se orientar no texto facilmente. 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 perder o lugar, enquanto lê o 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-o usando títulos.

Os títulos podem ser facilmente inseridos usando tags de título. A tag para o maior e mais importante título é <h1>. Esta tag é mais comumente usada para o título do texto. Outros títulos têm uma hierarquia de cima para baixo de <h1> a <h6>, que é um título quase imperceptível, mas ainda ajudará você a dividir seu conteúdo e facilitar a leitura.

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 terminam ficando do mesmo tamanho. Isso significa que os usuários de dispositivos móveis não veem as imagens na proporção adequada. Portanto, faça suas fotos para que elas não sejam apenas menores em dimensões, geralmente fotos 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, diminuir o tamanho dos arquivos de suas imagens também permitirá que os usuários carreguem as páginas mais rapidamente, já que fotos menores usam menos dados para carregar.

Para diminuir o tamanho e as dimensões das suas fotos, 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 um 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 mais convenientes, pois adapta automaticamente seu site à largura da janela do navegador. E, para garantir uma leitura conveniente para os 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 sozinhas, existem ferramentas que você pode usar para fazer isso sozinho.

Por exemplo, Foundation 3 , Skeleton e Bootstrap . Essas estruturas ajustarão automaticamente seu blog, para que seja 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 janela de visualização (vw), altura da janela de visualização (vh), altura e largura mínima da janela de visualização (vmin) e máxima da altura e largura da janela de visualização (vmax). No entanto, a codificação requer habilidade e tempo, e se você não for um programador experiente, sugiro seguir a primeira opção.

5. Use designs simples

Os usuários de dispositivos móveis preferem designs de site simples, porque sites de design grandes e complicados ficam 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 de dispositivos 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 que seu provedor de serviços oferece, 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 tiver feito seu site usando HTML, você 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 sofisticadas para desktop. Então, 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, por causa do 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 quando visualizado em uma tela menor de um smartphone. Uma regra geral é que qualquer texto em um site deve ter pelo menos 14 px, porque dessa forma o texto será grande o suficiente para ser facilmente legível, 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, que estão 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 seu 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 do que em um computador. Além disso, alguns dispositivos móveis nem suportam determinados formatos de vídeo, portanto, para evitar que o usuário não consiga 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 de um vídeo do YouTube clicando no botão “Compartilhar”, localizado abaixo do botão “ Assinar ”, 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 de outra forma.

9. Substitua links por botões e menus tocáveis

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 ele não pode tocar com precisão no conteúdo, ele deseja visualizar. É por isso que você deve substituir todos os links do seu site por botões que tenham pelo menos 44 pixels por 44 pixels de tamanho.

Se você estiver usando um CMS como o WordPress, basta usar plugins para criar esses botões. Vá para o painel de controle do 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ões 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 amigável possível para dispositivos móveis, 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 estiver tudo bem e a ferramenta garantir que seu blog não será penalizado, porque não é 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 que vejam seu blog em seus telefones e tablets. Teste seu site em um dispositivo Android e IOS, bem como em dispositivos que possam ter um sistema operacional completamente diferente. E passe por 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 é apenas ter um bom design do site, mas também melhorar a experiência do usuário em seu site. É por isso que, quando você torna seu blog mais amigável para 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 principais para navegar na Web aumenta a cada ano, é apenas 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.