You are here

Audio files on website.

Advice on everything from getting your music heard to setting up a label and royalties.

Audio files on website.

Postby Still Vibrations » Mon Apr 23, 2018 9:44 am

I was wondering if anyone had any recommendations about putting recordings on websites? Most people who work in the same field as me embed Soundcloud files in their web pages. Here are my thoughts but can't decide what I should do:

If most people use Soundcloud then people who visit my site will be used to embedded Soundcloud recordings therefore I should also do the same.

If a Soundcloud audio file is embedded the page takes longer to load - relevant on iPhones etc. - even if the visitor has no intention of listening to the recording (which in my case are sometimes 10 minutes or more duration).

An embedded Soundcloud audio file dumps 18 cookies, including 2 from Facebook, in the user's browser, even though it is a page on my website - I don't use cookies.

The web host I use gives plenty of storage space to host all the audio files I intend using. Previously I used Amazon AWS which also worked fine.

I think it is probably better to use the HTML5 audio tag but unfortunately without JavaScript it is difficult to make it look attractive and even then the Soundcloud file is more attractive.

Any thoughts really appreciated!

Ian
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby desmond » Mon Apr 23, 2018 10:00 am

Storage space may not be an issue if you are serving audio files from your own site, but bandwidth might be, depending on your levels of traffic and the bandwidth on your hosting plan.

The soundcloud players require a certain amount of setup content (js/css etc) but so will any "nice" audio player (for example, if you use a jquery plugin or something similar. The audio is not embedded in the page, it's streamed once you click "Play" - if the user doesn't play any audio, the only extra content they have downloaded is to instantiate the soundcloud plugin/code.

Basically, if you want to avoid modern web standards such as js, cookies, plugins etc, then you can't have all the interface niceties that go along with it - you might as well use a regular audio download link and let the user decide what to do with it.

It's really your choice as to how to best present your content in a way that's acceptable to you and that's most useful to your visitors.
User avatar
desmond
Jedi Poster
Posts: 7802
Joined: Tue Jan 10, 2006 12:00 am

Re: Audio files on website.

Postby Still Vibrations » Mon Apr 23, 2018 10:23 am

Many thanks for your reply Desmond. I want to make my website as minimal as possible, it is mainly for information. Fortunately I would also be well within the bandwidth allowed - unless something suddenly changes.

I have never been able to work out how visitors use my website. For instance I wrote a search programme and it was only used about once a month, and then for an arrangement that had a prominent link on the home page. Someone else asked me for programme notes even though they were on my website. I think people skim so simple is better, except of course they will recognise a Soundcloud image.

I avoid Javascript (although it was the first language I learnt), cookies and plugins and only use PHP when it really does make things easier and more consistent.

The other consideration is some of the works are really long so I don't think people listen to them. They are more inclined to ask for a copy of the score.
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby desmond » Mon Apr 23, 2018 10:52 am

Still Vibrations wrote:I have never been able to work out how visitors use my website. For instance I wrote a search programme and it was only used about once a month, and then for an arrangement that had a prominent link on the home page. Someone else asked me for programme notes even though they were on my website. I think people skim so simple is better, except of course they will recognise a Soundcloud image.

It can often be difficult to predict how people will use features you provide.

Other than using a certain amount of experience to guide design, a more practical approach is to actually monitor what people are doing on your site, and draw insights from that. Google Analytics is one way of doing this, but again if you want to avoid any extra things, then you might be limited to log analysis tools, which can still give useful information.

Once you get an understanding of how people are using the site, where they are coming from, what they are looking for, and how easily they find it (or not) can help guide an iterative process to move and change things to best support both you and your users' goals.

You may have the best feature imaginable on your site, but if people aren't using it, it's relatively pointless. If people aren't finding it, then redesigning to make it more integral might help. If people don't understand it, then perhaps better descriptions, or examples or something might help make people see the value in it. Or perhaps the typical site visitor is expecting something completely different than you're providing - again, it really starts wth trying to understand the goals of the site visitor, and see whether you are meeting them adequately...
User avatar
desmond
Jedi Poster
Posts: 7802
Joined: Tue Jan 10, 2006 12:00 am

Re: Audio files on website.

Postby Still Vibrations » Mon Apr 23, 2018 4:00 pm

I was thinking of doing something like this. It doesn't use JavaScript (which I don't hate btw), Soundcloud embedding, or cookies. Also the sound file doesn't load until the play button is clicked.

http://issoundfiles.s3.amazonaws.com/test2.html

It looks good on Safari and Firefox but indifferent on Opera. Any advice/opinions/suggestions appreciated. (I don't host my website on Amazon S3, this is just for demonstration purposes).
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby desmond » Mon Apr 23, 2018 4:03 pm

That seems to be a solution that ticks all the boxes for you. :thumbup:
User avatar
desmond
Jedi Poster
Posts: 7802
Joined: Tue Jan 10, 2006 12:00 am

Re: Audio files on website.

Postby Still Vibrations » Mon Apr 23, 2018 4:18 pm

Many thanks for your quick reply Desmond. You are right of course about how people use websites. The problem is there is so much music - my old site had something like 58 pages - that it is difficult to organise. I have studied others who work in the same field as me and there just does not seem to be a simple solution.
I like writing web coding but my last site was overly complicated. PHP is used to validate the contact form, to clean up input and make sure only the contact form on my website is used. Although I also enjoy JavaScript I don't validate forms anymore as it is almost impossible to validate an email address. You can check an email address contains "@" and "." but not a misspelt address which is the most common error.
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby blinddrew » Mon Apr 23, 2018 4:19 pm

Thumbs up for not having auto-play. I think you should keep the programme notes text pretty much as is. ;)
User avatar
blinddrew
Frequent Poster (Level2)
Posts: 3959
Joined: Sat Jul 04, 2015 11:00 pm
Location: York
Ignore the post count, I have no idea what I'm doing...

Re: Audio files on website.

Postby Still Vibrations » Mon Apr 23, 2018 4:49 pm

blinddrew wrote:Thumbs up for not having auto-play. I think you should keep the programme notes text pretty much as is. ;)

I daren't!, The occasional person will read them and think I'm into 1960s experimentalism (which I am of course) and print them verbatum in the programme.
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby desmond » Mon Apr 23, 2018 4:55 pm

Still Vibrations wrote:as it is almost impossible to validate an email address. You can check an email address contains "@" and "." but not a misspelt address which is the most common error.

You don't really need to re-invent this particular wheel, there are a number of approaches to solve this and you don't even need to code it yourself, there are JS or PHP (or whatever) routines you can use for this sort of thing...

A good email validation routine will use regexp matching and will handle 99%+ of all cases - if you really concerned, then you can do a round trip email validation with the user but I find that's usually a step too far unless you are validating something like user account generation.

In any case, how to organise and present data, sometimes a lot of it, is a key design constraint of a web site, and that's where I'd start before writing a line of code... Some problems are best solved in the conception phase.. :thumbup:
User avatar
desmond
Jedi Poster
Posts: 7802
Joined: Tue Jan 10, 2006 12:00 am

Re: Audio files on website.

Postby job » Mon Apr 23, 2018 5:10 pm

Looks cool to me, although your background colour on .sound1 is displaying as #f9f9f9 on Windows (FF and edge), when i guess you were going for #fff?
job
Regular
Posts: 277
Joined: Wed Aug 03, 2016 2:12 pm
 

Re: Audio files on website.

Postby Forum Admin » Mon Apr 23, 2018 10:28 pm

The AWS example does not work well on Safari on my iPhone in portrait view — it overlaps the last para of text — but rights itself in landscape view.

Bear in mind around 35% of web traffic is now mobile users.
User avatar
Forum Admin
Moderator
Posts: 2786
Joined: Mon Jul 21, 2003 10:00 pm
Location: A studio deep in the fenlands of Cambridgeshire, UK
SEARCH SOS - 10,016 quality articles: www.soundonsound.com/search/all
Gear videos, tutorials, studio tours: www.soundonsound.tv

Re: Audio files on website.

Postby desmond » Mon Apr 23, 2018 10:37 pm

Forum Admin wrote:The AWS example does not work well on Safari on my iPhone in portrait view — it overlaps the last para of text — but rights itself in landscape view.

A bit of responsive css should be able to sort that out...
User avatar
desmond
Jedi Poster
Posts: 7802
Joined: Tue Jan 10, 2006 12:00 am

Re: Audio files on website.

Postby Still Vibrations » Tue Apr 24, 2018 7:50 am

Forum Admin wrote:The AWS example does not work well on Safari on my iPhone in portrait view — it overlaps the last para of text — but rights itself in landscape view.

Bear in mind around 35% of web traffic is now mobile users.

Many thanks for pointing that out, I forgot to add:
Code: Select all
<meta name="viewport" content="width=device-width, initial-scale=1.0">


I have now tested it with the Google mobile friendly test and it passed.

In my case I think considerably more than 50% of visits will be from iPhones so it is essential it works on iPhones. Fortunately on my template page I automatically include that meta tag. However I don't want to give a direct link to my website because it is still in the early stages so the address is not publicised.
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby Still Vibrations » Tue Apr 24, 2018 7:55 am

job wrote:Looks cool to me, although your background colour on .sound1 is displaying as #f9f9f9 on Windows (FF and edge), when i guess you were going for #fff?

I want the background to be a light grey - #f9f9f9 - but on Opera the dark grey player appears as white for some reason. I don't have access to a Windows computer so when I have completed more of the website I will go to an internet cafe to check it.
I have been thinking of buying a Windows laptop to check things. Also there is some Windows only software I sometimes need to use.
Still Vibrations
Regular
Posts: 163
Joined: Wed Nov 29, 2017 10:02 am
"It’s like the whole thing about punk is that you do brilliantly ambitious things very stupidly."  - Maria Damon (I think!)

Re: Audio files on website.

Postby James Perrett » Tue Apr 24, 2018 1:24 pm

Still Vibrations wrote:I have been thinking of buying a Windows laptop to check things. Also there is some Windows only software I sometimes need to use.

This is where a virtual machine or two can come in handy...
User avatar
James Perrett
Moderator
Posts: 7039
Joined: Sun Sep 09, 2001 11:00 pm
Location: The wilds of Hampshire
JRP Music - Audio Mastering and Restoration. JRP Music Facebook Page

Re: Audio files on website.

Postby Alvvays » Thu Apr 26, 2018 9:57 am

I guess you can do it with knowledge of HTML or Javascript. I'm not expertised in it, just give a thought
User avatar
Alvvays
Poster
Posts: 15
Joined: Wed Mar 21, 2018 1:19 pm


Who is online

Users browsing this forum: No registered users