Ioanni Mitsakis June 8th, 2015

Best Practice: 30 Websites with Video Backgrounds

Video backgrounds are growing in popularity. Now with the first services offering HD videos for free commercial use popularity will increase further and faster. Pexels, known for its free imgaes, has entered the market that before had only had Mazwai as a source for free video material. Other than Mazwai where backlinks are mandatory, Pexels offers its material under CC0. While we will also show you the two competitors the focus of this article will be on best practices examples of video use as a header element or as a full-width background covering the whole viewport of your browser's windows..

Free Video Services

1. Pexels Video

pexels-free-stock-videos Pexels Video offers HD and Full HD videos for completele free of charge and use in commercial projects also. All material is licensed as Creative Commons Zero (CC0). You need not place any backlinks nor name the authors (but you still can, if you want).

2. Mazwai

Mazwai Stock-Videos Mazwai has quite a few high-grade videos in stock. These are all licensed under Attribution 3.0 Unported (CC BY 3.0). This means you'll at least have to name its authors. A correct backlink would e.g. look like this:
Video: Zuerich Airport by Niklaus Gerber/Mazwai.com, License: CC BY 3.0

Inspiring Websites with Video Backgrounds

1. Vimeo

Vimeo

2. Mahedine

Mahedine

3. Airbnb

airbnb

4. Dadaab Stories

Dadaab-Stories

5. Tool FNA

Tool FNA

6. Kickstarter

Kickstarter

7. Hangar

Hangar

8. Oh Land

Oh-Land

9. Art, Copy & Code

art-copy-code

10. MediaBOOM

mediaBOOM

11. Poolhouse Digital

poolhouse

12. Coulee Creative

Coulee Creative

13. Risk Everything

Beispiel

14. Joe San Clothing

Joe-San-Clothing

15. L'attrape rêve

Beispiel

16. Whiteboard

Whiteboard

17. BKWLD

BKWLD

18. Bienville Capital Management

Bienville-Capital-Management

19. Exponent

exponent

20. We are Spry

we-are-spry

21. Monsorro

Monsorro

22. Story & Heart

story-and-heart

23. De Haus

De Haus

24. Adidas

Adidas

25. sketchin

Sketchin

26. Todoist

Totoist

27. Somproduct

SomProdukt

28. Fresh Cotton

Fresh Cotton

29. Harvest

Harvest

30. Wim Vanhenden Internet Artist

Wim-Vanhenden

Conclusion

Websites with video backgrounds stand out from the crowd. Now is the right time to experiment with the new possibilities. Try using video in the header or as a hero area. Find the perfect recipe to create stunningly individual websites. And do it now, before everyone does ;-)

Related Links

Image by David Condrey from Pixabay

Ioanni Mitsakis

Ioanni Mitsakis is front-end developer at a major European automotive supplier and responsible for the look & feel of their internal cloud-based apps. As his employer works internationally with distributed teams world-wide, a rock-solid development foundation is what Ioanni aims for. He better should ;-)

5 comments

  1. Umm, this doesn’t tell me anything about how to make a video a website’s background. Would have been a nice thing to have on this page since it’s titled “Best Practice.”

  2. Although the websites listed here are really nice, you should have walked us through the process of making a video as a background.

  3. Nice collection.

    Not difficult to make a video background guys. Just use an extra div in html5. Check my site.

  4. background video take to much time when loading a site in such a Asian country where average speed is low but over all look-wise best for use in background video.

Leave a Reply

Your email address will not be published. Required fields are marked *