{"id":8996,"date":"2019-07-04T07:27:31","date_gmt":"2019-07-04T10:27:31","guid":{"rendered":"https:\/\/novo.siteup.dev\/?p=8996"},"modified":"2019-07-04T07:27:31","modified_gmt":"2019-07-04T10:27:31","slug":"mobile-first","status":"publish","type":"post","link":"https:\/\/novo.siteup.dev\/en\/mobile-first\/","title":{"rendered":"Mobile First: O que \u00e9, vantagens e porque aderir a esse conceito?"},"content":{"rendered":"<p>Resumo: Mobile First \u00e9 uma abordagem de design e desenvolvimento que prioriza a experi\u00eancia do usu\u00e1rio em dispositivos m\u00f3veis, como smartphones e tablets, antes de pensar na vers\u00e3o para desktop. Ao projetar com Mobile First, os designers consideram as restri\u00e7\u00f5es de espa\u00e7o e as capacidades dos dispositivos m\u00f3veis, otimizando a navega\u00e7\u00e3o, o tempo de carregamento e a legibilidade do conte\u00fado. Essa abordagem \u00e9 importante devido ao aumento no uso de dispositivos m\u00f3veis para acessar a internet e ajuda a garantir uma experi\u00eancia agrad\u00e1vel e funcional para os usu\u00e1rios em telas menores.<\/p>\n<p>Bom, no final de 2016, o Google anunciou o lan\u00e7amento gradual e o teste de um novo algoritmo m\u00f3vel chamado <strong>Mobile First<\/strong>.<\/p>\n<p>Isso significa que o Google passou a colocar ainda mais foco nos dispositivos m\u00f3veis como uma \u201centidade aut\u00f4noma\u201d e come\u00e7ou a oferecer benef\u00edcios de classifica\u00e7\u00e3o para a<a href=\"https:\/\/novo.siteup.dev\/en\/responsividade\/criacao-site-responsivo\/\"> cria\u00e7\u00e3o de site responsivo<\/a>.<\/p>\n<p>Sendo assim, como a tend\u00eancia \u00e9 que tudo esteja sempre mudando e novas coisas surgindo, \u00e9 importante entender ao certo o que significa o MF e quais as informa\u00e7\u00f5es que o pr\u00f3prio Google forneceu a respeito desse algoritmo.<\/p>\n<p>Continue a leitura para entender melhor!<\/p>\n<p>[toc]<\/p>\n<h2 id=\"o-que-e-o-algoritmo-mobile-first\">O que \u00e9 o algoritmo Mobile First?<\/h2>\n<p>O primeiro par\u00e1grafo do blog Mobile First do Google afirma algo bastante interessante:<\/p>\n<blockquote><p>\u201cNossos sistemas de classifica\u00e7\u00e3o geralmente ainda analisam a vers\u00e3o desktop do conte\u00fado de uma p\u00e1gina para avaliar sua relev\u00e2ncia para o usu\u00e1rio. Isso pode causar problemas quando a p\u00e1gina para dispositivos m\u00f3veis tem menos conte\u00fado, porque nossos algoritmos n\u00e3o est\u00e3o avaliando a p\u00e1gina real que \u00e9 vista por um pesquisador m\u00f3vel. \u201d<\/p><\/blockquote>\n<p>Dessa forma, a <a href=\"https:\/\/novo.siteup.dev\/en\/seo-responsividade\/como-atualizacoes-google-podem-influenciar-seu-site\/\">atualiza\u00e7\u00e3o do Google<\/a> pode ser considerada uma camada adicional que o Google est\u00e1 usando para determinar a classifica\u00e7\u00e3o de conte\u00fados otimizados para dispositivos m\u00f3veis.<\/p>\n<p>No entanto, por enquanto o Mobile First ainda n\u00e3o \u00e9 o algoritmo de maior relev\u00e2ncia para o ranqueamento.<\/p>\n<p>Como o Google deixa claro, outras estrat\u00e9gias continuar\u00e3o sendo essenciais para um bom resultado nas pesquisas como, por exemplo, conte\u00fados de qualidade e relevantes.<\/p>\n<p>A longo prazo, no entanto, parece que o objetivo do Google \u00e9 tratar os resultados de pesquisa para dispositivos m\u00f3veis e computadores de maneira diferente.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16131\" title=\"mobile first\" src=\"https:\/\/novo.siteup.dev\/wp-content\/uploads\/2019\/07\/mobile-first.webp\" alt=\"mobile first\" width=\"1024\" height=\"682\" \/><\/p>\n<h2 id=\"implementando-a-atualizacao-mobile-first\">Implementando a atualiza\u00e7\u00e3o Mobile First<\/h2>\n<p>Em uma postagem, o Google afirmou que o lan\u00e7amento do Mobile First foi e continuar\u00e1 sendo feito em pequena escala por enquanto, at\u00e9 que a plataforma esteja confort\u00e1vel com a qualidade dos resultados:<\/p>\n<blockquote><p>Entendemos que esta \u00e9 uma mudan\u00e7a importante em nossa indexa\u00e7\u00e3o e \u00e9 algo que levamos a s\u00e9rio. Continuaremos a experimentar cuidadosamente nos pr\u00f3ximos meses, em pequena escala, e aumentaremos essa mudan\u00e7a quando tivermos certeza de que teremos uma \u00f3tima experi\u00eancia do usu\u00e1rio.<\/p><\/blockquote>\n<p>Sendo assim, a tend\u00eancia \u00e9 que o mobile first esteja cada vez mais presente, at\u00e9 realmente se tornar um algoritmo independente para dispositivos m\u00f3veis.<\/p>\n<p>Sendo assim, \u00e9 fundamental que os sites estejam preparados e se tornem responsivos o quanto antes.<\/p>\n<h2 id=\"nao-somos-compativeis-com-dispositivos-moveis-o-que-fazer\">N\u00e3o somos compat\u00edveis com dispositivos m\u00f3veis, o que fazer?<\/h2>\n<p>O uso da Internet em dispositivos m\u00f3veis continua a crescer, especialmente nos pa\u00edses em desenvolvimento, onde o uso de dispositivos port\u00e1teis geralmente supera o de desktops.<\/p>\n<p>Se voc\u00ea n\u00e3o est\u00e1 oferecendo uma vers\u00e3o m\u00f3vel do seu site para esses usu\u00e1rios, provavelmente est\u00e1 perdendo classifica\u00e7\u00f5es, <a href=\"https:\/\/novo.siteup.dev\/en\/marketing\/como-fazer-seu-site-engajar-leads\/\">engajamento de leads<\/a> e convers\u00f5es.<\/p>\n<p>Este n\u00e3o \u00e9 um problema que vai desaparecer t\u00e3o cedo, ent\u00e3o \u00e9 preciso ter foco e investir tempo a fim de resolv\u00ea-lo.<\/p>\n<p>As op\u00e7\u00f5es dispon\u00edveis para melhorar a experi\u00eancia do usu\u00e1rio para dispositivos m\u00f3veis s\u00e3o:<\/p>\n<h3 id=\"design-responsivo\">Design responsivo<\/h3>\n<p>\u00c9 quando voc\u00ea <a href=\"https:\/\/novo.siteup.dev\/en\/marketing\/tipos-de-site\/\">existe um \u00fanico site<\/a> onde o conte\u00fado \u00e9 redimensionado e ajustado com base no tamanho da tela do usu\u00e1rio.<\/p>\n<h3 id=\"website-de-veiculacao-dinamica\">Website de veicula\u00e7\u00e3o din\u00e2mica<\/h3>\n<p>Aqui \u00e9 quando existem dois sites; uma vers\u00e3o para desktop e uma vers\u00e3o separada para usu\u00e1rios m\u00f3veis.<\/p>\n<p>O Twitter \u00e9 um bom exemplo disso. Ele envia usu\u00e1rios de desktop para www.twitter.com e usu\u00e1rios m\u00f3veis para mobile.twitter.com.<\/p>\n<ul>\n<li><strong>Saiba tamb\u00e9m<\/strong> qual a <a href=\"https:\/\/novo.siteup.dev\/en\/criacao-de-site\/diferencas-desenvolvimento-site-mobile-site-responsivo\/\">diferen\u00e7a entre site mobile e site responsivo<\/a>!<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-16132\" title=\"mobile first\" src=\"https:\/\/novo.siteup.dev\/wp-content\/uploads\/2019\/07\/mobile-first-2.webp\" alt=\"mobile first\" width=\"1024\" height=\"682\" \/><\/p>\n<h2 id=\"eu-ja-sou-mobile-first-ficarei-bem\">Eu j\u00e1 sou mobile first, ficarei bem!<\/h2>\n<p>Talvez voc\u00ea tenha raz\u00e3o, mas recomendamos ainda verificar o seguinte aspecto para garantir que n\u00e3o ocorrer\u00e1 nenhum problema: a\u00a0usabilidade em dispositivos m\u00f3veis no Google Search Console.<\/p>\n<p>Mesmo que seu site j\u00e1 esteja respondendo bem aos dispositivos m\u00f3veis, o Google ainda pode estar encontrando problemas para seus usu\u00e1rios de celular.<\/p>\n<p>Os principais elementos do relat\u00f3rio de Usabilidade M\u00f3vel do Google Search Console s\u00e3o:<\/p>\n<ul>\n<li><strong>Porta de visualiza\u00e7\u00e3o n\u00e3o configurada<\/strong><\/li>\n<\/ul>\n<p>Como os visitantes de seu site usam diversos dispositivos com tamanhos variados de tela &#8211; de grandes monitores de desktop a tablets e pequenos smartphones &#8211; o relat\u00f3rio de Usabilidade M\u00f3vel do Google Search Console pode recomendar que as suas p\u00e1ginas devem especificar uma porta de visualiza\u00e7\u00e3o usando a tag \u201cmeta viewport\u201d.<\/p>\n<p>Essa tag informa aos navegadores como ajustar a dimens\u00e3o da p\u00e1gina para se adequarem ao dispositivo.<\/p>\n<ul>\n<li><strong>Janela de visualiza\u00e7\u00e3o de largura fixa<\/strong><\/li>\n<\/ul>\n<p>O relat\u00f3rio tamb\u00e9m poder\u00e1 recomendar algo relacionado a esta fun\u00e7\u00e3o.<\/p>\n<p>Alguns <a href=\"https:\/\/novo.siteup.dev\/en\/desenvolvimento-web\/web-designer\/\">desenvolvedores da Web<\/a> definem a janela de visualiza\u00e7\u00e3o como um tamanho de pixel fixo para ajustar uma p\u00e1gina n\u00e3o responsiva a fim de atender ao tamanho da tela de um celular comum.<\/p>\n<p>Para corrigir esse erro, adote um <a href=\"https:\/\/novo.siteup.dev\/en\/responsividade\/site-responsivo-o-que-e\/\">design responsivo para as p\u00e1ginas do seu site<\/a> e defina a porta de visualiza\u00e7\u00e3o para corresponder \u00e0 largura e \u00e0 escala dos dispositivos.<\/p>\n<p>Lembre-se de que, se voc\u00ea veicular dinamicamente uma vers\u00e3o para celular separada do seu site, precisar\u00e1 configurar a conta do Google Search Console para o dom\u00ednio ou subdom\u00ednio em que est\u00e1 hospedado a vers\u00e3o mobile. Isso com o objetivo de encontrar poss\u00edveis problemas.<\/p>\n<ul>\n<li><strong>Saiba aqui<\/strong> como <a href=\"https:\/\/novo.siteup.dev\/en\/seo-responsividade\/testar-responsividade-site\/\">testar a responsividade do seu site<\/a>!<\/li>\n<\/ul>\n<h3 id=\"verifique-o-tempo-de-carregamento-do-seu-site-para-celular\">Verifique o tempo de carregamento do seu site para celular<\/h3>\n<p>A velocidade do <a href=\"https:\/\/novo.siteup.dev\/en\/trafego-organico\/rankear-site-no-google\/\">site continua a ser um fator de classifica\u00e7\u00e3o para o Google:<\/a> quanto mais r\u00e1pido o seu site, melhores as possibilidades de classifica\u00e7\u00f5es fortes.<\/p>\n<p>Com os sinais m\u00f3veis ganhando mais destaque, \u00e9 importante que suas p\u00e1ginas sejam carregadas rapidamente em todos os dispositivos.<\/p>\n<p>Existem algumas ferramentas \u00fateis para testar a velocidade do celular, por\u00e9m recomendamos o <a href=\"https:\/\/gtmetrix.com\/\" target=\"_blank\" rel=\"noopener\">GT Metrix<\/a> como a melhor do mercado atualmente.<\/p>\n<h3 id=\"cross-over-de-conteudo\">Cross-over de conte\u00fado<\/h3>\n<p>Outro ponto de destaque na postagem do Google Mobile First \u00e9 a \u00eanfase colocada no conte\u00fado entre o que um usu\u00e1rio de desktop v\u00ea e o que um usu\u00e1rio de celular v\u00ea.<\/p>\n<p>Se voc\u00ea tem uma configura\u00e7\u00e3o de site em que o conte\u00fado principal \u00e9 diferente em dispositivos m\u00f3veis e computadores, considere a possibilidade de fazer algumas altera\u00e7\u00f5es em seu site.<\/p>\n<p>Uma revis\u00e3o para garantir que o conte\u00fado exclusivo de cada p\u00e1gina esteja dispon\u00edvel na vers\u00e3o responsiva ou m\u00f3vel de seu site ser\u00e1 ben\u00e9fica para o<a href=\"https:\/\/novo.siteup.dev\/en\/seo-responsividade\/como-otimizar-site-seo-2019\/\"> desempenho de SEO<\/a> no futuro.<\/p>\n<h2 id=\"conclusao-sobre-o-mobile-first\">Conclus\u00e3o sobre o mobile first<\/h2>\n<p>O uso de dispositivos m\u00f3veis para acessar a internet n\u00e3o mostra sinais de desacelera\u00e7\u00e3o, muito pelo contr\u00e1rio.<\/p>\n<p>Dessa forma, o Google continuar\u00e1 melhorando a experi\u00eancia de seus resultados de pesquisa para usu\u00e1rios m\u00f3veis, como aconteceu com a cria\u00e7\u00e3o do Mobile First. A boa not\u00edcia para todos, inclusive para voc\u00ea, \u00e9 que nunca \u00e9 tarde para se adaptar!<\/p>\n<p>Uma dica \u00e9 contratar uma<a href=\"http:\/\/localhost\/projetos\/site_upsites\/siteold\" target=\"_blank\" rel=\"noopener\"> ag\u00eancia de cria\u00e7\u00e3o de sites<\/a> para te ajudar a adaptar seu site da melhor forma para o mobile.<\/p>\n<p>Leia tamb\u00e9m: Qual a import\u00e2ncia de uma <a href=\"https:\/\/novo.siteup.dev\/en\/consultoria-seo\/\">consultoria SEO<\/a> para o seu site?<\/p>","protected":false},"excerpt":{"rendered":"<p>Resumo: Mobile First \u00e9 uma abordagem de design e desenvolvimento que prioriza a experi\u00eancia do usu\u00e1rio em dispositivos m\u00f3veis, como smartphones e tablets, antes de pensar na vers\u00e3o para desktop. Ao projetar com Mobile First, os designers consideram as restri\u00e7\u00f5es de espa\u00e7o e as capacidades dos dispositivos m\u00f3veis, otimizando a navega\u00e7\u00e3o, o tempo de carregamento [&hellip;]<\/p>","protected":false},"author":2,"featured_media":8999,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[16],"tags":[],"class_list":["post-8996","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desenvolvimento-web"],"acf":[],"_links":{"self":[{"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/posts\/8996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/comments?post=8996"}],"version-history":[{"count":0,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/posts\/8996\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/media\/8999"}],"wp:attachment":[{"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/media?parent=8996"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/categories?post=8996"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/novo.siteup.dev\/en\/wp-json\/wp\/v2\/tags?post=8996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}