This week I would like to talk about picking a vibrant colour scheme for your website. Sometimes the idea of colour coordination can be terrifying, but picking a few, interesting colours that go together can really make your website pop.
Next month I am doing a couple concerts with my pianist, and I wanted to make a website for us to advertise the event. I knew I wanted to go with a fall theme, since we would be doing the concert in November. When I thought of fall, I automatically pictured a park near where I live, covered in yellow, red, and brown leaves, and surrounded by trees.
My first step was heading over to www.colourlovers.com to find some possibilities for my colour palette. This website is an awesome resource for finding inspiration when it comes to great colour schemes. In the search bar, I typed in “green, yellow, brown”, knowing that I wanted to include these colours in my website to generate a fall feel. I could also have searched “fall” as a keyword, which would have brought up palettes with that particular word associated with them.

I found a palette I really liked that had yellow, brown, and green in it. I clicked on it, and was able to copy the hex numbers for each one (hex numbers are a universal way of identifying colours on the web). My next step was to head over to my Bandzoogle account and launch the Custom Style Editor (Design & Options > Change Site Style > Custom Styles). I thought that green would make a great background, so I set my background to that colour by going to the Page control, clicking colour, and pasting my green hex code into the # box.

Next, I thought brown would make a great content area colour, with yellow as the choice for my font, so that the text would really pop. I opened the Content control, turned colour to “On”, then pasted my brown hex number into the colour box. Under Text, I set the colour of my font to the yellow from my palette by pasting the hex number into the colour box at the bottom. I wanted the menu area to look like a part of the background, so I opened the “Menu” control, turned Colour on, and pasted in my green hex code. Finally, I thought my Menu buttons and Header text should match, so I set them both to Chonker as my font type (one of my favourite fonts), and pasted my yellow hex code into the Text colour for both of them. My website was starting to shape up! And for a finishing touch, I set the “roll-over” colour of my menu buttons to a deep red using the colour picker.

I was pretty happy with how things turned out, and just wanted to finish up the site with some custom photos. My pianist and I headed to the park, and my girlfriend took some pictures of us amongst the trees. Then, using www.picnik.com, I designed a custom header with one of the photos we took (you can refer back to Stacey’s blog post last month for some great tips on doing this). I uploaded my newly created header by clicking the Header control, and clicking “Choose Header Image”. I clicked Save, and had my final product.

Why not share this with your friends?
Build a stunning band website and store in minutes
- Promote your music on your own unique website.
- Sell music & merch directly to your fans. Keep 100%.
- Grow your fan base with built-in marketing tools.
Free 30 day trial, no credit card needed.

Comments