When I taught myself to play the guitar 10 years ago, I had no inkling that one day I would be making websites for a living. Back then, the biggest revelation, though, was nothing to do with websites. It was finding out how playing an instrument was as much a matter of body coordination as driving, cycling or swimming.
A number of things need to come together when attempting to play a song on a guitar. First, I have to know the shape and sound of each chord. Then, I need to be able to switch between them seamlessly. Next, I have to make sure I only strum the strings corresponding to the chord in question. Not to mention a strumming pattern that I must follow: down, up-down, down-up.
Oh, and if I want to sing along, all of those things have to happen in the background.
Sounds nothing like crafting a website, does it? True, web design doesn’t demand body coordination. But it does need many different elements to come together harmoniously. Otherwise, it risks becoming a discordant nightmare for a visitor.
Just like butchering your favourite song.
How different elements of a website jam together
Melody, rhythm and harmony are the cornerstones of beautiful music. Now imagine my surprise when I realized these were the very same elements I was reaching for while building websites. We might call them by different names, but the principle remains the same—bringing disparate elements together in a pleasing whole.
Melody and design
Technically speaking, melody is a sequence of notes. But a random set of notes is just noise. What makes it music is putting the notes together in a way that is pleasant to the ear. For composers and songwriters, getting the notes just right is crucial to living on in their audience’s mind.
In a webpage, the “melody” lies in its design. It’s about how the colours, layout, content and media come together. Research suggests that a website has anything from tens of milliseconds to a few seconds to hook a visitor and make them stay.
This means, in web design, first impressions count for everything. If you miss that window, your visitor will bounce. That’s like a music lover walking into a concert, and walking out immediately after hearing the first note.
Rhythm and functionality
Rhythm is “the pattern of sounds and silences…[which] creates a sense of movement”. In music, rhythm is all about the timing. It’s about the ebbs and flows of the melody, in a way that sets the mood of the piece. Rhythm is what makes you tap your foot and makes your heart soar.
In web-design-speak, rhythm translates to functionality. It defines the interactive and dynamic parts of a website. It anticipates a site visitor’s needs, takes their hand, and leads them there.
Rhythm supports melody, just like functionality supports design. Without rhythm, melody would be meaningless. Similarly, a website that looks stunning but doesn’t work is useless. Just as the best musical compositions touch listeners in specific ways, a well-crafted website is an experience.
Harmony and narrative
The dictionary definition of harmony is: the quality of forming a pleasing and consistent whole. This is pretty much what all art is about, whether music or visuals or books. And dare I say websites too?
Since I build websites for authors, I think a lot about the narrative journey that I’m creating with my design. The best art connects with people by telling stories that touch the heart. A website too tells a story; it invites you in, gives you a reason to stay, and bids you farewell with a promise to come back again.
You know you’ve got it right when everything falls in place just so. That’s when you achieve harmony.
Summing it up
Since I started my guitar-ing adventures, I have had very little desire to play for anyone except myself. But what I have learnt is, when those notes escape from my guitar, they no longer belong to me. It doesn’t matter that I don’t play for an audience, the music still forms part of the world around me.
Website design is a bit like that too. My clients often believe that a website is for them, to let visitors know about them, their work, and so on. My job is to show them how, a website really exists for their readers or prospective readers.
After all, what’s the point of good music—or a beautiful website—without an appreciative audience?