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