En un contexto actual donde más del 90% de los internautas accede a internet a través de un dispositivo móvil, tiene todo el sentido del mundo que el diseño web se adapte a esta realidad.

Hasta hace relativamente poco, lo más habitual en terminos de confección era centrar todos los esfuerzos a nivel estético, estructural y de comportamiento en la versión de escritorio de una página y, a posteriori, adaptarla a otros dispositivos y a sus relaciones de aspecto.

 

A dia de hoy, el peso del móvil en nuestro dia a dia y la progresiva naturalización de la navegación fuera de casa hace que el punto de partida sea otro: es necesario, en primer lugar, pensar en un diseño móvil atractivo y diferencial

 

pexels photo 799443

Pensar en clave móvil, una necesidad

Al diseñar para móviles y tablets, hay que tener muy presente la desigualdad por lo que respecta a la calidad de conexión (y del propio dispositvo) de cada usuario. Podemos aseverar, entonces, que un buen diseño Mobile First debe tener en cuenta distintos factores

  • Debe centrarse en lo más esencial 
  • Debe buscar el máximo rendimiento multi-dispositivo
  • El diseño debe ser totalmente pensado y personalitzado para Smartphones
  • Hay que evitar el uso de imagenes de gran peso y las características innecesarias (como los pop ups)
  • Debe estar dotado de un código fuente simple y no redundante

 

Además, la simplificación del codigo resultante favorece, en gran medida, la definición de un buen comportamiento responsive, una de las condiciones sine qua non de cara a obtener un buen posicionamento SEO.

Desde el año 2017, Google da una importancia capital a la versión móvil de una página web y es el primer factor que tiene en cuenta en terminos de posicionamento.

Por lo tanto, crear una web pensada y optimitzada para la visualización en smartphones no es una opción. Es una obligación. 

 

AMP, el origen

Para entender el fenomeno en su conjunto, es interesante rebobinar en el tiempo y situarnos en el año 2015, año en el que Google decide impulsar, junto a otras compañías como Twitter, el proyecto AMP (Accelerated Mobile Pages).

Se trata, en esencia, de un proyecto de código abierto que pretende sentar las bases de la creación de sitios web pensados para móvil con una velocidad de carga muy alta. Son páginas que disponen de un código HTML tan ligero que posibilitan un incremento de velocidad de entre el 15% y el 85% respecto a una web estándar. 

Dentro de los criterios AMP podemos encontrar la prohibición de algunos tags HTML complejos (com los ‘form’), el uso de un código CSS ligero y la reducción del uso de Javascript a un conjunto de librerias muy específicas.

Visita el sitio oficial de AMP.

(Introducción a AMP para desarrolladores Web)

 

Ejemplo Mobile First

Tot Roda

Se trata de un sitio web de interés para los habitantes de Roda de Ter y supone un claro ejemplo de la simplifación al servicio del rendimiento y la facilidad de uso.

 

Sin título Sin título sss

 

Visita la web de Tot Roda para comprobar, tu mismo, el funcionamento.