{"id":12671,"date":"2016-01-15T07:59:50","date_gmt":"2016-01-15T13:59:50","guid":{"rendered":"https:\/\/www.uv.mx\/universo\/?p=12671"},"modified":"2016-02-16T20:18:15","modified_gmt":"2016-02-17T02:18:15","slug":"diseno-web-responsivo-dwr","status":"publish","type":"post","link":"https:\/\/www.uv.mx\/universo\/general\/diseno-web-responsivo-dwr\/","title":{"rendered":"Dise\u00f1o Web Responsivo (DWR)"},"content":{"rendered":"
Esta entrada es parte 10 de 42 en la serie 626<\/a><\/div><\/div><\/div>

\"Universo-TecnoTips_Temis\"<\/a>Ang\u00e9lica Aquino Lozano<\/strong><\/span><\/p>\n

Con el fin de brindar al usuario una mejor experiencia, el Dise\u00f1o Web Responsivo (DWR) tiene como objetivo visualizar una p\u00e1gina web de forma adecuada en los distintos dispositivos m\u00f3viles.<\/p>\n

Lo anterior se hace prescindiendo de los valores fijos y adoptando las proporciones de los elementos para que al momento de visualizar el contenido de una p\u00e1gina \u00e9stos se ajusten en sus medidas guardando una
\nproporci\u00f3n entre ellos; con esto podremos evitar problemas de carga muy lenta, de navegaci\u00f3n complicada, de ilegibilidad de im\u00e1genes y textos, y sobre todo que el usuario no abandone nuestro sitio.<\/p>\n

El DWR se consolida como una de las mejores pr\u00e1cticas de hoy en d\u00eda en el dise\u00f1o web, puesto que m\u00e1s del 80 por ciento de las personas accede a Internet a trav\u00e9s de sus dispositivos m\u00f3viles, esto significa que un segmento importante de personas que visitan nuestros sitios a diario lo hacen desde un m\u00f3vil o una tableta.<\/p>\n

\u00bfC\u00f3mo podemos hacer nuestro DWR? En primera instancia, debemos tener en cuenta que los tama\u00f1os y resoluciones de pantalla var\u00edan enormemente, que la navegaci\u00f3n es t\u00e1ctil y un dedo no tiene la misma presi\u00f3n que el puntero del rat\u00f3n.<\/p>\n

Se recomienda dise\u00f1ar bajo la tendencia del Flat Design por su simpleza, claridad de comprensi\u00f3n para el usuario y sin dejar de lado la elegancia del dise\u00f1o gr\u00e1fico.<\/p>\n

En nuestro dise\u00f1o debemos hacer uso de una rejilla o cuadr\u00edcula a 12 columnas, a fin de que sea fluido y as\u00ed evitar los problemas de adaptaci\u00f3n y sobrecarga de elementos in\u00fatiles para aprovechar el ancho completo del dispositivo donde se visualiza, sin importar el tama\u00f1o de su pantalla.<\/p>\n

Elegir una fuente que pueda ser legible en cualquier tama\u00f1o de pantalla, como son las familias Serif y Sans Serif, omitiendo las manuscritas, cursivas o rotuladas.<\/p>\n

Las im\u00e1genes deber\u00e1n elegirse de manera que se adapten al contenido y se puedan dar a entender correctamente en distintos tama\u00f1os. Hay que evitar im\u00e1genes con demasiados detalles, ya que llegar\u00e1 un punto donde \u00e9stas ya no sean legibles.<\/p>\n

Considerar el uso de un men\u00fa lateral o desplegable, pues ahorrar\u00e1 espacio permitiendo a los dem\u00e1s elementos ser lo suficientemente grandes para facilitar la navegaci\u00f3n t\u00e1ctil.<\/p>\n

Los elementos de dise\u00f1o deber\u00e1n estar situados para que puedan adaptarse de manera fluida en las\u00a0diferentes resoluciones.<\/p>\n

Una vez que tengas estos elementos, considera visualizarlos en distintos dispositivos para asegurarte que tu DWR cumpla las necesidades de tu usuario.<\/p>\n","protected":false},"excerpt":{"rendered":"

Esta entrada es parte 10 de 42 en la serie 626<\/a><\/div><\/div><\/div>

Con el fin de brindar al usuario una mejor experiencia, el Dise\u00f1o Web Responsivo (DWR) tiene como objetivo visualizar una p\u00e1gina web de forma adecuada en los distintos dispositivos m\u00f3viles.<\/p>\n","protected":false},"author":1664,"featured_media":9862,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"series":[382],"class_list":["post-12671","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-general","series-382"],"_links":{"self":[{"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/posts\/12671","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/users\/1664"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/comments?post=12671"}],"version-history":[{"count":0,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/posts\/12671\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/media\/9862"}],"wp:attachment":[{"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/media?parent=12671"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/categories?post=12671"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/tags?post=12671"},{"taxonomy":"series","embeddable":true,"href":"https:\/\/www.uv.mx\/universo\/wp-json\/wp\/v2\/series?post=12671"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}