{"id":48,"date":"2021-12-16T12:18:21","date_gmt":"2021-12-16T12:18:21","guid":{"rendered":"https:\/\/www.viavelsim.com.br\/blog\/?p=48"},"modified":"2021-12-16T12:18:21","modified_gmt":"2021-12-16T12:18:21","slug":"design-responsivo","status":"publish","type":"post","link":"https:\/\/www.viavelsim.com.br\/blog\/2021\/12\/16\/design-responsivo\/","title":{"rendered":"Design Responsivo"},"content":{"rendered":"<p>Atualmente com v\u00e1rios meios para visualiza\u00e7\u00e3o de sites, o ideal \u00e9 fazer o layout de forma que o seu site fique corretamente adaptado nos diversos tamanhos de telas.<\/p>\n<p>Todos n\u00f3s sabemos o quanto \u00e9 chato ter que rolar a p\u00e1gina para ver uma imagem ou ler um texto. Imagine um v\u00eddeo ent\u00e3o? Ficaria imposs\u00edvel assisti-lo se as imagens n\u00e3o coubesse na tela de seu celular ou tablet.<\/p>\n<p>O design responsivo contribui para melhor experi\u00eancia do usu\u00e1rio, sendo desenvolvido para adapta\u00e7\u00e3o nas mais variadas telas.<\/p>\n<p>H\u00e1 extensa publica\u00e7\u00e3o sobre o assunto, segue na lista abaixo alguns links que sempre ajudam na hora do desenvolvimento:<\/p>\n<figure id=\"attachment_21\" aria-describedby=\"caption-attachment-21\" style=\"width: 750px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-large wp-image-21\" src=\"http:\/\/www.viavelsim.com.br\/blog\/wp-content\/uploads\/2021\/12\/design-responsivo-1024x768.jpg\" alt=\"\" width=\"750\" height=\"563\" srcset=\"https:\/\/www.viavelsim.com.br\/blog\/wp-content\/uploads\/2021\/12\/design-responsivo-1024x768.jpg 1024w, https:\/\/www.viavelsim.com.br\/blog\/wp-content\/uploads\/2021\/12\/design-responsivo-300x225.jpg 300w, https:\/\/www.viavelsim.com.br\/blog\/wp-content\/uploads\/2021\/12\/design-responsivo-768x576.jpg 768w, https:\/\/www.viavelsim.com.br\/blog\/wp-content\/uploads\/2021\/12\/design-responsivo.jpg 1160w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><figcaption id=\"caption-attachment-21\" class=\"wp-caption-text\">Design Responsivo<\/figcaption><\/figure>\n<p><a href=\"http:\/\/www.carloshps.com.br\/blog\/criar-um-site-responsivo-com-html5-e-css3-parte-3-de-3\/\" target=\"_blank\" rel=\"noopener\">Como Criar um Site Responsivo com HTML5 e CSS<\/a><\/p>\n<p><a href=\"http:\/\/arquiteturadeinformacao.com\/design-de-interacao\/guia-completo-sobre-grids-para-design-responsivo\/\" target=\"_blank\" rel=\"noopener\">Um Guia Completo sobre Grids para Design Responsivo<\/a><\/p>\n<p><a href=\"http:\/\/www.hongkiat.com\/blog\/rwd-tools\/\" target=\"_blank\" rel=\"noopener\">50 Useful Responsive Web Design Tools For Designers<\/a><\/p>\n<p><a href=\"http:\/\/www.tutorialti.com\/2014\/09\/site-responsivo.html\" target=\"_blank\" rel=\"noopener\">Site Responsivo<\/a><\/p>\n<p><a href=\"https:\/\/developers.google.com\/webmasters\/mobile-sites\/mobile-seo\/configurations\/responsive-design?hl=pt-br\" target=\"_blank\" rel=\"noopener\">Web Design Responsivo<\/a><\/p>\n<p><a href=\"https:\/\/drafts.csswg.org\/css-device-adapt\/#the-viewport\" target=\"_blank\" rel=\"noopener\">The Viewport<\/a><\/p>\n<p><a href=\"https:\/\/www.todoespacoonline.com\/w\/2014\/04\/imagens-para-layouts-responsivos-com-css\/\" target=\"_blank\" rel=\"noopener\">Ajustando Imagens Para Design Responsivo<\/a><\/p>\n<p><a href=\"https:\/\/www.udacity.com\/course\" target=\"_blank\" rel=\"noopener\">Udacity \u2013 Cursos<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Atualmente com v\u00e1rios meios para visualiza\u00e7\u00e3o de sites, o ideal \u00e9 fazer o layout de forma que o seu site fique corretamente adaptado nos diversos [&#8230;]<\/p>\n","protected":false},"author":1,"featured_media":49,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[15,14],"tags":[19,3,18,20],"class_list":["post-48","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desenvolvimento-web","category-design","tag-desenvolvimento-web","tag-design","tag-design-responsivo","tag-web-design"],"_links":{"self":[{"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/posts\/48","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/comments?post=48"}],"version-history":[{"count":1,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/posts\/48\/revisions"}],"predecessor-version":[{"id":50,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/posts\/48\/revisions\/50"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/media\/49"}],"wp:attachment":[{"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/media?parent=48"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/categories?post=48"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.viavelsim.com.br\/blog\/wp-json\/wp\/v2\/tags?post=48"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}