Hubo un tiempo en que se diseñaban las webs teniendo en mente el usuario de escritorio únicamente y se tenía en cuenta, de forma incompleta e inmadura, los dispositivos móviles al final, y en ocasiones ni eso.

Eran tiempos de podredumbre, en los que incluso se llegaba a trepanar la funcionalidad de la web para encajar en móvil, creando una experiencia absolutamente incoherente y en demasiadas ocasiones, directamente infumable.

Responsive

En el primer semestre de 2012 fué que tuve contacto por primera vez con un concepto que cambiaría mi forma de crear webs, pero que ha demostrado iba a cambiar mucho más: el diseño responsive.

El concepto era sencillo, del mismo modo que se ha hecho siempre en la industria de la maquetación física, se divide el ancho del contenido en partes iguales (usualmente 12), y toda proporción se mide en “celdas” o “bloques”.

Esto permitía algo hasta el momento menos natural, definir la web con independencia del ancho de la pantalla del dispositivo, daba igual si la resolución era 1024 u 800 al estar todo definido de forma proporcional.

Todo encajaba, no sin algunos quebraderos de cabeza, pues html5 y css3 acaban de entrar en juego y había graves inconsistencias aún entre navegadores, pero con tesón y buena disposición, era posible desfacer los entuertos que aparecían en el camino.

Mobile First

Pero hete aquí que cada vez más los móviles se tornaban en dispositivos de uso masivo, en determinados contextos, incluso más que los ordenadores de escritorio Fue la época del 10.000 euros (como poco) por hacerte la versión móvil de tu web o adaptarla a “html5“, si, html5 era un argumento de venta entonces.

Pero claro, irrumpió el mundo de las cosas responsive, o como me gusta decir, de las cosas “bien hechas”, y todos aquellos de profesionalidad dudosa (no olvidemos que en aquellos años, debido a la crisis de 2008, el intrusismo era máximo), se resisten a aprender y actualizarse a “eso tan complicado de las rejillas”… como digo, bomberos metidos a maquetadores.

Pronto descubrieron que el mundo de la informática es uno en que has de actualizarte constantemente y muy rápidamente la burbuja de la “versión móvil” dio paso a la de la “web responsive”. Si , hubo un tiempo en que hacer las cosas en html4 era una opción, y Google no te castigaba por ello.

Claro, una vez pasamos al responsive, con los paradigmas avanzados de html5 y css3, surgió una de esas guerras equivalentes al “tortilla con o sin cebolla”, ¿diseñar para escritorio y luego encajar como se pudiera los bloques en el móvil? ¿o tal vez diseñar directamente sobre el móvil y aplicar una mejora progresiva “Progressive Enhancement”?

Personalmente no tuve la más mínima duda: Mobile First.

Forma y Función

Fueron aquellos años una gran escuela, en la que me mostraron el camino que supone tomar en consideración en primer lugar la función de los elementos.

La forma era mínima y puramente adaptada al dispositivo en que estamos situados, a mayor espacio mayores licencias artísticas y detalles que mejoraban el diseño, pero manteniendo la funcionalidad intacta.

Ejemplo típico de esta herencia es que incluso en escritorio, reduzco el tamaño de la ventana o aumento el zoom hasta que la web se muestra en modo “móvil” cuando leo noticias, habitualmente en escritorio hay demasiados estorbos absurdos (y apestosos), procedentes del politiqueo de los que no saben más que de justificar sus sueldos.

Accessibility First

La historia se repite, en la época que vivimos se construyen webs y sistemas no accesibles para luego encajar la accesibilidad de forma similar a lo que se hacía al comienzo con la versión móvil, incluso se piden miles de Euros por hacer “la versión accesible”.

Creo, por tanto, que debemos adoptar el mismo camino para crear webs inclusivas, primero diseñamos con la accesibilidad de cada función en mente, para luego encajar visualmente en un móvil, posteriormente en escritorio, siguiendo el mismo planteamiento y filosofía.

Porque no en vano, lo importante, lo que genera usuarios y clientes satisfechos, es poder hacer aquello para lo que entramos a la web con efectividad, de nada sirve un gran despliegue visual en escritorio si no podemos comprar un billete de forma accesible.

Así pues, como habrás deducido, voy a seguir estos principios en nuestro curso para hacer la plantilla de wordpress inclusiva.