{"id":261581,"date":"2023-08-21T09:47:00","date_gmt":"2023-08-21T06:47:00","guid":{"rendered":"https:\/\/inform.click\/compatibilidade-com-dispositivos-moveis-e-velocidade-do-site-dois-itens-importantes-a-serem-considerados-ao-criar-um-site\/"},"modified":"2023-08-21T10:19:00","modified_gmt":"2023-08-21T07:19:00","slug":"compatibilidade-com-dispositivos-moveis-e-velocidade-do-site-dois-itens-importantes-a-serem-considerados-ao-criar-um-site","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/compatibilidade-com-dispositivos-moveis-e-velocidade-do-site-dois-itens-importantes-a-serem-considerados-ao-criar-um-site\/","title":{"rendered":"Compatibilidade com dispositivos m\u00f3veis e velocidade do site &#8211; dois itens importantes a serem considerados ao criar um site?"},"content":{"rendered":"<p>\n  No mundo atual da web 2.0, tudo gira em torno da Internet. Se voc\u00ea est\u00e1 procurando um encanador, v\u00e1 para a web. Se voc\u00ea est\u00e1 procurando um restaurante local, v\u00e1 para a web. Se voc\u00ea quer comprar uma casa, adivinhe? Voc\u00ea vai para a web.\n<\/p>\n<p>\n  As pessoas n\u00e3o est\u00e3o mais usando as p\u00e1ginas amarelas para encontrar um neg\u00f3cio para uma necessidade ou desejo. Eles est\u00e3o indo para a web, pois fornece as informa\u00e7\u00f5es mais precisas e r\u00e1pidas.\n<\/p>\n<p>\n  Cinco a sete anos atr\u00e1s, para obter essas informa\u00e7\u00f5es, uma pessoa acessava o desktop ou laptop de sua casa ou empresa, abria um navegador da Web e um mecanismo de pesquisa e fazia uma pesquisa.\n<\/p>\n<p>\n  Hoje, o cen\u00e1rio mudou completamente, pois as pessoas n\u00e3o est\u00e3o apenas acessando laptops e desktops para obter informa\u00e7\u00f5es \u2013 elas est\u00e3o usando dispositivos m\u00f3veis, incluindo smartphones e tablets.\n<\/p>\n<h5>\n  Seu site \u00e9 compat\u00edvel com dispositivos m\u00f3veis?<br \/>\n<\/h5>\n<p>\n  Isso significa que um site que parece \u00f3timo em um computador desktop ou laptop provavelmente n\u00e3o parece muito bom quando visualizado por meio de um dispositivo m\u00f3vel port\u00e1til. A copy \u00e9 bem pequena, os links s\u00e3o min\u00fasculos e voc\u00ea tem que rolar para o lado para ver todo o conte\u00fado. O site n\u00e3o s\u00f3 n\u00e3o \u00e9 f\u00e1cil de usar, mas agora tamb\u00e9m pode ter um impacto (um impacto muito importante &#8211; potencialmente extremamente negativo) com os mecanismos de pesquisa &#8211; especialmente o Google.\n<\/p>\n<p>\n  O que exatamente isso traduz tamb\u00e9m? Basicamente, se o seu site n\u00e3o for adapt\u00e1vel para um dispositivo m\u00f3vel, ele pode perder classifica\u00e7\u00f5es org\u00e2nicas nos mecanismos de pesquisa. Isso significa que, quando algu\u00e9m visita o Google em seu telefone ou tablet e faz uma pesquisa por um encanador, h\u00e1 uma boa chance de voc\u00ea n\u00e3o aparecer e, se o fizer, provavelmente n\u00e3o estar\u00e1 na primeira p\u00e1gina dos resultados.\n<\/p>\n<p>\n  Al\u00e9m disso, o Google agora est\u00e1 colocando um r\u00f3tulo &#8220;compat\u00edvel com dispositivos m\u00f3veis&#8221; em seus resultados de pesquisa para celular. Um website \u00e9 qualificado para esse r\u00f3tulo se atender aos seguintes crit\u00e9rios, conforme detectado pelo algoritmo do Google:\n<\/p>\n<ul>\n<li>Evite software que n\u00e3o seja comum em dispositivos m\u00f3veis, como o Adobe Flash.\n  <\/li>\n<li>Use tamanhos de texto leg\u00edveis sem zoom.\n  <\/li>\n<li>Os links s\u00e3o colocados distantes o suficiente para que o correto possa ser facilmente tocado para o usu\u00e1rio.\n  <\/li>\n<li>O conte\u00fado cabe na tela para que os usu\u00e1rios n\u00e3o precisem rolar horizontalmente para visualizar.\n  <\/li>\n<\/ul>\n<h5>\n  O teste de compatibilidade com dispositivos m\u00f3veis<br \/>\n<\/h5>\n<p>\n  Um webmaster ou propriet\u00e1rio de uma empresa pode verificar se seu site \u00e9 compat\u00edvel com dispositivos m\u00f3veis visitando a p\u00e1gina <a href=\"https:\/\/www.google.com\/webmasters\/tools\/mobile-friendly\/\" target=\"_blank\" rel=\"noopener\">de teste de compatibilidade com dispositivos m\u00f3veis do Google<\/a>. Se o site n\u00e3o passar no teste, o Google fornecer\u00e1 informa\u00e7\u00f5es e dicas sobre como tornar o site compat\u00edvel com dispositivos m\u00f3veis.\n<\/p>\n<p>\n  Muitos sistemas de gerenciamento de conte\u00fado (CMS), como WordPress, Drupal e Joomla, agora oferecem assist\u00eancia sobre como migrar seu site compat\u00edvel com desktop para um site adapt\u00e1vel e compat\u00edvel com dispositivos m\u00f3veis.\n<\/p>\n<p>\n  Antes de fazer isso, por\u00e9m, certifique-se de fazer backup de seu site atual e atualizar seu CMS atual para a vers\u00e3o mais recente. Em algumas situa\u00e7\u00f5es, uma atualiza\u00e7\u00e3o para a vers\u00e3o mais recente aplicar\u00e1 automaticamente as atualiza\u00e7\u00f5es de seguran\u00e7a necess\u00e1rias e tornar\u00e1 seu site compat\u00edvel com dispositivos m\u00f3veis. Se o processo n\u00e3o for acionado automaticamente, certifique-se de enviar a atualiza\u00e7\u00e3o manualmente para evitar viola\u00e7\u00f5es de seguran\u00e7a.\n<\/p>\n<p>\n  Se o CMS que voc\u00ea usa oferece temas personalizados, verifique se a vers\u00e3o escolhida \u00e9 compat\u00edvel com dispositivos m\u00f3veis. Se n\u00e3o, voc\u00ea pode ter que come\u00e7ar de novo.\n<\/p>\n<h5>\n  Qu\u00e3o r\u00e1pido seu site est\u00e1 carregando?<br \/>\n<\/h5>\n<p>\n  Al\u00e9m de tornar seu site compat\u00edvel com dispositivos m\u00f3veis, outro grande item a ser considerado ao projetar seu site \u00e9 a velocidade do site. Se um site demorar muito para carregar, \u00e9 bem prov\u00e1vel que o usu\u00e1rio saia e v\u00e1 para um que carregue mais r\u00e1pido. Na verdade, de acordo com in\u00fameras pesquisas e estudos, quase metade dos usu\u00e1rios da web espera que um site carregue em dois segundos ou menos. Essas mesmas pessoas abandonar\u00e3o um site que n\u00e3o seja carregado em tr\u00eas segundos. Para tornar as coisas ainda maiores, 79% dos compradores da web que t\u00eam problemas com o desempenho do site dizem que n\u00e3o voltar\u00e3o ao site para comprar novamente e cerca de 44% deles diriam a um amigo se tiveram uma experi\u00eancia ruim de compra online.\n<\/p>\n<p>\n  Al\u00e9m de perder clientes em potencial porque seu tempo de carregamento \u00e9 longo, um site lento tamb\u00e9m pode prejudicar sua classifica\u00e7\u00e3o no Google. Isso porque o Google indicou que a velocidade do site \u00e9 um dos sinais usados \u200b\u200bpor seu algoritmo para ranquear as p\u00e1ginas. Uma velocidade lenta da p\u00e1gina da Web tamb\u00e9m significa que o mecanismo de pesquisa pode rastrear menos p\u00e1ginas, o que pode significar menos p\u00e1ginas sendo indexadas pelo Google. Essencialmente, tudo isso significa que voc\u00ea est\u00e1 perdendo neg\u00f3cios se o carregamento do site for lento.\n<\/p>\n<h5>\n  Teste de insights de velocidade de p\u00e1gina do Google<br \/>\n<\/h5>\n<p>\n  Semelhante ao teste de compatibilidade com dispositivos m\u00f3veis, o Google oferece uma <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\" target=\"_blank\" rel=\"noopener\">ferramenta gratuita Page Speed \u200b\u200bInsights<\/a>. Essa ferramenta mede o desempenho de uma p\u00e1gina da Web para computadores e dispositivos m\u00f3veis.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f6fe8cd79.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f6fe8cd79.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Depois de copiar e colar o URL na ferramenta, aparecer\u00e1 uma pontua\u00e7\u00e3o entre zero e cem pontos. Quanto maior a pontua\u00e7\u00e3o, melhor \u00e9 o seu site para o algoritmo do Google e uma pontua\u00e7\u00e3o de 85 ou mais indica que a p\u00e1gina est\u00e1 tendo um bom desempenho.\n<\/p>\n<p>\n  Com o Page Speed \u200b\u200bInsights, voc\u00ea aprende como seu site pode melhorar em v\u00e1rios aspectos importantes, incluindo o tempo decorrido desde o momento em que um usu\u00e1rio solicita uma nova p\u00e1gina at\u00e9 o momento em que o conte\u00fado acima da dobra da nova p\u00e1gina \u00e9 renderizado pelo navegador. Ele tamb\u00e9m mede o tempo decorrido desde o momento em que um usu\u00e1rio solicita uma nova p\u00e1gina at\u00e9 o momento em que a p\u00e1gina \u00e9 totalmente renderizada pelo navegador.\n<\/p>\n<p>\n  Como a rede dos usu\u00e1rios pode afetar bastante essa velocidade, o Page Speed \u200b\u200bInsights considera apenas os aspectos independentes da rede do desempenho da p\u00e1gina. Isso inclui a configura\u00e7\u00e3o do servidor, a estrutura do HTML e o uso de recursos externos como imagens, CSS e JavaScript.\n<\/p>\n<p>\n  Por exemplo, otimizando seu c\u00f3digo (incluindo a remo\u00e7\u00e3o de espa\u00e7os, v\u00edrgulas e outros caracteres desnecess\u00e1rios), voc\u00ea pode <a href=\"https:\/\/inform.click\/pt-pt\/como-melhorar-a-velocidade-do-site-wordpress-8-dicas-simples-mas-eficazes\/\" title=\"aumentar drasticamente a velocidade da p\u00e1gina.\">aumentar drasticamente a velocidade da p\u00e1gina.<\/a> Remova tamb\u00e9m coment\u00e1rios de c\u00f3digo, formata\u00e7\u00e3o e c\u00f3digo n\u00e3o utilizado. O Google recomenda o uso do <a href=\"https:\/\/developer.yahoo.com\/yui\/compressor\/\" target=\"_blank\" rel=\"noopener\">YUI Compressor<\/a> para CSS e JavaScript.\n<\/p>\n<p>\n  A redu\u00e7\u00e3o de redirecionamentos tamb\u00e9m melhorar\u00e1 a velocidade do site. Isso ocorre porque cada vez que uma p\u00e1gina \u00e9 redirecionada para outra p\u00e1gina, o visitante enfrenta mais tempo esperando a conclus\u00e3o do ciclo de solicita\u00e7\u00e3o-resposta HTTP. Por exemplo, se seu padr\u00e3o de redirecionamento m\u00f3vel for semelhante a: &#8220;ABC.com -&gt; www.ABC.com -&gt; m.ABC.com -&gt; m.ABC.com\/home&#8221;, cada um desses dois redirecionamentos adicionais torna sua p\u00e1gina carrega mais devagar.\n<\/p>\n<p>\n  Os webmasters devem sempre aproveitar o cache do navegador. Isso inclui itens como imagens, folhas de estilo e outros. Isso ocorre para que um visitante que volte ao seu site n\u00e3o precise recarregar a p\u00e1gina inteira. Ao usar uma ferramenta como <a href=\"https:\/\/addons.mozilla.org\/en-US\/firefox\/addon\/YSlow\/\" target=\"_blank\" rel=\"noopener\">YSlow<\/a>, voc\u00ea pode ver se j\u00e1 tem uma data de expira\u00e7\u00e3o definida para seu cache. Uma vez descoberto, voc\u00ea pode definir um cabe\u00e7alho &#8220;expira&#8221; por quanto tempo deseja que essas informa\u00e7\u00f5es sejam armazenadas em cache. A menos que seu site mude com frequ\u00eancia, um ano \u00e9 um tempo razo\u00e1vel para defini-lo.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7009187a.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7009187a.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Sempre procure maneiras de melhorar o tempo de resposta do seu servidor. Para fazer isso, observe v\u00e1rios gargalos de desempenho, como consultas lentas ao banco de dados, roteamento lento ou falta de mem\u00f3ria adequada. Os tempos ideais de resposta do servidor devem ser inferiores a 200 milissegundos.\n<\/p>\n<h5>\n  As imagens tamb\u00e9m podem desempenhar um papel importante na velocidade do seu site.<br \/>\n<\/h5>\n<p>\n  PNGs s\u00e3o geralmente o melhor formato de arquivo para gr\u00e1ficos com menos de 16 cores. JPEGs s\u00e3o geralmente o formato ideal para fotos. Certifique-se de que eles tamb\u00e9m est\u00e3o compactados para a web e n\u00e3o \u00e9 necess\u00e1rio fazer upload de fotos de 200 e 300 DPI.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7028727e.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7028727e.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Uma dica que voc\u00ea pode tentar \u00e9 usar <a href=\"http:\/\/csssprites.com\/\" target=\"_blank\" rel=\"noopener\">sprites CSS<\/a> para criar um modelo para imagens que voc\u00ea usa com frequ\u00eancia, como \u00edcones, seu logotipo e outros bot\u00f5es comumente usados. Sprites CSS ir\u00e3o combinar suas imagens em uma imagem maior que carrega tudo de uma vez. Isso significa menos solicita\u00e7\u00f5es HTTP, o que equivale a economizar no tempo de carregamento ao n\u00e3o for\u00e7ar os usu\u00e1rios a aguardar o carregamento de v\u00e1rias imagens.\n<\/p>\n<p>\n  Por fim, outra op\u00e7\u00e3o para aumentar a velocidade de carregamento de seus sites \u00e9 utilizando uma rede de distribui\u00e7\u00e3o de conte\u00fado ou CDN. Essa rede de servidores \u00e9 usada para distribuir a carga de entrega de conte\u00fado. Basicamente, isso significa que as c\u00f3pias do seu site s\u00e3o armazenadas em v\u00e1rios centros de dados geograficamente diversos, para que os usu\u00e1rios tenham acesso mais r\u00e1pido e confi\u00e1vel ao site, onde quer que estejam fisicamente no mundo.\n<\/p>\n<p>\n  Embora a cria\u00e7\u00e3o de um \u00f3timo site possa ser empolgante e gratificante, voc\u00ea deve garantir que ele seja otimizado adequadamente. Isso inclui garantir que ele seja compat\u00edvel com dispositivos m\u00f3veis e compat\u00edvel com a velocidade do site. Caso contr\u00e1rio, h\u00e1 uma grande possibilidade de voc\u00ea perder neg\u00f3cios novos e repetidos.\n<\/p>\n<\/p>\n<div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\n  Fonte de grava\u00e7\u00e3o: <a target=\"_blank\" rel=\"noopener nofollow\" data-pssr=\"\" href=\"http:\/\/www.instantshift.com\/2015\/09\/09\/mobile-friendly-site-speed\/\">instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>No mundo atual da web 2.0, tudo gira em torno da Internet. Se voc\u00ea est\u00e1 procurando um encanador, v\u00e1 para a web. Se voc\u00ea est\u00e1 procurando um restaurante local, v\u00e1 para a web. Se voc\u00ea quer comprar uma casa, adivinhe? Voc\u00ea vai para a web. As pessoas n\u00e3o est\u00e3o mais usando as p\u00e1ginas amarelas para encontrar um neg\u00f3cio para uma necessidade ou desejo. Eles est\u00e3o indo para a web, pois fornece as informa\u00e7\u00f5es mais precisas e r\u00e1pidas. Para obter essas informa\u00e7\u00f5es, cinco a sete anos atr\u00e1s, uma pessoa acessava a \u00e1rea de trabalho de sua casa ou empresa ou \u2026<\/p>\n","protected":false},"author":1,"featured_media":155657,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[202,150,124,59],"tags":[],"class_list":["post-261581","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-designer-de-web","category-dicas-e-truques-da-web","category-ferramentas-web","category-web-e-wordpress-2"],"_links":{"self":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261581","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/comments?post=261581"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261581\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media\/155657"}],"wp:attachment":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media?parent=261581"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/categories?post=261581"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/tags?post=261581"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}