Parallax scrolling is a website effect where the background content (i.e. an image) is moved at a different speed than the foreground content while scrolling.
Parallax effect creates the appearance of depth and dimension by moving two elements at different rates when scrolling through a web page or slide.
Some may move faster, others may move slow, while a few may stand still.
Note: Parallax scrolling does not always work on mobile devices or smart phones. However, media queries can be used to turn off the effect on mobile devices.
Guidelines:
If you do use these websites as inspiration for your own, remember to follow some of these guidelines for accessible parallax effect design:
- Keep the number of parallax effects to a minimum
- Constraint movement effects within a small area of the screen
- Include options for users to turn off parallax effects
- Don’t let your effects distract users from important information
Sameer Bansal is the Principal Consultant at Brandfocal. He helps clients with their branding, content marketing and technical writing efforts.
Latest posts by Brandfocal Services (see all)
- robots.txt file and its significance - August 28, 2023
- Google’s Webmaster Guidelines - August 28, 2023
- What is E-E-A-T? - August 28, 2023