Diseño web parallax
Actualizado: 29 / 01 / 2022

Diseño web parallax

Bruno Díaz Marketing Manager
Bruno Díaz
Marketing Manager
SectorHablamos de
El diseño web en parallax o paralaje está claramente de moda, pero ¿es conveniente su uso?
    
El parallax consiste en un efecto que al acceder a una web y clickar en un elemento, normalmente una flecha o una parte del menú, la página hace un salto a ese contenido. El salto se realiza a un contenido que hasta ahora no veías, situado en otra parte del mismo HTML y a una velocidad diferente que el habitual scroll y generando una sensación de profundidad y de movimiento. De hecho la clave es que el fondo de la web y el contenido se mueven a diferente velocidad.

El efecto parallax o paralaje fue inventado por Disney para transmitir un cierto efecto tridimensional en sus películas de dibujos animados.

La clave del parallax es que toda la información está en una única página web, concretamente en un único HTML, además los saltos han de ser pantallas completas para que se dé el efecto. Esta técnica se ha popularizado desde que el Flash ha caído en desuso y nos encontramos con un descenso del movimiento en las páginas web. Su inclusión en las típicas plantillas de WordPress también ha potenciado el uso del parallax.

El uso del parallax en diseño web es resultón y muy interesante para stroryboards o cuando intentamos explicar un relato en una secuencia lineal y en bloques consecutivos. No es necesario conocimientos avanzados de HTML5 o CSS3 y existen librerías como  parallax.js que te pueden servir para implementar parallax en tú página web.

Sin embargo tiene serios inconvenientes que recomiendan limitar su uso como son:

Velocidad de carga

Al cargar todo el sitio web en una única página o HTML y depender de la carga de múltiples .js, ésta pesa mucho lo que perjudica gravemente la velocidad de carga de la página web ya que hemos de esperar a la carga de todo el fichero para acceder a la información. Esto a llevado a incluso recuperar antiguos preloaders. Cuando esto se da en móviles o tablets conectados a la banda móvil aún es peor. Esta lentitud de carga penaliza además el posicionamiento web o SEO de estas páginas. El uso de CDN y minificar CSS y .js es obligatorio en el uso de diseño web en parallax.

Usabilidad

La usabilidad se ve perjudicada por el tiempo de carga de la web, lo que fomenta que muchos usuarios no tengan paciencia y marchen de nuestra página web antes de acceder al contenido o, lo que es lo mismo, tengamos altas tasas de rebote en estas webs. Además, normalmente los saltos dentro de la página se suelen indicar con diminutas flechas o secciones del menú, lo que dificulta a menudo el acceso a la información.

SEO

El parallax afecta negativamente al seo no solo por la velocidad de carga de la página web sino porqué por ejemplo nos encontramos con que las páginas web no se organizan por contenido y no podemos dedicarnos a posicionar cada página web o HTML para una determinada palabra clave o concepto. Únicamente tenemos un title y decription para todo el sitio web y todos los contenidos sumados en un único HTML.

En resumen, usa únicamente parallax en proyectos web donde desees explicar un relato en una secuencia lineal y en bloques consecutivos y para los que el posicionamiento web o SEO no sea importante. Un claro ejemplo para usarlo sería la página web The Boat.
Bruno Díaz Marketing Manager
Sobre el autor/a
Bruno Díaz — Marketing Manager
Profesional de larga trayectoria como consultor de comunicación y marketing digital, y especializado en SEO, SEM y proyectos web. Como Marketing Manager de la agencia, coordino a un equipazo de técnicos de marketing digital del cual estoy muy orgulloso.

Noticias relacionadas

¿Tienes un proyecto en mente? Cuéntanoslo