{"id":318,"date":"2014-05-14T17:46:29","date_gmt":"2014-05-14T17:46:29","guid":{"rendered":"http:\/\/gmbbc.com\/global-marketing-blog\/?p=318"},"modified":"2020-06-11T20:11:27","modified_gmt":"2020-06-11T20:11:27","slug":"que-es-responsive-web-design-y-para-que-sirve","status":"publish","type":"post","link":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/","title":{"rendered":"Que es Responsive Web Design y para qu\u00e9 sirve."},"content":{"rendered":"

Que significa Responsive Web Design o (RWD)?<\/strong><\/p>\n

Significa Dise\u00f1o Web Sensible o Adaptativo.<\/p>\n

Que es el Responsive Web Design o (RWD)?<\/strong><\/p>\n

\"QueEl Responsive <\/strong>Web Design<\/strong> o (RWD) o Dise\u00f1o Web Sensible o Dise\u00f1o Web Adaptativo es la creaci\u00f3n de p\u00e1ginas web que pueden ser visualizadas perfectamente en todo tipo de dispositivos<\/strong>, desde ordenadores de escritorio hasta smartphones o tablets en pocas palabras una web que se adapte a cualquier dispositivo electr\u00f3nico.<\/p>\n

Para qu\u00e9 sirve el Responsive Web Design?<\/strong><\/p>\n

Si tienes o trabajas para una empresa que quiere competir en el creciente mundo del comercio online necesitas una estrategia integral que llegue a todas partes y que mejor lugar que llegar directamente a la mano de tus usuarios a trav\u00e9s del m\u00f3vil.<\/p>\n

Estar\u00e1s pensando en dise\u00f1ar aplicaciones nativas para m\u00f3viles, est\u00e1 claro que adem\u00e1s de estar de moda pueden ayudar a proporcionar una experiencia de usuario sin problemas, pero debemos tener en cuenta que hay productos y servicios en los que una aplicaci\u00f3n m\u00f3vil puede no ser la elecci\u00f3n correcta y es aqu\u00ed es donde otras soluciones vienen a ser las ideales.<\/p>\n

Una de esa soluci\u00f3n es el dise\u00f1o web adaptativo o Responsive Web Design que ofrece a los usuarios una experiencia web sin problemas en todos los dispositivos con diferentes tama\u00f1os de pantalla. El concepto puede parecer intuitivo, pero la planificaci\u00f3n y ejecuci\u00f3n requiere de paciencia y previsi\u00f3n.<\/p>\n

He aqu\u00ed algunas cosas que debe saber cu\u00e1ndo se opta por el dise\u00f1o web adaptativo o Responsive Web Design:<\/strong>
\nHay que establecer expectativas realistas:<\/p>\n

Debemos conocer las limitaciones y diferencias para nuestro proyecto.<\/p>\n

Es importante conocer las limitaciones de dise\u00f1o de p\u00e1ginas web sensibles.<\/p>\n

No todas las experiencias web de escritorio se traducen en m\u00f3vil ya sea dentro de la aplicaci\u00f3n o en un sitio. Por ejemplo, las caracter\u00edsticas como el rat\u00f3n por encima o flotar capas que est\u00e1n presentes en las experiencias de usuario de escritorio no puede funcionar en la actualidad de la misma manera en el m\u00f3vil. A su vez, las experiencias web m\u00f3viles no siempre satisfacen las necesidades tal vez m\u00e1s complejas de los usuarios de escritorio.<\/p>\n

Esto pone de manifiesto la importancia de la identificaci\u00f3n y elaboraci\u00f3n de las variaciones en las prioridades de contenido para las experiencias m\u00f3viles, tabletas y ordenadores port\u00e1tiles y de escritorio, ya que todos ellos vienen con los escenarios de usuarios supone que est\u00e1n unidos entre s\u00ed .
\nEl M\u00f3vil primero<\/p>\n

En la experiencia del usuario (UX), debemos pensar \u00bb primero en el m\u00f3vil \u00bb es un enfoque que muchos dise\u00f1adores UX adopten en la planificaci\u00f3n de un sitio sensible. El contenido que los usuarios m\u00f3viles son m\u00e1s propensos a buscar se identifica y se le da la colocaci\u00f3n jer\u00e1rquica adecuada a trav\u00e9s de mapas de sitio, boceto, estructura y dise\u00f1o.<\/p>\n

Para crear \u00abm\u00f3vil primero \u00bb debemos pensar como adaptaremos y dispondremos los objetos de acuerdo con las orientaciones de las ventanas gr\u00e1ficas de los diversos dispositivos, as\u00ed como tambi\u00e9n las resoluciones de pantalla.<\/p>\n

El objetivo de pensar primero en el m\u00f3vil l m\u00f3vil es ofrecer soluciones de dise\u00f1o a las siguientes preguntas:<\/p>\n

\u00ab\u00bfQu\u00e9 se puede hacer para que la experiencia del usuario m\u00f3vil sea lo m\u00e1s fluida posible ?\u00bb<\/strong><\/p>\n

Para responder a esto, debemos tener en cuenta la cantidad de acciones que requiere un usuario para realizar una tarea espec\u00edfica, y tratar de reducirlos a lo absolutamente esencial, teniendo en cuenta el tama\u00f1o de la pantalla es relativamente peque\u00f1a. Obviamente esto va de la mano con el objetivo de reducir al m\u00ednimo el tiempo de carga del sitio mediante la reducci\u00f3n de las solicitudes y el tama\u00f1o de archivo en la parte del desarrollo de la web .
\nArquitectura y desarrollo a m\u00e1s fases<\/p>\n

Seg\u00fan el m\u00e9todo de flujo de trabajo, el dise\u00f1o y la codificaci\u00f3n de varias plataformas y puntos de interrupci\u00f3n puede tomar mucho m\u00e1s tiempo que el proceso tradicional que se hace para una web de escritorio s\u00f3lo desde el dise\u00f1o hasta el desarrollo. Por lo tanto, el Responsive Web Design tiene cada vez m\u00e1s y m\u00e1s necesidades de gesti\u00f3n de c\u00f3digos y contenido.
\nEn resumen debemos hacer muchas pruebas y m\u00e1s pruebas.<\/p>\n

Antes de lanzar nuestro sitio web, debemos asegurarnos de haberlo probado en todos los dispositivos principales como iPhone , Android , iPad y navegadores como Chrome, Safari , Internet Explorer, Firefox, etc. aunque esto nos parezca tedioso, es un paso muy importante ya que todos los dispositivos y sus navegadores mostrar\u00e1n la p\u00e1gina web de forma diferente.<\/p>\n

Los emuladores pueden ser una gran ayuda, pero no hay nada como las pruebas en el dispositivo real y su navegador. Si tenemos la posibilidad de hacer pruebas beta con algunos usuarios, sin duda, nos proporcionar\u00e1 informaci\u00f3n muy valiosa.<\/p>\n

Definitivamente, hay algunos retos cuando optamos por trabajar el Responsive Web Design, pero en mi experiencia debo decir que vale la pena , ya que crea una oportunidad \u00fanica para que nuestro negocio pueda llegar a m\u00e1s usuarios con m\u00e1s versatilidad, proporcionando una experiencia de usuario m\u00e1s fluida y eficaz.<\/p>\n

Solamente para que nos demos una idea de su importancia,  estas son las estad\u00edsticas que est\u00e1n dando a lugar la utilizaci\u00f3n de m\u00e9todos como el Responsive Web Design o Dise\u00f1o Web Sensible o Adaptativo.<\/p>\n

Usuarios de internet en el mundo hasta abril 2014: 2.900.250.000<\/strong><\/p>\n

Cantidad de Smartphones vendidos en 2013: 1.000.000.000<\/strong><\/p>\n

Cantidad de pc vendidos en 2013: 460.000.000<\/strong><\/p>\n

Cantidad de tablets vendidos en 2013: 195.400.000<\/strong><\/p>\n

Cantidad de p\u00e1ginas web en el mundo hasta abril 2014: 981.800.000<\/strong><\/p>\n

En pocas palabras despu\u00e9s de ver estas estad\u00edsticas crees que hacer una p\u00e1gina web que se adapte a todos los dispositivos es una mala idea?<\/p>\n

Por: Giorgio Maulini<\/p>\n

Para: Global Marketing<\/a><\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Que significa Responsive Web Design o (RWD)? Significa Dise\u00f1o Web Sensible o Adaptativo. Que es el Responsive Web Design o (RWD)? El Responsive Web Design o (RWD) o Dise\u00f1o Web Sensible o Dise\u00f1o Web Adaptativo es la creaci\u00f3n de p\u00e1ginas web que pueden ser visualizadas perfectamente en todo tipo de dispositivos, desde ordenadores de escritorio hasta […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[18,42,16,53,2,78,77,79],"class_list":["post-318","post","type-post","status-publish","format-standard","hentry","category-contenido-sin-clasificar","tag-creacion-de-webs","tag-desarrollo-web","tag-disenadores-web","tag-diseno-de-paginas-web","tag-diseno-web","tag-diseno-web-adaptativo","tag-diseno-web-sensible","tag-responsive-web-design"],"yoast_head":"\nQue es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing<\/title>\n<meta name=\"description\" content=\"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Que es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing\" \/>\n<meta property=\"og:description\" content=\"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog de Global Marketing\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/GlobalMarketin\" \/>\n<meta property=\"article:published_time\" content=\"2014-05-14T17:46:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-11T20:11:27+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg\" \/>\n<meta name=\"author\" content=\"G-B\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"G-B\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/\",\"url\":\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/\",\"name\":\"Que es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing\",\"isPartOf\":{\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg\",\"datePublished\":\"2014-05-14T17:46:29+00:00\",\"dateModified\":\"2020-06-11T20:11:27+00:00\",\"author\":{\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/6ece28b0af56ed75c3572bd7807c5d6d\"},\"description\":\"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage\",\"url\":\"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg\",\"contentUrl\":\"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg\"},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/#website\",\"url\":\"https:\/\/gmbbc.com\/global-marketing-blog\/\",\"name\":\"Blog de Global Marketing\",\"description\":\"Global Marketing\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/gmbbc.com\/global-marketing-blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/6ece28b0af56ed75c3572bd7807c5d6d\",\"name\":\"G-B\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/ace1d58d59c51f5e3cf717f0a81e64d7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/ace1d58d59c51f5e3cf717f0a81e64d7?s=96&d=mm&r=g\",\"caption\":\"G-B\"},\"url\":\"https:\/\/gmbbc.com\/global-marketing-blog\/author\/g-admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Que es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing","description":"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.","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:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/","og_locale":"es_ES","og_type":"article","og_title":"Que es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing","og_description":"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.","og_url":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/","og_site_name":"Blog de Global Marketing","article_publisher":"https:\/\/www.facebook.com\/GlobalMarketin","article_published_time":"2014-05-14T17:46:29+00:00","article_modified_time":"2020-06-11T20:11:27+00:00","og_image":[{"url":"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg","type":"","width":"","height":""}],"author":"G-B","twitter_misc":{"Escrito por":"G-B","Tiempo de lectura":"5 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/","url":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/","name":"Que es Responsive Web Design y para qu\u00e9 sirve. - Blog de Global Marketing","isPartOf":{"@id":"https:\/\/gmbbc.com\/global-marketing-blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage"},"image":{"@id":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage"},"thumbnailUrl":"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg","datePublished":"2014-05-14T17:46:29+00:00","dateModified":"2020-06-11T20:11:27+00:00","author":{"@id":"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/6ece28b0af56ed75c3572bd7807c5d6d"},"description":"Que es Responsive Web Design y para qu\u00e9 sirve adem\u00e1s de consejos y estad\u00edsticas.","inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/gmbbc.com\/global-marketing-blog\/que-es-responsive-web-design-y-para-que-sirve\/#primaryimage","url":"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg","contentUrl":"http:\/\/gmbbc.com\/global-marketing-blog\/wp-content\/uploads\/2014\/05\/responsive-web-design.jpg"},{"@type":"WebSite","@id":"https:\/\/gmbbc.com\/global-marketing-blog\/#website","url":"https:\/\/gmbbc.com\/global-marketing-blog\/","name":"Blog de Global Marketing","description":"Global Marketing","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/gmbbc.com\/global-marketing-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/6ece28b0af56ed75c3572bd7807c5d6d","name":"G-B","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/gmbbc.com\/global-marketing-blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/ace1d58d59c51f5e3cf717f0a81e64d7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ace1d58d59c51f5e3cf717f0a81e64d7?s=96&d=mm&r=g","caption":"G-B"},"url":"https:\/\/gmbbc.com\/global-marketing-blog\/author\/g-admin\/"}]}},"_links":{"self":[{"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/posts\/318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/comments?post=318"}],"version-history":[{"count":4,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/posts\/318\/revisions"}],"predecessor-version":[{"id":402,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/posts\/318\/revisions\/402"}],"wp:attachment":[{"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/media?parent=318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/categories?post=318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gmbbc.com\/global-marketing-blog\/wp-json\/wp\/v2\/tags?post=318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}