{"id":664,"date":"2019-04-09T07:41:17","date_gmt":"2019-04-09T07:41:17","guid":{"rendered":"https:\/\/owius.com\/?p=664"},"modified":"2019-10-26T22:41:45","modified_gmt":"2019-10-26T22:41:45","slug":"que-es-el-concepto-responsive-en-desarrollo-web","status":"publish","type":"post","link":"https:\/\/owius.com\/?p=664","title":{"rendered":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web?"},"content":{"rendered":"\n

Responsive. Esa palabra. \u00bfQu\u00e9 significa? Pues es el modo en que un desarrollo de p\u00e1gina web<\/a><\/strong> se adapta su contenido en funci\u00f3n de la pantalla del usuario.<\/p>\n\n\n\n

Antes, cuando empezaron a salir los dispositivos de m\u00f3vil avanzados con navegador, en sus inicios, todas las p\u00e1ginas web se desarrollaban para poder verse correctamente en sistemas desktop. Es decir, en pantallas de ordenador o port\u00e1til. Pero pronto, esa acci\u00f3n de \u00abpinch\u00bb (hacer pinza con los dedos para ampliar el contenido de la p\u00e1gina web) se vio que era algo absurdo y que era dif\u00edcil navegar por una p\u00e1gina web de forma \u00e1gil y correcta. As\u00ed que empez\u00f3 a salir el concepto de Responsive para que el desarrollo de p\u00e1ginas web<\/a><\/strong> tuviera en cuenta si el usuario estaba visitando la p\u00e1gina desde un ordenador o desde un dispositivo m\u00f3vil. El dise\u00f1o web<\/a> empezaba a ser muy importante.<\/p>\n\n\n\n

Bootstrap, el gran referente del desarrollo web responsive<\/h2>\n\n\n\n

Twitter fue uno de los impulsores de esta librer\u00eda de desarrollo web<\/a><\/strong>, Boostrap, que permite automatizar con cierta facilidad la adaptaci\u00f3n de las p\u00e1ginas web a los dispositivos m\u00f3viles. Donde tenemos 4 o 6 columnas de informaci\u00f3n, en el paso responsive usando Boostrap, podemos decidir que pase a ser una sola columna, con los elementos ordenados uno debajo del otro.<\/p>\n\n\n\n

\"\"
Desarrollo web responsive con Bootstrap<\/figcaption><\/figure><\/div>\n\n\n\n

Ya no es necesario hacer el pesado \u00abpinch\u00bb para ver la p\u00e1gina web, los desarrollos correctos de p\u00e1ginas web usando responsive con Bootstrap ya facilitan esa tarea enormemente.<\/p>\n\n\n\n

Mobile First, en desarrollo de p\u00e1gina web<\/h2>\n\n\n\n

Adem\u00e1s no solo eso. Cada vez m\u00e1s, tenemos a los usuarios que visitan nuestros desarrollo de web<\/a><\/strong> desde dispositivos m\u00f3viles, as\u00ed que la tendencia cada vez m\u00e1s l\u00f3gica es pensar en el dise\u00f1o de nuestra p\u00e1gina, no partiendo de desktop y luego haciendo el responsive, sino m\u00e1s bien lo contrario. Primero hacemos el desarrollo en formato m\u00f3vil y luego hacemos la adaptaci\u00f3n al sistema desktop.<\/p>\n\n\n\n

Esa es la evoluci\u00f3n l\u00f3gica del mundo actual. Cada vez m\u00e1s m\u00f3viles. Cada vez m\u00e1s conectados. Y todo desde la palma de nuestra mano.<\/p>\n","protected":false},"excerpt":{"rendered":"

Entiende que significa que una web sea responsive. Esto es, que pueda un solo desarrollo web, adaptarse autom\u00e1ticamente a pantallas de ordenador, tablet y m\u00f3viles sin recarga. El referente: Bootstrap desarrollado por Twitter.<\/p>\n","protected":false},"author":1,"featured_media":666,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,18],"tags":[61,56],"class_list":["post-664","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desarrollo-web-y-app","category-pagina-web","tag-boostrap","tag-desarrollo-web"],"yoast_head":"\n\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius<\/title>\n<meta name=\"description\" content=\"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius\" \/>\n<meta property=\"og:description\" content=\"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Owius\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Owius\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-04-09T07:41:17+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-10-26T22:41:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"josepmmr\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@owius_com\" \/>\n<meta name=\"twitter:site\" content=\"@owius_com\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"josepmmr\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\"},\"author\":{\"name\":\"josepmmr\",\"@id\":\"https:\/\/owius.com\/#\/schema\/person\/44f7850334dc103a26d58897b07ed1ec\"},\"headline\":\"\u00bfQu\u00e9 es el concepto responsive en desarrollo web?\",\"datePublished\":\"2019-04-09T07:41:17+00:00\",\"dateModified\":\"2019-10-26T22:41:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\"},\"wordCount\":383,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/owius.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg\",\"keywords\":[\"boostrap\",\"desarrollo web\"],\"articleSection\":[\"Desarrollo web y app\",\"desarrollo y dise\u00f1o web\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\",\"url\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\",\"name\":\"\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius\",\"isPartOf\":{\"@id\":\"https:\/\/owius.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg\",\"datePublished\":\"2019-04-09T07:41:17+00:00\",\"dateModified\":\"2019-10-26T22:41:45+00:00\",\"description\":\"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.\",\"breadcrumb\":{\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage\",\"url\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg\",\"contentUrl\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg\",\"width\":1200,\"height\":630,\"caption\":\"desarrollo web con boostrap responsive\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/owius.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u00bfQu\u00e9 es el concepto responsive en desarrollo web?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/owius.com\/#website\",\"url\":\"https:\/\/owius.com\/\",\"name\":\"Owius\",\"description\":\"Desarrollo apps en Barcelona\",\"publisher\":{\"@id\":\"https:\/\/owius.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/owius.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/owius.com\/#organization\",\"name\":\"Owius\",\"url\":\"https:\/\/owius.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/owius.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/02\/logobig.png\",\"contentUrl\":\"https:\/\/owius.com\/wp-content\/uploads\/2019\/02\/logobig.png\",\"width\":368,\"height\":88,\"caption\":\"Owius\"},\"image\":{\"@id\":\"https:\/\/owius.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Owius\/\",\"https:\/\/x.com\/owius_com\",\"https:\/\/www.instagram.com\/owius_com\/\",\"https:\/\/www.linkedin.com\/in\/jmmirabent\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/owius.com\/#\/schema\/person\/44f7850334dc103a26d58897b07ed1ec\",\"name\":\"josepmmr\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/owius.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6520700b0e04d5dca9a9823c60472e9d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6520700b0e04d5dca9a9823c60472e9d?s=96&d=mm&r=g\",\"caption\":\"josepmmr\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius","description":"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/","og_locale":"es_ES","og_type":"article","og_title":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius","og_description":"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.","og_url":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/","og_site_name":"Owius","article_publisher":"https:\/\/www.facebook.com\/Owius\/","article_published_time":"2019-04-09T07:41:17+00:00","article_modified_time":"2019-10-26T22:41:45+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg","type":"image\/jpeg"}],"author":"josepmmr","twitter_card":"summary_large_image","twitter_creator":"@owius_com","twitter_site":"@owius_com","twitter_misc":{"Escrito por":"josepmmr","Tiempo de lectura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#article","isPartOf":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/"},"author":{"name":"josepmmr","@id":"https:\/\/owius.com\/#\/schema\/person\/44f7850334dc103a26d58897b07ed1ec"},"headline":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web?","datePublished":"2019-04-09T07:41:17+00:00","dateModified":"2019-10-26T22:41:45+00:00","mainEntityOfPage":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/"},"wordCount":383,"commentCount":0,"publisher":{"@id":"https:\/\/owius.com\/#organization"},"image":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage"},"thumbnailUrl":"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg","keywords":["boostrap","desarrollo web"],"articleSection":["Desarrollo web y app","desarrollo y dise\u00f1o web"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/","url":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/","name":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web? Aprende f\u00e1cil - Owius","isPartOf":{"@id":"https:\/\/owius.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage"},"image":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage"},"thumbnailUrl":"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg","datePublished":"2019-04-09T07:41:17+00:00","dateModified":"2019-10-26T22:41:45+00:00","description":"Te ense\u00f1amos que es el web responsive o el desarrollo web responsiva. Aprende que Bootstrap de Twitter es el referente con su norma de las 12 columnas.","breadcrumb":{"@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#primaryimage","url":"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg","contentUrl":"https:\/\/owius.com\/wp-content\/uploads\/2019\/04\/bootstrap-social.jpg","width":1200,"height":630,"caption":"desarrollo web con boostrap responsive"},{"@type":"BreadcrumbList","@id":"https:\/\/owius.com\/que-es-el-concepto-responsive-en-desarrollo-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/owius.com\/"},{"@type":"ListItem","position":2,"name":"\u00bfQu\u00e9 es el concepto responsive en desarrollo web?"}]},{"@type":"WebSite","@id":"https:\/\/owius.com\/#website","url":"https:\/\/owius.com\/","name":"Owius","description":"Desarrollo apps en Barcelona","publisher":{"@id":"https:\/\/owius.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/owius.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/owius.com\/#organization","name":"Owius","url":"https:\/\/owius.com\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/owius.com\/#\/schema\/logo\/image\/","url":"https:\/\/owius.com\/wp-content\/uploads\/2019\/02\/logobig.png","contentUrl":"https:\/\/owius.com\/wp-content\/uploads\/2019\/02\/logobig.png","width":368,"height":88,"caption":"Owius"},"image":{"@id":"https:\/\/owius.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Owius\/","https:\/\/x.com\/owius_com","https:\/\/www.instagram.com\/owius_com\/","https:\/\/www.linkedin.com\/in\/jmmirabent\/"]},{"@type":"Person","@id":"https:\/\/owius.com\/#\/schema\/person\/44f7850334dc103a26d58897b07ed1ec","name":"josepmmr","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/owius.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6520700b0e04d5dca9a9823c60472e9d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6520700b0e04d5dca9a9823c60472e9d?s=96&d=mm&r=g","caption":"josepmmr"}}]}},"_links":{"self":[{"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/posts\/664","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/owius.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=664"}],"version-history":[{"count":0,"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/posts\/664\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/owius.com\/index.php?rest_route=\/wp\/v2\/media\/666"}],"wp:attachment":[{"href":"https:\/\/owius.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=664"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/owius.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=664"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/owius.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=664"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}