For a small budget website project it’s unlikely that you’ll have to start from a blank white piece of paper – good news if, like me, you’re not blessed with much artistic talent.
If you’re using a CMS then you’ll probably start by selecting the template (usually called a ‘theme’) from somewhere like Themeforest that suits you best and modify that. Don’t be too taken in by the nice photos and colours when choosing a theme – it’s the features and overall layout that you need to find a good match for.
If you’ve gone through the checklist in part one then you should know what kind of site you’re building and what its requirements and priorities are.
Colours
Your website’s colours will probably be determined in some part by your logo colours and any palette that’s set as part of your branding or printed materials. If you don’t have such a palette (and most of the time you won’t) then I suggest you start off by looking at some predefined colour palettes on somewhere like Kuler. These have been put together by designer-type people who have a good eye for which colour goes with which.
Don’t be too tempted to go for a non-white background – it can make the text harder to read and you’ll find that it creates problems down the line when incorporating images into your design.
Also – bear in mind that digital media uses a RGB colour scheme whereas printed material uses a CMYK one. Needless to say they’re different, and that replicating the exact shade of red in your letterheaded paper isn’t necessarily a straightforward task.
Fonts
Again, unless you’re an expert typographer I think you’re better bowing to the expertise of people who are. Your font choice is a big design factor and getting the wrong pairing can make your site look tacky. You’ll normally have a sans-serif font for your body text and a more decorative font for your titles. Using more than three is likely to be a mistake.
There’s nothing wrong with using the common choices of Arial or Verdana here, or with sticking with the fonts used in your CMS theme. If you go for something more fancy then bear in mind that it will be harder to replicate in all your letters and printed materials if it’s not installed on everyone’s computer by default.
White Space
When you’re customising your theme, remember that empty space can be good space. Having a bit of breathing room around your image and graphics can help them stand out. Don’t fret too much about trying to get everything in ‘above the fold’ – that rule doesn’t really apply so much any more now that people will be accessing your site on a whole range of devices with vastly different screen sizes and resolutions.
Responsive Design
Speaking of all those devices… one of the biggest trends in web design in the last couple of years has been ‘responsive design’- whereby the layout (and sometimes the contents) of your site change according the to device they are being used upon. Most commonly this translates as ‘your website will look good and be easy to navigate on a mobile phone’.
These days you need a pretty good reason not to adopt some kind of reponsive design for your site – it’s only going to become more and more important. My advice would be to choose a ‘responsive’ theme from the outset – even if the look of it isn’t quite as nice and snazzy as some of the others you’ve seen in the theme galleries.
Accessibility
Accessibility is an especially important factor for some charity websites as their audience might be made up of a lot of people with visual impairments or learning difficulties. Even if your stakeholders don’t have particular issues in accessing web content, it’s important to make your site as ‘accessible’ as possible. It’s not just a legal obligation, but it makes good business sense as well. It’s quite a complex subject and accessibility is a spectrum rather than a simple matter of declaring whether a site is ‘accessible’ or not. Text size, colours, alternative content for images, keyboard/screen reader navigation are just some of the considerations. Some of them are free and easy to adapt whilst others might add a lot of time and expense.
eBook
If you’d like to delve a bit deeper into the principals of good design then check out the ebook version of Designing for the Web by Mark Boulton. It’s a good grounding in layout, colours and fonts.
