{"id":4683,"date":"2021-07-13T18:03:47","date_gmt":"2021-07-13T21:03:47","guid":{"rendered":"https:\/\/herospark.com\/blog\/?p=4683"},"modified":"2025-04-22T16:04:12","modified_gmt":"2025-04-22T19:04:12","slug":"o-que-e-site-responsivo","status":"publish","type":"post","link":"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/","title":{"rendered":"O que \u00e9 site responsivo e como criar"},"content":{"rendered":"<p>Saber o que \u00e9 site responsivo \u00e9 fundamental para qualquer empreendedor. O conceito se refere a sites que podem ser acessados totalmente via celular, o que \u00e9 muito relevante, considerando que os smartphones s\u00e3o ferramentas indispens\u00e1veis hoje em dia.<\/p>\n<p><span style=\"font-weight: 400\">Por isso, todas as suas p\u00e1ginas precisam ser completamente acess\u00edveis em qualquer computador, smartphone ou tablet. <\/span><span style=\"font-weight: 400\">Os dispositivos n\u00e3o param de evoluir e, por isso, ter um site que n\u00e3o se adapta a todos os formatos pode trazer muitos preju\u00edzos.<\/span><\/p>\n<p>Neste texto, vamos explicar em detalhes o que \u00e9 site responsivo e dar algumas dicas para cria\u00e7\u00e3o!<\/p>\n<p>&nbsp;<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_45_2 counter-hierarchy ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\">O que voc&ecirc; ver&aacute;:<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"ez-toc-toggle-icon-1\"><label for=\"item-69d6b2a012ba9\" aria-label=\"Table of Content\"><span style=\"display: flex;align-items: center;width: 35px;height: 30px;justify-content: center;direction:ltr;\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/label><input style='display:none' type=\"checkbox\" id=\"item-69d6b2a012ba9\"><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#O_que_e_site_responsivo\" title=\"O que \u00e9 site responsivo?\">O que \u00e9 site responsivo?<\/a><ul class='ez-toc-list-level-3'><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Qual_a_diferenca_entre_site_responsivo_e_site_mobile\" title=\"Qual a diferen\u00e7a entre site responsivo e site mobile?\">Qual a diferen\u00e7a entre site responsivo e site mobile?<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Vantagens_de_ter_um_site_responsivo\" title=\"Vantagens de ter um site responsivo\">Vantagens de ter um site responsivo<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Como_criar_um_site_responsivo\" title=\"Como criar um site responsivo\">Como criar um site responsivo<\/a><ul class='ez-toc-list-level-3'><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Defina_quando_a_mudanca_sera_feita\" title=\"Defina quando a mudan\u00e7a ser\u00e1 feita\">Defina quando a mudan\u00e7a ser\u00e1 feita<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Analise_o_trafego_do_seu_site\" title=\"Analise o tr\u00e1fego do seu site\">Analise o tr\u00e1fego do seu site<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Analise_sites_da_concorrencia_e_de_outros_segmentos\" title=\"Analise sites da concorr\u00eancia e de outros segmentos\">Analise sites da concorr\u00eancia e de outros segmentos<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Nao_programe_sozinho\" title=\"N\u00e3o programe sozinho\">N\u00e3o programe sozinho<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/#Busque_ajuda_de_especialistas\" title=\"Busque ajuda de especialistas\">Busque ajuda de especialistas<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"O_que_e_site_responsivo\"><\/span><span style=\"font-weight: 400\">O que \u00e9 site responsivo?<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400\">Um site responsivo \u00e9 aquele projetado para se adaptar a qualquer tipo de resolu\u00e7\u00e3o, sem que fique distorcido ou que as informa\u00e7\u00f5es n\u00e3o se ajustem inteiramente na tela.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">Com esse tipo de design, o site identifica a largura de cada tela para, assim, ajustar o tamanho das imagens, das fontes e dos bot\u00f5es para criar a melhor experi\u00eancia para o usu\u00e1rio.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Quer um exemplo? Acesse o <\/span><a href=\"https:\/\/herospark.com\/?utm_term=herospark&amp;utm_campaign=HeroSpark_Google_Pesquisa_Signup_Branding&amp;utm_source=adwords&amp;utm_medium=ppc&amp;hsa_acc=3134494601&amp;hsa_cam=11776055681&amp;hsa_grp=111710236462&amp;hsa_ad=484297981197&amp;hsa_src=g&amp;hsa_tgt=kwd-1249914992872&amp;hsa_kw=herospark&amp;hsa_mt=e&amp;hsa_net=adwords&amp;hsa_ver=3&amp;gclid=Cj0KCQjwxJqHBhC4ARIsAChq4av6eNnm4JGi9u9H4fydTaejudu14GGJmBlv2giFSvhRCRxpqoE_HH8aAmnzEALw_wcB\"><span style=\"font-weight: 400\">site da HeroSpark<\/span><\/a><span style=\"font-weight: 400\"> do seu computador e, depois, acesse pelo seu smartphone. Voc\u00ea ver\u00e1 que a disposi\u00e7\u00e3o dos elementos na tela mudou, mas voc\u00ea consegue visualizar os conte\u00fados claramente, al\u00e9m de encontrar todos os comandos com facilidade.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Com um site responsivo, o usu\u00e1rio n\u00e3o precisa dar zoom para conseguir ler os textos e visualizar as imagens.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Qual_a_diferenca_entre_site_responsivo_e_site_mobile\"><\/span><span style=\"font-weight: 400\">Qual a diferen\u00e7a entre site responsivo e site mobile?<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Como citado anteriormente, um site responsivo \u00e9 projetado para se adaptar em qualquer tipo de tela.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">J\u00e1 um site mobile funciona como um segundo site, feito exclusivamente para ser aberto em determinado tipo de dispositivo, como um smartphone.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Em geral, o ideal \u00e9 optar pelo site responsivo, pois ele oferece uma s\u00e9rie de vantagens.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Vantagens_de_ter_um_site_responsivo\"><\/span><span style=\"font-weight: 400\">Vantagens de ter um site responsivo<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400\">Com um site responsivo, a experi\u00eancia do usu\u00e1rio \u00e9 infinitamente melhor. Se o site n\u00e3o se adapta \u00e0 tela, as chances de o usu\u00e1rio n\u00e3o encontrar o que procura \u00e9 muito maior, o que pode reduzir as chances de <a href=\"https:\/\/herospark.com\/blog\/taxa-de-conversao\/\">convers\u00e3o<\/a> do seu produto ou servi\u00e7o.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Outra vantagem \u00e9 que o Google prioriza os sites responsivos em seu <\/span><a href=\"https:\/\/herospark.com\/blog\/algoritmo-do-google\/\"><span style=\"font-weight: 400\">algoritmo de resultados de pesquisa<\/span><\/a><span style=\"font-weight: 400\">. Ou seja, \u00e9 essencial garantir que seu site se adapte a diferentes formatos para que voc\u00ea consiga obter bons resultados.<\/span><\/p>\n<p><span style=\"font-weight: 400\">O acesso via mobile est\u00e1 crescendo e a tend\u00eancia \u00e9 que cres\u00e7a cada vez mais. <\/span><a href=\"https:\/\/cetic.br\/media\/analises\/tic_domicilios_2019_coletiva_imprensa.pdf\"><span style=\"font-weight: 400\">Uma pesquisa do Comit\u00ea Gestor da Internet Brasil<\/span><\/a><span style=\"font-weight: 400\"> apontou que os smartphones s\u00e3o usados por 99% das pessoas conectadas no pa\u00eds, sendo que 58% delas acessam a internet apenas pelo celular.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">Isso mostra que, se o seu site n\u00e3o \u00e9 responsivo, voc\u00ea est\u00e1 oferecendo uma experi\u00eancia ruim para 58% dos internautas brasileiros. E voc\u00ea n\u00e3o quer isso, certo?<\/span><\/p>\n<p><span style=\"font-weight: 400\">Ainda falando sobre experi\u00eancia, se o seu site n\u00e3o for responsivo, a velocidade do carregamento da p\u00e1gina no smartphone \u00e9 extremamente reduzida. Um site responsivo \u00e9 mais leve e otimizado para dispositivos m\u00f3veis, o que reduz a probabilidade de que seu usu\u00e1rio desista e feche o site antes mesmo de fazer o que buscava.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Entre muitas outras vantagens, o site responsivo \u00e9 adaptado para todos os tipos de tela \u2013 inclusive para aquelas que ainda nem existem. Ou seja, optando por esse formato, voc\u00ea j\u00e1 prepara seu site para performar bem em novos dispositivos que possam surgir no processo de evolu\u00e7\u00e3o da tecnologia.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Como_criar_um_site_responsivo\"><\/span><span style=\"font-weight: 400\">Como criar um site responsivo<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-weight: 400\">Criar um site do zero pode parecer algo invi\u00e1vel para muitas pessoas. Mas calma! Trouxemos algumas dicas para ajudar voc\u00ea nesse processo.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Defina_quando_a_mudanca_sera_feita\"><\/span>Defina quando a mudan\u00e7a ser\u00e1 feita<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Muitas vezes, queremos fazer mudan\u00e7as significativas em nosso neg\u00f3cio, mas acabamos deixando para depois, e \u201co depois\u201d nunca chega. Geralmente, isso acontece por medo de dar esse pr\u00f3ximo passo ou simplesmente por falta de conhecimento sobre como realiz\u00e1-lo.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Analise_o_trafego_do_seu_site\"><\/span><span style=\"font-weight: 400\">Analise o tr\u00e1fego do seu site<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Voc\u00ea analisa frequentemente os resultados do seu site? Conferir as estat\u00edsticas e o n\u00famero de pessoas que o acessam \u00e9 essencial para saber o quanto esse canal \u00e9 importante para o seu neg\u00f3cio.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Al\u00e9m disso, com essas informa\u00e7\u00f5es voc\u00ea poder\u00e1 comparar os n\u00fameros de acessos de antes e depois de introduzir um design responsivo ao seu site.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Analise_sites_da_concorrencia_e_de_outros_segmentos\"><\/span><span style=\"font-weight: 400\">Analise sites da concorr\u00eancia e de outros segmentos<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Voc\u00ea tem ideia de como ser\u00e1 o design do seu site ap\u00f3s essa mudan\u00e7a? <\/span><span style=\"font-weight: 400\">No momento de fazer essa transforma\u00e7\u00e3o, \u00e9 sempre v\u00e1lido dar uma olhada no site dos seus concorrentes e de outras grandes empresas que voc\u00ea admira.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Fa\u00e7a pesquisas no Google, acesse os sites em diferentes dispositivos e perceba quais s\u00e3o as diferen\u00e7as entre as experi\u00eancias web e mobile. Observe como as imagens e as fontes ficam distribu\u00eddas em cada um dos formatos.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">Primeiro, anote tudo o que voc\u00ea gostou e deseja introduzir em seu site. Depois, anote aquilo que voc\u00ea n\u00e3o gostou. Em seguida, anote as falhas do seu concorrente e, a partir disso, busque formas de oferecer uma experi\u00eancia muito melhor para o seu cliente em seu site.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Nao_programe_sozinho\"><\/span>N\u00e3o programe sozinho<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Se voc\u00ea n\u00e3o for um especialista na programa\u00e7\u00e3o de sites, uma alternativa \u00e9 investir nas ferramentas de design dispon\u00edveis na internet.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Com aten\u00e7\u00e3o e vontade de aprender, todo mundo pode criar um site ou desenvolver a pr\u00f3pria <\/span><span style=\"font-weight: 400\">landing page<\/span><span style=\"font-weight: 400\">.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Voc\u00ea pode criar a sua landing page responsiva gratuitamente, de forma f\u00e1cil e r\u00e1pida. A <\/span><a href=\"https:\/\/herospark.com\/sparkfunnels?utm_term=herospark&amp;utm_campaign=HeroSpark_Google_Pesquisa_Signup_Branding&amp;utm_source=adwords&amp;utm_medium=ppc&amp;hsa_acc=3134494601&amp;hsa_cam=11776055681&amp;hsa_grp=111710236462&amp;hsa_ad=484297981194&amp;hsa_src=g&amp;hsa_tgt=kwd-1249914992872&amp;hsa_kw=herospark&amp;hsa_mt=e&amp;hsa_net=adwords&amp;hsa_ver=3&amp;gclid=CjwKCAjw55-HBhAHEiwARMCszjxLkXIVjPD5G1ny_ftda1SQzhEpJkEJ7pDhhM0wGUMA5djHrJFuhxoCQrcQAvD_BwE\"><span style=\"font-weight: 400\">Herospark<\/span><\/a><span style=\"font-weight: 400\">\u00a0possibilita a cria\u00e7\u00e3o de landing pages de alt\u00edssima qualidade, para voc\u00ea <\/span><a href=\"https:\/\/herospark.com\/blog\/como-captar-leads\/\"><span style=\"font-weight: 400\">captar novos leads<\/span><\/a><span style=\"font-weight: 400\"> e divulgar seus <\/span><a href=\"https:\/\/herospark.com\/blog\/category\/infoprodutos\/curso-online\/\"><span style=\"font-weight: 400\">infoprodutos<\/span><\/a><span style=\"font-weight: 400\">, como <\/span><a href=\"https:\/\/herospark.com\/blog\/como-criar-um-curso-online-3\/\"><span style=\"font-weight: 400\">cursos<\/span><\/a><span style=\"font-weight: 400\">, <\/span><a href=\"https:\/\/herospark.com\/blog\/como-criar-um-ebook\/\"><span style=\"font-weight: 400\">e-books<\/span><\/a><span style=\"font-weight: 400\">, mentorias, entre outros.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Criando um novo <\/span><a href=\"https:\/\/herospark.com\/blog\/sparkfunnels-pro\/\"><span style=\"font-weight: 400\">funil de vendas<\/span><\/a><span style=\"font-weight: 400\"> na plataforma, sua landing page \u00e9 criada automaticamente. Voc\u00ea s\u00f3 precisa edit\u00e1-la para inserir:<\/span><\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li>Url;<\/li>\n<li>Logotipo;<\/li>\n<li>Headlines;<\/li>\n<li>Formul\u00e1rio;<\/li>\n<li>Capa do e-book;<\/li>\n<li>Informa\u00e7\u00f5es sobre o produto;<\/li>\n<li>Texto de apresenta\u00e7\u00e3o;<\/li>\n<li>CTA.<\/li>\n<\/ul>\n<p><span style=\"font-weight: 400\">Assista ao v\u00eddeo abaixo e confira um passo a passo completo sobre como criar a sua landing page gratuitamente:<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><iframe title=\"Como criar uma LANDING PAGE gr\u00e1tis? \ud83e\udd2f\ud83d\ude0d\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/FSYwm-dtvt8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<p>Existem outras ferramentas para quem n\u00e3o consegue programar &#8211; o WordPress \u00e9 uma das mais conhecidas e utilizadas.<\/p>\n<p>Sistema de Gerenciamento de Conte\u00fado (CMS) que foi criado para ajudar as pessoas na hora de come\u00e7ar seu pr\u00f3prio site. E utiliz\u00e1-lo n\u00e3o \u00e9 t\u00e3o dif\u00edcil quanto parece.<\/p>\n<p>Existem diversos tutoriais na internet que ajudam voc\u00ea a iniciar sua jornada na plataforma. Basta fazer uma simples pesquisa e colocar a m\u00e3o na massa.<\/p>\n<p>&nbsp;<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Busque_ajuda_de_especialistas\"><\/span><span style=\"font-weight: 400\">Busque ajuda de especialistas<\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-weight: 400\">Se mesmo tendo o apoio de plataformas online voc\u00ea ainda n\u00e3o se sentir preparado para criar o seu pr\u00f3prio site responsivo online, buscar especialistas no assunto \u00e9 a melhor escolha.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">E n\u00e3o h\u00e1 motivos para se sentir mal por isso.<\/span><\/p>\n<p><span style=\"font-weight: 400\">S\u00e3o os especialistas que ret\u00eam toda a informa\u00e7\u00e3o necess\u00e1ria para criar um site responsivo de alta qualidade, com um design que oferecer\u00e1 a melhor experi\u00eancia aos seus usu\u00e1rios, e que esteja de acordo com as suas expectativas.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Se o seu or\u00e7amento possibilitar, n\u00e3o hesite em buscar especialistas em design responsivo para realizar essa mudan\u00e7a ao seu lado.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Agora que voc\u00ea j\u00e1 sabe como criar o seu site responsivo, que tal conhecer mais sobre a <\/span><a href=\"https:\/\/herospark.com\/\"><span style=\"font-weight: 400\">HeroSpark<\/span><\/a><span style=\"font-weight: 400\">? Somos uma plataforma gratuita e 100% integrada em um \u00fanico ambiente, com tudo o que voc\u00ea precisa para criar um neg\u00f3cio digital lucrativo ou fazer a sua empresa crescer ainda mais no mundo digital.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"Saber o que &eacute; site responsivo &eacute; fundamental para qualquer empreendedor. O conceito se refere a sites que podem ser acessados totalmente via celular, o que &eacute; muito relevante, considerando&hellip;\n","protected":false},"author":63,"featured_media":4684,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"content-type":"","_uag_custom_page_level_css":"","footnotes":""},"categories":[23,2454],"tags":[3113,3221,3222,3223,3224,3225],"yst_prominent_words":[160,210,1841,1261,1092,1822],"class_list":{"0":"post-4683","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-funil-de-vendas","8":"category-landing-page","9":"tag-criar-paginas","10":"tag-o-que-e-site-responsivo","11":"tag-site-responsivo","12":"tag-smartphone","13":"tag-tablet","14":"tag-web-design"},"acf":[],"uagb_featured_image_src":{"full":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo.jpeg",1200,628,false],"thumbnail":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-150x150.jpeg",150,150,true],"medium":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-300x157.jpeg",300,157,true],"medium_large":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-768x402.jpeg",768,402,true],"large":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-1024x536.jpeg",1024,536,true],"1536x1536":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo.jpeg",1200,628,false],"2048x2048":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo.jpeg",1200,628,false],"pk-small":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-80x80.jpeg",80,80,true],"pk-thumbnail":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-300x225.jpeg",300,225,true],"cs-small":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-80x80.jpeg",80,80,true],"cs-intermediate":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-240x180.jpeg",240,180,true],"cs-thumbnail":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-390x290.jpeg",390,290,true],"cs-thumbnail-uncropped":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-390x204.jpeg",390,204,true],"cs-medium":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-820x429.jpeg",820,429,true],"cs-large":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-1180x618.jpeg",1180,618,true],"web-stories-poster-portrait":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-640x628.jpeg",640,628,true],"web-stories-publisher-logo":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-96x96.jpeg",96,96,true],"web-stories-thumbnail":["https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo-150x79.jpeg",150,79,true]},"uagb_author_info":{"display_name":"Nilson Filatieri","author_link":"https:\/\/herospark.com\/blog\/author\/nilson\/"},"uagb_comment_info":0,"uagb_excerpt":"Saber o que &eacute; site responsivo &eacute; fundamental para qualquer empreendedor. O conceito se refere a sites que podem ser acessados totalmente via celular, o que &eacute; muito relevante, considerando&hellip;","yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v14.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>O que \u00e9 site responsivo e como criar | HeroSpark Blog<\/title>\n<meta name=\"description\" content=\"Sites responsivos s\u00e3o aqueles que abrem em qualquer dispositivo. Entenda o conceito na pr\u00e1tica e conhe\u00e7a detalhes sobre o que \u00e9 site responsivo de qualidade\" \/>\n<meta name=\"robots\" content=\"index, follow\" \/>\n<meta name=\"googlebot\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta name=\"bingbot\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"O que \u00e9 site responsivo e como criar | HeroSpark Blog\" \/>\n<meta property=\"og:description\" content=\"Sites responsivos s\u00e3o aqueles que abrem em qualquer dispositivo. Entenda o conceito na pr\u00e1tica e conhe\u00e7a detalhes sobre o que \u00e9 site responsivo de qualidade\" \/>\n<meta property=\"og:url\" content=\"https:\/\/herospark.com\/blog\/o-que-e-site-responsivo\/\" \/>\n<meta property=\"og:site_name\" content=\"HeroSpark Blog\" \/>\n<meta property=\"article:published_time\" content=\"2021-07-13T21:03:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-22T19:04:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/herospark.com\/blog\/wp-content\/uploads\/sites\/6\/2021\/07\/o-que-e-site-responsivo.jpeg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","amp_enabled":true,"_links":{"self":[{"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/posts\/4683","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/users\/63"}],"replies":[{"embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/comments?post=4683"}],"version-history":[{"count":0,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/posts\/4683\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/media\/4684"}],"wp:attachment":[{"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/media?parent=4683"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/categories?post=4683"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/tags?post=4683"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/herospark.com\/blog\/wp-json\/wp\/v2\/yst_prominent_words?post=4683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}