{"id":15797,"date":"2020-04-17T10:19:13","date_gmt":"2020-04-17T08:19:13","guid":{"rendered":"https:\/\/blog.acumbamail.com\/?p=15797"},"modified":"2022-08-07T17:34:21","modified_gmt":"2022-08-07T15:34:21","slug":"efecto-parallax","status":"publish","type":"post","link":"https:\/\/acumbamail.com\/blog\/efecto-parallax\/","title":{"rendered":"Efecto Parallax: qu\u00e9 es y c\u00f3mo hacerlo"},"content":{"rendered":"

El efecto Parallax<\/strong> es una tendencia cada vez m\u00e1s extendida en el mundo del dise\u00f1o web.<\/strong> Aunque el flat design<\/em> sigue siendo el tipo de dise\u00f1o m\u00e1s usado, hay t\u00e9cnicas que aportan personalidad a una web sin recargarla. En este post te explicamos qu\u00e9 es el efecto Parallax y c\u00f3mo usarlo.<\/p>\n\n

\u00bfQu\u00e9 es el efecto Parallax?<\/h2>\n

Tambi\u00e9n se denomina Parallax scrolling <\/em>y se trata de un efecto especial que aporta profundidad de campo y movimiento a tu web. Este efecto consigue que los objetos parezcan estar en 3D<\/strong> y se consigue dando distintas velocidades a los elementos de la web, con lo que se crea una ilusi\u00f3n \u00f3ptica en la que el fondo se desplaza a distinto ritmo que el contenido.\u00a0<\/strong><\/p>\n

El efecto aparece cuando hacemos scroll<\/em>,<\/strong> es decir, cuando nos desplazamos verticalmente. Aunque pueda parecer novedoso, el efecto Parallax lleva d\u00e9cadas us\u00e1ndose en cine de animaci\u00f3n y en dise\u00f1o de videojuegos.<\/p>\n

\u00bfQu\u00e9 nos aporta?<\/h2>\n

Por un lado, crea sensaci\u00f3n de dinamismo al desplazarnos por la web,<\/strong> por lo que es muy atractivo para p\u00e1ginas en las que se navega desde el m\u00f3vil<\/a>, que tienen un dise\u00f1o vertical.<\/p>\n

El dise\u00f1o que se consigue nos ayuda a destacar<\/strong> sobre otras webs de la competencia, ya que crea un impacto en el usuario, que recordar\u00e1 m\u00e1s f\u00e1cilmente nuestra marca.<\/p>\n

Adem\u00e1s, es una herramienta muy \u00fatil para webs que usan el <\/strong>storytelling<\/em><\/strong><\/a> como reclamo: es un efecto que sirve para contar historias. Tambi\u00e9n es adecuado para el dise\u00f1o de <\/strong>landing pages<\/em><\/strong><\/a> atractivas, si hablamos de su aplicaci\u00f3n en marketing digital.<\/p>\n

\u00bfQu\u00e9 inconvenientes tiene?<\/h2>\n

Como cualquier efecto, puede llegar a saturar al usuario <\/strong>si abusamos de \u00e9l. No es aconsejable aplicar el efecto Parallax en aquellas p\u00e1ginas en las que necesites encontrar informaci\u00f3n o gran cantidad de datos. Si hay que navegar de forma intensiva es mejor no usar efectos din\u00e1micos que cansen la vista.<\/p>\n

\u00bfC\u00f3mo se crea el efecto Parallax?<\/h2>\n

El efecto Parallax se puede crear desde cero, si manejas CSS3<\/strong>, Javascript<\/strong>, HTML5<\/strong> y otras herramientas de dise\u00f1o y programaci\u00f3n. Pero si no tienes conocimientos en estas materias, no te preocupes, es posible crear este efecto utilizando plugins <\/em><\/strong>que facilitan mucho el trabajo, aunque normalmente requieren de algunos conocimientos b\u00e1sicos.<\/p>\n

WordPress cuenta con m\u00faltiples plugins para crear el Parallax<\/strong> y otros efectos de animaci\u00f3n para tu web. Podemos destacar dos por su vigencia y facilidad de uso.<\/p>\n