Ada's project journal: A simple website in HTML

My name is Ada and I would like to create a simple coding project of a website on electronic music mixes. My background in coding and technology is limited. It is very standard and a little bit unusual at the same time. 

My background is very standard in a sense that I completed standard IT education (using Microsoft Office package and other WYSIWYG software), and then I learnt a little bit of HTML and CSS, courtesy of Code First: Girls and Free Code Camp London. My background is a little bit unusual in a sense that a number of my close friends are creatives, with activities ranging from DJing to web design. 

My limited abilities clashed with kind encouragement from friends who thought that a personal creative project would be interesting, especially a project related to electronic music, a passion me and my friends share. So this clash brought me to thinking that I need to learn more and that I could develop my knowledge with hands-on experience of building my personal project.    

So the idea is to create a simple website (currently without a name, I welcome suggestions!) which would host electronic music mixes from Mixcloud and some written and visual information on the content.

I want to explore an idea often present in discussions on electronic music, of storytelling. Storytelling is a vague concept which means many different things to different people. Very generally, it means that the whole long set of songs together “tells” a consistent “story.” But how do people do this? I would like to explore this question in two ways. One way is by mixing music and the other is by doing some research on the music and commenting on it, including information on who created what, why I chose that, what my inspiration was, whether there are any relationships between artists, etc. Storytelling is also present in visual arts and literature, and I would also like to explore how these types of storytelling in turn influence perception of the music itself.

In design of my website, I would like to cater both for people who only come for the music and for those who are like me, and are into both mixes and all the background information. 

I thought I could do that by implementing a solution which would be a twist on what I already do in real life. The way I work in general is to annotate articles heavily. In other words, I have the main text and use margins for extra info. I thought I could use the same principle for my website: have its core (mixes) and then add some extra information around it. 

But potentially, that would look messy, would be difficult to follow, and wouldn’t be too-user friendly.

So I thought the main information (what I called the "core") could be a brief intro on what my project is and the mixes underneath, while all the background extra information would be placed around the core but hidden and only visible when you hover over it. Compare with a screenshot of a fragment of my private microblog below. Using the hover option in CSS, I can hide private content and user might see it if they move their cursor around it. That way, I don't break the flow of my blog.

By separating mixes from other content, people who are only in for the music could get straight into the music while others could get extra information if they so desired. 

What is needed

To complete my project, I will need HTML, so I will take a course on HTML from Kalob Taulien, and to host my website, for which I will use advice from a tutorial by Samir Talwar on how to host websites for free using Github.

I would like to complete my website in a month and a half, preferably less if possible. During that time I plan to:

I would like to document my progress in a series of blog notes, so that by the end of the project I have a study journal / case study for future reference for other. I would also welcome feedback as I work through my project and keeping a study journal is the easiest way to inform people about my progress. 

What I would you like to get out of this project

I would like to get a deeper understanding of two great projects of technology: electronic music and a website.