DIseño de páginas web 2016

2016 va a ser el año en que las empresas de diseño web vamos a tener la necesidad de cambiar el diseño de páginas web para empresas; se están produciendo grandes cambios a nivel de posicionamiento SEO los cuales nos van a obligar a adecuar el desarrollo de páginas web; estos cambios van a afectar de forma drástica en la forma de entender el diseño de páginas web.

diseño de páginas web 2016

La reciente introducción del proyecto Accelerated Mobile Pages, va a significar el primero de un conjunto de cambios en el diseño de páginas web los cuales voy a tratar de explicar; veamos uno a uno estos cambios

El diseño de páginas para AMP (accelerated mobile pages)

En un post anterior ya explicaba de forma bastante detallada cómo programar páginas en base al proyecto AMP; pues bien, el primer cambio significativo es en referencia a como se estructuran estas etiquetas para AMP:

  • img: reemplazada por amp-img
  • video: reemplazada por amp-video
  • audio: reemplazada por amp-audio
  • iframe: reemplazada por amp-iframe

Por lo tanto para que nuestras páginas web se muestren de forma correcta en dispositivos móviles; vamos a tener en cuenta estos cambios de etiqueta en nuestras páginas diseñadas para AMP;  si no cumplen con todas sus directrices marcadas hasta ahora, se espera un aumento notable de cambios, no van a ser indexadas; con el consiguiente perjuicio para el posicionamiento web de las empresas que nos han encargado un diseño.

Diseño de páginas optimizado

Ya hace tiempo que Google lo avisa y en el último cambio del Core lo ha convertido en una realidad; ya es imprescindible tener todas nuestras imágenes perfectamente optimizadas, hojas de estilo CSS, el JS convenientemente optimizado al máximo y los botones táctiles bien ordenados para la experiencia móvil de usuario; si a esto le añadimos la necesidad de optimizar el HTML evitando al máximo los saltos de línea en blanco, y los comentarios sobre el código; nos queda clara la necesidad de ser mucho más limpios y eficaces en el diseño de páginas web.

La optimización de cada uno de estos puntos aporta a nuestra página una capacidad de interpretación mucho mejor por parte de los distintos navegadores, y el hecho de que nuestra página web esté en perfecto estado de optimización, nos aporta que se muestre mucho antes su contenido; permitiendo que la experiencia del usuario que nos visita sea mucho mejor.

La WPO ya no va a ser una opción en el diseño de páginas web

Siendo coherentes con el punto anterior, resulta obvio que deberemos entregar el diseño de nuestras páginas web ya optimizado, no sólo en código, también con todo aquello que permita a las páginas una buena velocidad de carga, tratar de tener los mejores servidores a disposición de nuestros clientes y depurar al máximo todos los puntos sensibles del desarrollo de la web, olvidemos pues la opción de WPO en nuestros presupuestos para empresas y pasemos a incluirlos como un elemento más del diseño.

No podemos entregar nuestros proyectos de diseño web a medias, el usuario prefiere pagar un poco más y tener una página en perfecto estado, si lo hacdemos de otro modo estamos dando un mal producto, un buen diseño web debe tener en el momento de su entrega toda la funcionalidad y debe estar perfectamente optimizado para que sea visible y utilizable, la experiencia de los usuarios nos pide cada vez más y hay que entregarlo sin condiciones, ya que es la única forma de llevar nuestros diseños al siguiente nivel, ya no se trata de dar calidad, se trata de ofrecer calidad en nuestros diseños.

La construcción semántica en el diseño de páginas web

Hasta ahora para el desarrollo web no se tenía en cuenta que contenido iba a albergar ni como se iba a estructurar, durante el diseño de páginas se trabajaba con textos inhertes, los famosos lorem ipsum, los cuales eran sustituidos por los textos definitivos de las empresas una vez aprobada la maqueta, pues bien, este es otro de los grandes cambios, seguramente vamos a tener la necesidad de posponer por lo menos la entrega del diseño de páginas destinadas a la Home y páginas de aterrizaje, necesitamos conocer de antemano que contenido va a albergar para poder hacer una buena maquetación, después ya entrará a fondo el equipo de posicionamiento web para ver si es el más adecuado o no según los intereses de las empresas que nos han encargado un diseño.

El gran culpable de este cambio es el llamado Deep Learning (conocimiento profundo), según Google va a ser un factor de posicionamiento determinante y va a tener en la experiencia de usuario en nuestro diseño de páginas web su máximo exponente.

Diseño de páginas Full Responsive o versiones para móvil

Otra de las grandes advertencias de Google, el diseño de páginas no optimizados para móvil no iban a posicionar en búsquedas desde estos dispositivos, pues parece ser que definitivamente hemos pasado de la opción a la obligación, ahora ya no es suficiente un diseño de páginas responsive, ha de ser full responsive, es decir con los contenidos perfectamente adaptados a distintas ventanas gráficas, en este punto es muy importante tener en cuenta eliminar tablas de nuestro diseño, las tablas acostumbramos a realizarlas en valores absolutos en pixels.

A pesar de la paulatina introducción de tablas basadas en valores relativos (%) parece ser que no es suficiente para que los motores de búsqueda comprendan el contexto de estas tablas y nos quedan dos opciones, utilizar etiquetas de cabecera en tablas o bien directamente suprimirlas por listas, con el fin de mejorar el diseño de nuestras páginas podemos optar por diseño a varias columnas con el fin de lograr la presentación de las páginas lo más estética posible.

La importancia de la tipografía en el diseño de páginas web

Si tenemos en cuenta lo visto anteriormente tanto para Deep Learning como AMP, parece que el texto vuelve a cobrar protagonismo, por tanto la elección de una buena tipografía como elemento para el disño de páginas web va ser una tendencia cada vez más utilizada como forma de expresión en el diseño en lugar de como forma cómo la entendiamos hasta ahora.

Los efectos Parallax incorporados al diseño de páginas web de empresas

Con la progresiva desaparición del flash motivado porque no era visible en dispositivos móviles, hemos tenido que adaptar nuestro diseño de páginas web a nuevos formatos, entre ellos el Parallax creo que resulta el más desconocido, cuando menos el que menor uso tiene. Sin embargo el diseño de páginas web y el hecho de que Parallax permite multitud de posibilidades hace que la vista de páginas que utilicen este formato de animación ofrezca mejores experiencias de usuario que aquel diseño de páginas web que los pasan por alto.

Los slideshow van de baja en el diseño de páginas web

Si utilizamos Parallax, ¿necesitamos slide?; sinceramente pienso que no, entre el retardo que origina su carga y la cantidad de código necesario para que las páginas sean utilizables desde el segundo cero; estoy convencido de que vamos a ver una progresiva desaparición de elementos hasta ahora sobre utilizados; cómo el clásico Revolution Slider utilizado hasta la saciedad con mil y una formas de presentación; y que además de su vulnerabilidad, a menos de utilizar la versión de pago que permite actualizar el plugin de forma recurrente; tiene como principal handicap el uso de tanto JS que retardar su carga con efectos positivos es impensable dentro de las nuevas tendencias de diseño de páginas web.

La web para móviles

Sin duda es el penúltimo gran reto al que nos enfrentamos, y que deberá suponer un gran cambio en la forma en que vayamos a diseñar nuestras páginas web para móviles; los usuarios cada vez hacen un mayor número de consultas en web a traves de este tipo de dispositivos, y este va a ser uno de los grandes factores que harán que tu web triunfe por encima de las demás; tener un buen diseño pensado en web para móviles te garantiza la usabilidad y las conversiones sin necesidad de trabajar específicamente en un diseño exclusivo y pensado para escritorio; la web para móviles es en estos momentos fundamental para cualquier empresa que quiera obtener la suficiente visibilidad.

Seguramente podemos aportar algunas tendencias más en el diseño de páginas web; los anchor, los scroll en las distintas páginas que tanto miedo nos daban; incluso el diseño en Grid, el cual aporta un parecido asombroso y vistoso muy parecido al de la red social Pinterest; en cualquier caso pienso que estos elementos hace tiempo dejaron ya de ser tendencia, y a día de hoy son un recurso a utilizar en nuestro diseño de páginas web; pero hay que tener muy en cuenta que las tendencias tienen una duración determinada, y que igual que hoy son tendencia mañana dejan de serlo; por lo tanto utiliza tus propios criterios para decidir que vas a incorporar a tu diseño de páginas web, y que no vas a utilizar no vaya a ser que tengas que andar haciendo rediseño.

Rating: 5.0. From 27 votes.
Please wait...
Por | 2017-03-15T09:54:10+00:00 28 Marzo , 2016|Diseño Web|

Un comentario

  1. Nathan Araujo 15/05/2016 en 1:46

    muy bueno su post! Realmente son factores que tenemos que seguir.

    No votes yet.
    Please wait...

No se permiten comentarios.