Llamamos "Diseño Adaptable" una serie de tecnicas en el diseño y desarrollo de sitios web con el fin de que sean utilizables en cualquier dispositivo o entorno, sin necesidad de duplicarlos para hacer versiones para dispositivos concretos.

En los primeros años de expansión de Interner, casi todo el trafico se realizaba desde ordenadores personales, es decir, había un número reducido de sistemas operativos, navegadores, resoluciones, situaciones de uso y dispositivos de entrada. Con la irrupción de los smartphones y de otros dispositivos este panorama ha cambiado totalmente, y es practicamente imposible saber en que dispositivo, resolución, situación o metodo de entrada se consumiran nuestros contenidos y servicios. Esta situación solo puede aumentar, ya que cada vez mas dispositivos (TV, consolas, automóviles, electrodomesticos, etc.) cuentan con un navegador web integrado. Por ello es fundamental establecer tecnicas que permitan que nuestros portales se adapten a cualquier situacion y entorno.

Por ejemplo, entre las visitas a Euskadi.eus durante el año 2018 tenemos esta multitud de variables:

• Tipo de dispositivo: Ordenador personal (62%), movil (34%), tablet (4%)
• Sistemas Operativos: Windows (57%), Android (27%), iOS (11%), MacOS (3%), y asi hasta 26 sistemas distintos.
• Navegadores: Chrome (59%), IE (13%), Safari (11%), Firefox (10%) y así hasta 72 navegadores distintos
• Resolucion: 1366x768 (17%), 360x640 (17%), 1920x1080 (9%) y así hasta mas de 7000 resoluciones de pantalla distintas

A estas variables hay que añadir otras como distintos plugins (PDF, Flash), distintos metodos de entrada (teclado, raton, tactil, mando de TV o consola), distintas velocidades de conexion, etc.

Ventajas del diseño adaptable

• Mejoras en la experiencia de usuario y la gestión: facilitar el consumo de contenidos y servicios con independencia del dispositivo o la situación que tengan las personas usuarias, sin necesidad de hacer versiones extra para determinados entornos y por lo tanto sin necesidad de duplicar el trabajo y el mantenimiento.
• Mejoras en posicionamiento en buscadores: Al evitar duplicidades de contenidos evitamos penalizaciones de SEO. Además, Google da relevancia a sitios que esten adaptados a distintos dispositivos.
• Mejoras en el diseño de la interfaz y la arquitectura de la información: El tener en cuenta los dispositivos con pantalla pequeñas (por ejemplo, los móviles) y que pueden ser utilizados en situaciones de escasa atención o conexión de baja velocidad nos obliga a replantear el diseño clasico de la interaccion y presentacion de los sitios web, lo cual implica una simplificación de los mismo y una mayor facilidad de uso para el usuario. De hecho, al plantear un diseño de interfaz se recomienda pensar primero en los dispositivos moviles ("Mobile First") para lograr interacciones mas claras y simples.
• Mejoras en accesibilidad: El uso intensivo de estandares y la simplificación de las interacciones trae consigo una mejora en la accesiblidad (no en vano, se trata de dos conceptos intimamente ligados).

Diseño adaptable en Euskadi.eus

• Desde hace años el Servicio Web esta realizando esfuerzos por adaptar la red de portales a estos principios de diseño adaptable. Por ejemplo, el rediseño de Euskadi.eus se realizó usando la filosofía "mobile first" lo que ha traido una simplificación de la interfaz, así como una mejora en el uso de estándares web, velocidad de carga de las páginas y accesibilidad. Asimismo, hemos trabajado en la adaptación de diversos portales (en 2017 el 65% de los portales estaban adaptados para móviles, mientras que en el 2019 se ha logrado elevar ese porcentaje al 79%).
• Como consecuencia del rediseño de Euskadi.eus en el año 2017, tanto las páginas principales de Euskadi.eus como los portales del Gobierno Vasco y todos los Departamentos están ya adaptados a multiples dispositivos. Todas las páginas y contenidos que se creen y visualicen dentro de estos portales se beneficiarán de estas tecnicas.
• Hemos basado la adaptabilidad de nuestros portales en el uso de estandares web (HTML5 y CSS3), utilización de unidades relativas y media queries para adaptar el diseño a distintas resoluciones, modificaciones mediante lenguajes de script y uso de frameworks como Bootstrap. En breve daremos pasos para implantar más técnicas (carga de imagenes segun dispositivo, uso de compresion en el lado servidor para acelerar la carga de páginas, etc.).
• Respecto a los portales temátivos y de otros organismos hemos trabajado junto a los responsables de dichos portales para implementar técnicas de Diseño Adaptable. A mediados de 2019, el 80% de los portales de la red estan ya adaptados, y nuestro objetivo es que para finales del 2020 todos los portales de la red utilicen dichas técnicas. El Departamento u organismo titular del portal será el responsable de esta adaptación, para lo que contará en todo momento con la ayuda y asesoría del Servicio Web. Si tienes cualquier duda al respecto ponte en contacto con el Gestor Web del Servicio Web asignado a tu departamento u Organismo.