Firefox and the Wizard of Ogg

by Saul Edmonds

“Rubiks Lodge” by G.LAudio, Firefox and HTML5.

One of the positive features of HTML5 is a simpler system for adding audio to your web page or blog.

No longer is flash, quicktime or WMP required. With HTML5, audio is directly embedded into the web page : no third party plug-ins or javascript needed.

Adding an audio file is now as easy as adding an image.

Who or What is Ogg Vorbis?

Firefox, however, will not play MP3s. Firefox requires all audio files to be converted to the .ogg format. The Ogg Vorbis digital audio compression format is similar to MP3. It is considered to be superior to MP3 in that encoding into .ogg produces effectively smaller file sizes of higher sound quality. Additionally, the .ogg format is patent and royalty free.

Get with Started with Audio in Firefox

HTML5 audio is pretty simple. Follow these steps to get started in Firefox:

  1. As Firefox 3.6 will only support .ogg, all MP3s will need to be converted. Switch Audio File Converter Software is one example of an easy to use multi format audio file converter for PC and Mac. A basic version is available for free download
  2. Embed the audio tag in your code.
  3. <audio id=”player”></audio>
  4. Provide the source audio file:
  5. <source src=”audio.ogg”/>
  6. Play Sound
  7. You could autoplay the audio on load with a simple attribute autoplay like this:
  8. <audio id=”player” src=”audio.ogg” autoplay></audio>

Simple play and stop functions could be assigned as onclick event of buttons as follows:

  • To the play() function of the audio object:
  • http://document.getElementById(“player”).play();
  • To stop/ pause playing audio:
  • http://document.getElementById(“player”).pause();
  • Firefox has announced that it will continue to support only the .ogg format due to it being a patent and royalty free codec. As HTML5 is implemented we will undoubtedly become familiar to .ogg as an alternative MP3.

Contact Roundhouse Now! 
Book an obligation free consultation to find out more and learn how to leverage mobile technology to grow your opportunities and business revenue.

Saulke (1).png

Get to know Saul Edmonds & Roundhouse

As Creative Director & Roundhouse Founder Saul Edmonds has over 20 years professional design and digital experience. 

He is an expert on Brand, Website and App Development. He has worked with clients across all industry groups - including startups, small business, government and entrepreneurs - on projects of all sizes and budgets.

Saul and his team can help you grow your business and discover new possibilities with :

  • strategic brand design
  • web design & development
  • app design and development 
  • digital marketing 
  • creative engagement 

    Saul Edmonds believes that every project begins with a story. 

    Saul and his team offer a one to one, tailored service - where he works with you closely to develop innovative solutions that will take your business to the next level. 

    Find out how Saul can help you turn your ideas into reality.

    Book an obligation free consultation with Saul Edmonds for ideas and strategies to take your business or project to the next level. Click here to arrange your booking.

    Phone : +617 1300 727 749
    email : us@roundhouse.cc

    • Learn about our web design here.
    • Learn about our app development here.
    • See our brand and logo portfolio here.

    Connect with Saul Edmonds on Linkedin here or Google+ here.
    Connect with Roundhouse on Google+ here.

    by Saul Edmonds