musicmusic’s foobar2000 stuff first appeared in 2003, as a website to host components I had written for the foobar2000 audio player. Hosted on free web host Lycos, it’s address was members.lycos.co.uk/musicf. The site’s design was simple and unassuming:

The original site, hosted on Lycos

The site was simply an HTML file that I had manually crafted. Some CSS was embedded in the page (curiously, partly in all caps and partly lower case), as well as a small bit of JavaScript that hides and shows the Text writer change log on click. Also of note is that the site had a textured background.

In 2004, the design of the site was slightly refined, and the textured background removed. The CSS had been moved to a separate file. The site also moved to a non-free shared hosting provider, with the URL changing to music.everywebhost.com. It is also interesting to see that Album list panel was open source at this point; I recall that the source code of the original Album list component (that it was based on) was part of the foobar2000 SDK.

In early 2005, nested green boxes were introduced to organise expanding content about Columns UI. In April 2005, the nested boxes were dropped and the site was spread over multiple pages. Each page shared a common side menu; PHP was introduced to achieve this. The site also moved to music.morbo.org, after the owner of morbo.org kindly offered to host my website following some problems with my previous host. By the end of 2005, the site looked like this:

Blue was out, and lilac was in

This colour scheme and design would prove to be short-lived. In early 2006, the site underwent a more radical refresh:

This minimalist design is one of my favourites

Colours were banished, and the Verdana font was dropped in favour of a return to Tahoma. PHP was also now used to calculate file sizes for downloads.

In October 2006, the site moved again, but this time to a dedicated domain name: yuo.be. This would become the site’s long-term home. The site also remained largely unchanged in design until 2009, where some of the minimalism was lost:

Two-toned boxes were now in vogue

In 2015, the site moved to AWS and CloudFlare, and underwent a Bootstrap-themed refresh:

The site had a sticky header

'foobar2000' was dropped from the name of the site (largely because of a lack of space). This has remained the design of the site, until now.

Rethinking the site: a new design

Back to basics

I’ve, once again, redesigned the site. The new site opts for simplicity, and focuses on logically organised content.

The change in design also coincides with a more radical change in technology. The new site was built using site generator Gatsby and CSS framework Bulma. The site is written using React, GraphQL and Sass – but compiles to HTML, and works without JavaScript. (But, if you do have JavaScript enabled, it magically turns into a single-page application.)

As a result, PHP is no longer used on the site, and caching works well out of the box. And, despite the more static nature of the content, I was able to retain the display of download file sizes.

The new site is live at yuo.be and it’s source code has been published on GitHub. Feel free to leave feedback in the comments or on GitHub. (If you encounter any problems with the new site, the old site is temporarily available at old.yuo.be.)