I don’t know why, but music has always been a bit taboo when it comes to websites… In the early 2000s putting some audio on auto-play was the most ridiculed thing you could do in web design (for no rational reason, in my opinion).
But now, since we have thousands of sites that embed videos, all put on auto-play, the topic of audio comes back with a lot less people hating on it.
Also, webmasters and site owners have realized that putting a video or some music on a website just for the sake of it isn’t such a good idea, so right now we can mainly encounter media files that we either came to see in the first place or that help our overall experience.
In my opinion, that was exactly the problem with audio in early 2000s. It wasn’t about the fact that music was playing in the background. It was about the fact that music was playing in the background just for the sake of it, and had nothing to do with the actual content. Nonetheless…
Why would you want to include audio
I see 3 possible reasons here:
- When audio is the content. If you’re a musician or a podcaster then audio is the main form of content you want to share. No further explanation needed…
- When audio helps your content. Let’s stick to being a musician as our example here. If you have a site on guitar playing then you can include audio files presenting how a given technique of playing should sound like, or some backtracks for jam sessions, and so on. Essentially, this is where you use audio to make your main (written) content/instructions more understandable and usable.
- When audio is a bonus. Some bloggers like to provide multiple different forms of the same content. For example, if you record a video interview, put it on YouTube, embed it on your site, and publish it as a new post, you might also want to include an additional audio version, and a traditional transcript. That way your audience can enjoy the interview in any form they wish.
If you have some more ideas on possible reasons for sharing audio, feel free to shoot me a comment.
How to include audio in your blog
Since we’ve got the “why” part of the question covered, let’s move to the “how.”
There are two main ways of including audio:
- Publishing a simple download link.
- Embedding an interactive media player.
Download links are pretty straightforward so I’m sure you get the idea. By the way, check out the previous post on making a WordPress blog downloadable-media-friendly, should come handy here.
That leaves us with the second way – embedding audio straight into your posts.
This time, there are three main methods of embedding an audio file, and I’m sorry for giving you all these short lists here.
1. Using an HTML5 audio player
This is the simplest method. However, it tends to work differently for various installations of WordPress, various plugin combinations, and various themes.
But you can always give it a try to see how it plays out for you.
First, you need to host your audio file somewhere (more on that in a moment). The easiest thing to do is to upload it through the Media Library in WordPress.
Then you can use this new HTML5 tag (HTML editor in WordPress):
<source src=”song.ogg” type=”audio/ogg” />
<source src=”song.mp3″ type=”audio/mp3″ />
Your browser does not support the audio tag.
What’s nice about it is that you can use multiple sources and point them to different audio formats. This way you can make sure that every browser finds a format it can play.
The audio tag has some additional attributes. You can find out more about it here: HTML5 <audio> Tag.
As I said, it may or may not work for you, depending on your theme, installation, or multiple other reasons… So here’s a better idea:
2. Using a plugin
Surprise, surprise. I’m, sure you were not expecting plugins being one of the solutions here…
Anyway. There are quite a lot of them available in the Plugin Directory, so for this list, I’ve chosen only the ones that are updated and compatible with the newest versions of WordPress.
There are always some minor (or major) differences between the plugins, so trying them all out and then settling for one that does its job best is advisable.
Here’s the list (ordered by popularity):
- Haiku minimalist audio player – like the name says, a very minimalistic player with only a bunch of features.
- Audio – the plugin actually has no settings at all. You just get to use the [audio] shortcode.
- Audio Tube – very cool plugin (highly customizable), lets you embed just the audio from any video on YouTube.
- CodeArt – Google MP3 Player – another shortcode-based plugin, so to speak. Only this one is a little more advanced than the Audio plugin.
Actually, all of the above plugins provide a handy shortcode, so you can embed an audio file without the need of using the HTML editor. The only issue remaining is where to host your audio files…
The problem with hosting audio files
The easiest thing to do is to upload your audio files through the Media Library in WordPress. This, however, can consume your bandwidth very quickly if your audio gets popular.
Even though MP3 is the most popular audio format these days audio files are still between 3MB and 10MB large (and a lot more for podcasts). Just 1,000 people listening to your audio can result in consuming 10GB of your bandwidth.
Therefore, hosting the files elsewhere is a lot better solution. Amazon S3 sounds like a good idea, or any other content delivery network, for that matter. You can also sign up for cloud-based hosting.
In the end, your budget and scale will be the deciding factors here. These custom hosting solutions are always more expensive than standard hosting packages. However, providing your audio file to thousands of people will be significantly more expensive through a standard hosting plan than through a custom cloud solution, so keep that in mind.
That is unless…
3. Hosting your file at SoundCloud
SoundCloud is a service created specifically for sharing music online. It’s like YouTube for audio, in case you’re not familiar with it.
You can sign up for a free account, which will let you upload up to two hours of audio. For more, you can get one of the premium accounts.
SoundCloud offers many interesting features, and embedding is one of them. Apart from embedding single files, you can also embed full albums (SoundCloud calls them sets).
In the end, SoundCloud is the best way of including an audio file in a WordPress blog (in my opinion). Just like YouTube is the leader for video.
If you don’t want to add embed codes manually you can get a plugin called SoundCloud is Gold. It provides a lot of great features that let you customize the player and choose the tracks you want to play. Really worth checking out.
What do you think about audio and websites? Do you find it useful when your favorite blog publishes audio files?