Parallax Scrolling o PS

El Parallax Scrolling es una técnica de diseño web que por su vistosidad y efectos adictivos es cada vez más utilizada entre los desarrolladores.

El principio es relativamente sencillo. Se trata de simular un efecto 3D dando sensación de profundidad y movimiento por medio de varias capas con fondos transparentes cuya velocidad de desplazamiento y posición de los elementos de cada capa es variable.

web001

Este efecto, además, «invita» al usuario a realizar un scroll o desplazamiento en sentido vertical (u horizontal) para seguir «reproduciendo» la página.

Esta técnica tiene su origen en los efectos empleados en la industria de los videojuegos de principio de los 80 del siglo pasado, dónde la potencia de computación y recursos técnicos eran mucho más limitados, y está diseñada para conseguir efectos espectaculares, con un costo relativamente modesto de recursos, en aras de una velocidad de descarga web óptima.

El término «Parallax» proviene del griego y significa «alteración«. Esta alteración no solo afecta a como se percibe la página, sino, también la forma de interactuar con ella.

web002

Lo más llamativo de esta técnica es que «altera» el sistema tradicional de navegar por un sitio web, convirtiendo este proceso en una secuencia lineal de escenas, tal y como sucede en una película, lo que redunda en un procedimiento más «natural» de navegación , sin renunciar, por supuesto, a la posibilidad de interactuar, en cualquier momento, como en un página web convencional.

Quizá lo más llamativo del Parallax Scrolling es que, bien ejecutado, crea un efecto «hipnótico» sobre el usuario, quién se siente tentado de seguir explorando la página en sentido vertical u horizontal, evitando de esta forma estructuras demasiado «profundas», es decir que para llegar a determinados sectores del sitio es necesario hacer un número excesivo de «clics» desde la página principal.

La idea es «enganchar» al internauta con un argumento visual atractivo y dinámico al mismo tiempo que intuitivo. De esta se genera una necesidad natural a seguir haciendo scroll.

Ni que decir tiene que esta técnica no encaja en todo tipo de páginas. Además la «secuencialización» de el sitio ha de hacerse con criterio, ya que un «guión» excesivamente largo o enrevesado puede dar al traste con la idea que se persigue.

Simple tutorial para crear efecto Parallax scrolling

Ejemplos y tutoriales