Parallax web design is clearly in fashion, but is it advisable to use it?
Parallax is an effect that when you access a website and click on an element, usually an arrow or part of the menu, the page jumps to that content. The jump is made to content that you had not seen before, located in another part of the same HTML and at a different speed than the usual scroll and generating a sensation of depth and movement. In fact, the key is that the background of the website and the content move at different speeds.
The parallax effect was invented by Disney to transmit a certain three-dimensional effect in its animated films.
The key to parallax is that all the information is on a single web page, specifically in a single HTML, and the jumps have to be full screens for the effect to occur. This technique has become popular since Flash has fallen into disuse and we find a decrease in movement on web pages. Its inclusion in typical WordPress templates has also promoted the use of parallax.
The use of parallax in web design is very interesting and effective for storyboards or when we canada telegram data try to explain a story in a linear sequence and in consecutive blocks. Advanced knowledge of HTML5 or CSS3 is not necessary and there are libraries such as parallax.js that can help you implement parallax on your website.
However, it has serious drawbacks that recommend limiting its use, such as:
Loading speed
When loading the entire website on a single page or HTML and depending on the loading of multiple .js, this weighs a lot, which seriously harms the loading speed of the web page since we have to wait for the entire file to load to access the information. This has even led to recovering old preloaders. When this happens on mobile phones or tablets connected to the mobile band, it is even worse. This slow loading also penalizes the web positioning or SEO of these pages. The use of CDN and minifying CSS and .js is mandatory when using parallax web design.
Usability
Usability is affected by the loading time of the website, which encourages many users to be impatient and leave our website before accessing the content or, in other words, we have high bounce rates on these websites. In addition, jumps within the page are usually indicated with tiny arrows or menu sections, which often makes access to information difficult.
SEO
Parallax negatively affects SEO not only because of the loading speed of the website but also because, for example, we find that web pages are not organized by content and we cannot dedicate ourselves to positioning each web page or HTML for a certain keyword or concept. We only have one title and description for the entire website and all the content added together in a single HTML.
In short, only use parallax in web projects where you want to explain a story in a linear sequence and in consecutive blocks and for which web positioning or SEO is not important. A clear example to use it would be the website The Boat .
Related service
Web design
Web design in Barcelona