Using Video In Your Adobe Muse Website
Why use video?
When it comes to rich content-based website design, use of video is a consistent vital ingredient. As design techniques evolve, designers must find new and interesting ways to incorporate video into their site designs to provide end users with the best experience possible.
One of the best things about video is that it is engaging; whether it be a subtle background or full feature, videos enhance the overall viewing experience for a website. When you go onto a website with a wall of text are you engaged? Chances are you’re hitting the back button immediately. This is because text alone simply isn’t always engaging enough for your audience. Video on the other hand makes your audience want to stick around, which is, of course, good for conversion rates.
The use of video has many other advantages for your website, not only in appearance, but also in an increased SEO ranking and improved conversion rates. In addition, video provides a visual representation of what your company stands for, leading to increased trust from visitors. What’s not to love?
Video Encoding – Best Practices
One challenge with video is that there are many types of file formats – about 32 different video extensions to be precise. So which one is right for your website? And what is the right way to encode it? This can be a little overwhelming and if the wrong extension is chosen your video may not work at all. It’s important to make sure that you’re encoding your videos correctly from the start.
- For Adobe Premiere users: Premiere is a fantastic program for editing and exporting videos. What’s even better is that it has the correct video codec built right into it! We recommend using the H.264 codec when exporting your video. Generally, if you export your video using the default settings on YouTube or Vimeo it will apply this codec for you as well.
- Video format convesion: If you are unable to use a program like Premiere, don’t worry! There are many free alternatives out there, such as HandBrake. This program allows you to convert your video into the correct format for your website. We recommend exporting under a YouTube pre-setting.
Why Webm?
Quite often, customers ask why they need a Webm version of their video. For many, Webm is an unfamiliar format and not even an export option within most video editing software.
The simple answer is that Webm allows for cross-browser compatibility. By using the Webm file format in addition to mp4 you can guarantee that no matter what browser site visitors are using, your video will always play.
Here are a few helpful tools for Webm format conversion and exporting:
- fnord: Exporting Webm is not a built-in option in Adobe Premiere, however, a third party plugin such as fnord allow you to export directly from the export window in Premiere.
- Miro Video Converter: Allows you to convert your video into the Webm format.
Example Video Widgets
Across the Muse platform and beyond there are a variety of video widgets, allowing you to achieve a wide range of effects. Here are a few examples:
- Fullscreen Background Video – Display a video behind your content (widget by MuseThemes)
- Carousel Video Gallery – Play videos directly within a slider widget (widget by MuseThemes)
- embed.ly – Embed any video from the internet
- JW Player – Upload and embed videos
Stunning Video Examples
We searched the web for some engaging multimedia sites that incorporate video in clever ways. Take a look at these for some inspiration on your own site.
-
Dick’s Sporting Goods: The Dick’s Sporting website hits you with a fullscreen video as soon as you land on the site. It creates a strong visual impact and clearly represents the purpose of the site.
- NAF: Arguably one of the most multimedia-rich sites on the web, the NAF site incorporates amazing visual tricks. This enhances the users experience and makes them feel like they are truly interacting with the site.
We hope this article has given you a good overview of how to incorporate video into your Muse website design. As usual, please share your feedback and any questions you may have. Cheers!
Comments
Can you make tutorials that explore designing on the mobile layout? Specifically, video use for mobile design.
Since we can easily obtain reasonable quality videos for just $5 there is little reason not to use them.
We have a few and will add more as we get time
Do they help? G+ seems to like them and we see the videos listed in our search engine results