As internet connection speeds improve and companies look for new ways to distinguish their online presence, parallax scrolling has become increasingly popular. Parallax scrolling is a process where differentiated foreground and background content moves at different speeds and is traditionally associated with homepage animations.
Media organizations were among the first to employ vertical parallax scrolling, and Shorthand has become a go-to resource. Shorthand presentations are scrolling pages where background images remain fixed for certain periods, while foreground text rolls over them (and periodically obscures them). Moving down to the next section unveils a different image, either as a transition or a straight scroll-in.
Even simple Shorthand presentations are visually striking, and at their best, they can be quite spectacular. These are Midphase’s tips for creating stunning Shorthand shows, without consuming too much bandwidth on end-user devices. After all, Google attaches no additional merit to stylish websites when compiling ranking results…
1. Add context or atmosphere with video clips.
Although it affects page loading times, strategic use of video in Shorthand presentations can be arresting and informative. As an example, shaded footage of a waterfall would strengthen the impact of overlaid body text describing the impact of climate change. And if you don’t have the time (or talent) to produce your own movie clip, copyright-free footage is available through websites like Pexels and Videvo.
2. Perform a Reveal with graduated color.
Going back to the climate change example above, imagine a cartoon map of New York in grayscale. Now imagine each section of text transforms part of the city into full color, illustrating how many households would benefit from energy saving measures or environmental action. The city would end up blazing with color, potentially augmented with coordinated captions, arrows and breakout boxes.
Staggered image transitions are known as Reveals. Despite becoming commonplace in Shorthand presentations, they remain highly effective beside explanatory dialog. Reveals are great for telling individual stories, blurring out or darkening faces in a group photo while highlighting one person to emphasize who’s being discussed.
3. Take your own photos.
There are plenty of royalty-free photography websites, including Pixabay and Stockvault. However, these images may already have been published hundreds of times, becoming unremarkable through their ubiquity.
We all have decent smartphone cameras nowadays, and self-taken images will convey exactly the right message. You’re able to reshoot a scene until you’re happy with the results and edit each photo without breaching third-party Creative Commons Zero licenses. There are loads of online guides to effective photography, from framing and composition to lighting and filters.
4. Use two-column scrollmation.
It isn’t necessary to overlay text onto an image – they can exist side-by-side. The text could flow down one column while a static image (or a series of transitions) occupies a fixed location beside them. Similarly, an image might gradually migrate from one side of the screen across the text opposite, revealing further detail or adding a sense of scale to an image. A widening shot of a huge march would gradually increase the number of people on-screen, for dramatic effect.
This article was brought to you by Midphase, for shared hosting, cloud servers and 24/7 support visit our site here www.midphase.com