TAGS

Excite & delight your website visitors with autoplay video backgrounds

Being passionate about design, we’re excited to let you know that Rocketspark’s website builder now supports Video Stack Backgrounds. With this new design feature, along with the option to add colour and image backgrounds, you now have the option to display a video as a backdrop on your Rocketspark website.

Video background is one of the biggest trends in web design at the moment and it has been one of our most requested and anticipated features to date. Moving pictures on a website is widely considered to be an engaging and effective way to showcase your business, build trust, retain curious eyes and improve conversion rates.

Popular examples for using video backgrounds:

  • Environment and location: Entice your website visitors to come and visit by showcasing your venue or region in an exciting way with awe-inspiring drone footage or a walk-through tour.
  • Your brand story: Build trust and give your guests the warm fuzzies with a visual teaser of what they can expect upon arrival at your restaurant, hotel or b&b—show your staff welcoming customers or preparing delicious food for them.
  • Projects and portfolios: Use a time-lapse video in a Video Stack Background to show one of your recent projects coming to life—perfect for architects, builders, manufacturers and more.
  • Products and merchandise: Use animation backgrounds on your beauty and fashion industry website to retain interest and show design diversity.

How to use Video Stack Backgrounds effectively?

An eye-catching looping Video Stack Background can really complement your website, draw out emotion and encourage your visitors to learn more and move through your site enthusiastically—and of course, click on your call-to-action prompts!

Create a great first impression with a striking video background on your website. 
Add a video background with/or without a heading right at the top of your website landing page/s so it’s the first thing your visitors see—instantly captivating your website visitors and encouraging them to want to know more. 

Keep your visitors attention while they navigate through your website.
With Video Stack Backgrounds you can add subtle video bursts a little further down on your website to keep your visitors engaged while they have a look around.

Highlight your call-to-action buttons and links. 
Use contrasting text colour from the colour of Video Stack Background. For readability, we recommend making sure there’s enough contrast between your Video Stack Background and the content overlaying it (if you’re overlaying content on top of your video that is).

Show design diversity with slow-moving animation.
A great way to add interest to your website is with a punchy animation video background, whether you’re using this element as a key part of your web design or just a small interesting decoration for variety.

How do Video Stack Backgrounds work?

A Video Stack Background is just as it implies—so on a Rocketspark website this means that you now have the option to add a video background, and set your video background to reach the full-width of a screen and fill the entire browser window—giving you a modern looking website. 

You’ll need a YouTube or Vimeo account. If you don’t already have one, it’s fast and easy to set one up and in most cases won’t cost you anything. Once you’ve uploaded a video to your YouTube or Vimeo account, it’s a matter of simply copying the video link and pasting it into your Rocketspark Dashboard—this is the backend of your website, where all your website design controls are located.

Another thing to note about a Video Stack Background is that your video will autoplay on your website without sound. According to a launch statement from YouTube, autoplay increases users’ engagement time. Previewing videos helps your viewer make more informed decisions about whether they want to watch your video, leading to longer engagement with videos they then choose to watch.

Video backgrounds that look great on mobile devices

With Rocketspark’s mobile-specific design controls, you’re able to edit your text and buttons to suit the mobile screen. Once you’ve got your design looking beautiful on a desktop, you can simply hop over to your mobile design controls to make any required changes (size and colour changes for text and buttons), for your mobile website. View the help guide to see How to adjust text to suit a mobile screen.

How Video Stack Backgrounds differ from embedded videos?

An embedded video, where the video appears in a ‘block’ on your website is more suited to content like interviews and online tutorials where sound is important. Your website visitor is in control and can view the video at their leisure—interaction is encouraged with the very familiar play icon button.

When you add a Video Stack Background on your Rocketspark website, you’re able to layer elements like text and call-to-action buttons on top. A website with lots of thoughtful content can be great for SEO (search engine optimisation). We’ve added some layout ideas in our Inspiration Gallery of visual effects you can achieve—design that can also help boost your Google ranking and increase the chances of converting your web visitor to a customer.

Grab attention, tell your story and build trust with a Video Stack Background

A Video Stack Background is so effective because, well it’s almost impossible for website visitors not to ‘notice’ a video that’s autoplaying on a website.

With a short, high quality looped Video Stack Background you can evoke a sense of excitement and anticipation in your website visitors the minute they arrive on your site—encouraging them to stay a while and take a look around.

For design ideas check out our Inspiration Gallery.

Head to our help guide to learn How to add a video stack background?