Building Sites

I’m learning how to build websites. I’ve previously learnt bits and pieces of HTML and CSS from free courses, and I even have some good books on it, but when I get near JavaScript, my brain starts to ache.

This time, with relatively few current life distractions, I’m not only hoping I can learn to bend my brain around JavaScript, but get very confident at structuring and styling sites.

On the whole, I’m not sure people find learning web languages and building sites very interesting. I suppose it seems dry, in the same way most of the world of IT is depicted as dry (except for hacking, which is obviously portrayed as very cool, you know).

However, I really like the fact that I can control+click on any site and have a look at how the audience side (the “front end”) was made and understand it, mostly, to some extent.

I’m not sure how likely or not it is that I’ll be able to find work building websites for people at some point, though I’d like to. But once I’ve levelled up my knowledge a little more, what I’m really interested in exploring is how to build immersive sites for story-telling, hopefully in odd, experimental ways.

Here are the websites I’ve made this week:

(Click the images or headings to go to the sites.)

Aria Oslo, Artist

This multi-page site uses an invisible grid to layout all the components.

Sally Hart Photography

This is such a simple site, but I really love it. It has a great parallax effect, which you sadly can’t experience on mobile.

The Pen is Mightier

As above, you’ll only get to see the parallax effects of this site on a desktop or laptop. I like it!

Patio Restaurant

A slightly more complicated single-column website.

Source Industrial Design

This was a deliberately difficult, pernickety task for us to do on our own. Almost every section has a different width or margin. It was a conundrum.

Furneaux's Flowers

This is a multi-column site. It’s nice! But when it comes to being device responsive, all of those columns must reduce down to one. Trying to go through the site and work out when it begins to ‘break’ is a lengthy process.

Lola's Cookery School

Oh my God. I was doing this on my own and started getting very confused with different elements and then with all the different aspects of making the site mobile-responsive. I think I got there.