diseño web
13 / 05 / 2016

Diseño web parallax

Diseño web parallax
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.

Noticias relacionadas

¿Tienes un proyecto en mente? Cuéntanoslo

Finalidades de la protección de datos: Envío de nuestro boletín comercial y de comunicaciones informativas y publicitarias sobre nuestros productos o servicios que sean de su interés, incluso por medios electrónicos. Legitimación: Consentimiento del interesado. Destinatarios: No están previstas cesiones de datos. Derechos: Puede retirar su consentimiento en cualquier momento, así como acceder, rectificar, suprimir sus datos y demás derechos en info@latevaweb.com. Información Adicional: Puede ampliar la información en el enlace de Política de Privacidad.

Utilizamos cookies propias y de terceros para ofrecerte un mejor servicio. Más información

Aceptar