5 Rules For Using Audio/Video Media on Your Site

By  on  

I don't create many sites that feature multimedia. Most of my customers don't have a need for audio or video on their site but we occasionally get a request to add an advertisement or webinar. That said, I've scoured the internet enough to have seen good, bad, and ugly uses of multimedia on the web. The following are my guidelines for using multimedia on a website.

Avoid Autoplay

Autoplay is a touchy subject. From my experience, autoplay isn't the way to go. A user could enter the page and walk away from their computer. The volume on the user's computer could be too high or too low and the autoplay could blast them out before they can adjust their volume. Additionally, autoplay could be a waste of bandwidth. Unless you run a video site like YouTube or MetaCafe, don't use autoplay.

Always Give Stop, Pause, and Volume Controls

I've actually found myself on websites that autoplay media and don't provide stop, pause, and volume controls. Needless to say, not providing media player controls is a terrible practice.

Make the Media Player Easy to Find

There's nothing worse than hitting a page with a lame song or video playing and not knowing where the hell to turn the thing off. Place your media players in an easy to find area on your site. Burying this media player on the page will only guarantee that your user sets the record for quickest "back button" click ever.

Quality -- Everything or Nothing

I can't stand when a video or audio snippet is placed on a website to support an article but the media is of such poor quality that they actually damage the article's credibility. Provide quality video, even at the expense of load time -- I'll wait for something good.

Warn Users About NSFW Material

Unless your website is clearly NSFW as a whole, clearly label any audio or video "NSFW" (and definitely DO NOT auto play this material). Failing to warn users about NSFW material can get the in trouble at work or at home and that will make for one pissed off former user.

Recent Features

  • By
    5 Awesome New Mozilla Technologies You’ve Never Heard Of

    My trip to Mozilla Summit 2013 was incredible.  I've spent so much time focusing on my project that I had lost sight of all of the great work Mozillians were putting out.  MozSummit provided the perfect reminder of how brilliant my colleagues are and how much...

  • By
    Write Better JavaScript with Promises

    You've probably heard the talk around the water cooler about how promises are the future. All of the cool kids are using them, but you don't see what makes them so special. Can't you just use a callback? What's the big deal? In this article, we'll...

Incredible Demos

  • By
    Introducing MooTools LazyLoad

    Once concept I'm very fond of is lazy loading. Lazy loading defers the loading of resources (usually images) until they are needed. Why load stuff you never need if you can prevent it, right? I've created LazyLoad, a customizable MooTools plugin that...

  • By
    Introducing MooTools ScrollSide

    This post is a proof of concept post -- the functionality is yet to be perfected. Picture this: you've found yourself on a website that uses horizontal scrolling instead of vertical scrolling. It's an artistic site so you accept that the site scrolls left to right.

Discussion

  1. Is it a good idea to incorporate videos on blogs? I have seen so many people doing it but generally they fail to link them with the theme of the blog.

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!