Free advice: 0800 047 6777
0800 047 6777
Header Background

Use our Blog to keep your business performing online and increasing
its digital revenues

Top tips for choosing and editing your imagery: part 1

Choosing images is a crucial part of the design process. You need to think about the perspective of your images and how they fit with your design.

Good quality images are key to a professional-looking website. Images are extremely versatile. They can be used in a variety of formats to deliver context, information, and emotion that text alone struggles to convey. Later, we’ll go through some effective techniques to enhance your images, whether they were taken by you or a professional photographer.

Your subject needs to fit within your design. Take or choose pictures that support what you are saying on the web page. You can use all of the principles outlined below for your Trendzer website design, and almost all of these features – except image cut-outs – are part of the Aviary Image editor.

In this article, we’ll be looking at three of my designs to investigate how your image choices and editing can make a difference to your final website design.


Things you should think about:

Colour

Choose images with colours that match your design. This impacts the flow of your website and reinforces your chosen style. Use different coloured images for a high-contrast design, or sepia or black-and-white visuals for an authentic style. Below, I have colour-matched each image to coincide with the three different products shown:

  • Effects : Choose from a variety of effects and filters for your image.
  • Brightness : Change the overall image brightness.
  • Contrast : Alter the overall image contrast.
  • Saturation : Manipulate the overall image saturation.
  • Warmth : Adjust the tone of your image from cool blue to warm orange.
  • Splash : Make your image black and white or colour parts in.

Hero image with Colour variants


Space

Give your images and graphics space to be viewed properly. For example, don't try to cram an image that is better suited to portrait into a landscape space. This will look uneasy on the eye and may put people off reading your content. 

Choose images and create graphics that fit the space available. This focuses the audience and delivers information quickly and effectively. Here, I have used white space and cut-out images so that the main focus is on the object itself:

  • Crop : Crop a portion of your image.
  • Resize : Resize your image to the size you need whilst keeping the proportions.
  • Orientation : Rotate and flip your image.

Hero image with spaced out images


Shape

Use a consistent shape throughout a design. This works well especially when used as part of a wider brand. Images do not have to conform to the conventional 640x480 pixels usually used for landscape and portrait shapes online. Try circular, letterbox, or hexagonal shapes. A cut-out image is also an effective style for your design. Here, I have used a circle cut-out of each image to give variety to the layout of this design:

  • Crop : Crop a portion of your image.
  • Resize : Resize your image to the size you need whilst keeping the proportions.
  • Orientation : Rotate and flip your image.

Image cut out shapes


Overlay

Try overlying shapes, text, and images. This creates a high-impact graphic style with supporting text. Here, I have used a background image with text and image overlay to support two very different design styles:

  • Draw : Add doodle overlays to your image with a brush.
  • Text : Put text overlays on to your image with a text input box.

Text overlay on images


Subject

Think about the images you choose, take, and design. The subject of your images should reinforce what you are saying on the page and support the idea behind your design. Here, I have teamed an event catering website with images of rustic home-made dishes. These support the contact copy and enforce the company brand: test

  • Effects : Choose from a variety of effects and filters for your image.
  • Focus : Keep one part of your image in focus while the rest is blurred.
  • Splash : Make your image black and white or colour parts in.

Image subject

Join us again soon on the Trendzer blog for a range of design and imagery topics such as perspective, audience, and more!

Blog Categories

Want to find out more? Book a demo or a call back

Send us your details and we’ll call you at your earliest convenience.
Let us know if you’re interested in seeing a demo or just looking for a general chat about your options.

Call Us Free


When is it a good time to call?

There's no obligation to buy after your demo (it's free!) but we think you'll love it