How to use space efficiently

Space is a very important design element. It’s not just emptiness. You can use the space inside the content area to separate and group information.

Do’s

  • Put space before and after the page title.
  • Put space above the heading.
  • Put space between paragraphs.
  • Put space into lists.
  • Put space around images.
  • Put space around buttons.

Don’ts

  • Don’t put space between the heading and the text.
  • Don’t put space between the instruction and the list.

Related links

Advertisements

Change the header image

Replace the sample header images and the other images on your theme with your own images. The header image can be a photo or just a logo and a tagline on a plain background.

To find an image you have the following possibilities:

1. Take a picture

Real-life images create a high visual interest. Users are attracted to images that show real-looking people doing something they are interested in. Let’s say you offer Hawaiian hot stone massages: an image showing you giving a hot stone massage to one of your clients creates much more visual interest than the image of hot stones.

Good image quality is very important for your website. This is why hiring a professional photographer for a shoot can be worthwhile.

If you want to take the pictures yourself take a look at these sites:

2. Search for images

Be aware of copyright infringements when using images on the web. You can search for licence free images or pay for them.

Avoid using obviously stock art images like the famous smiling woman with headset. Try also not to use busy images with poor contrast between the background and too many objects.

Sources for licence free images:

 Sources to buy cheap images:

3. Create your own image

If you want to create an image yourself or insert a logo with tagline inside the header image you can use an editing tool like www.pixlr.com/editor.

Related links

How to choose a good page header

Some templates use a graphic image on the page header. It’s part of the site’s brand identity and you will need to change it.

Do’s

  • Use a colourful image or words on a plain background.
  • Choose an image with one single object on a simple background.
  • Use a high quality image with high contrast between the object and the background.
  • Crop the image instead of overly reducing it.
  • When using images with people use smiling people looking directly at the camera.
  • Use real-life images instead of ones that are obviously stock art.

Don’ts

  • Don’t use clip art.
  • Don’t put text on photography.
  • Choose an image that reflects the content of your website.
  • Don’t use a busy, bold or dramatic header image that competes with the rest of the design.
  • Don’t make the file larger than 50 KB.
  • Don’t make the header higher than 200 pixels.

Related links