On this page:
“These days we can’t ignore the visual elements of writing for the web.”
When thinking about visual elements you need to consider both the images you use and how the entire piece looks on the page.
Visuals are essential elements of most public communications and are used for several reasons. They can make a piece look more appealing and engaging to potential readers - as a large body of continuous text can be overwhelming, making readers less likely to read it. Their use isn't just about making pieces of work more approachable and readable however, they are also great vehicles to communicate potentially complex disciplinary knowledge in a way that the public can more easily understand.
There are several reasons for adding visuals to public communication pieces:
- They draw in the reader by making the piece attractive and visually stimulating.
- They help the reader visualise your points.
- They illustrate your points to help backup your claims and reinforce your messages.
- They can communicate some information more effectively.
- They emphasise important points and promote recall.
- They break up the text making it more readable and accessible.
Visual elements can be divided into two types: visual evidence and visual devices.
Visuals can be highly effective forms of evidence to back up the points and claims made in your work. Some photographs can illustrate points more effectively than words; charts can make complex data more approachable; diagrams can show connections and infographics can illustrate data and show the connections between them.
These are visual elements that draw attention to particular points and/or make the piece more approachable/readable. Some can be images, such as icons acting as informative bullet points or header images drawing the attention of the reader. They also include a number of design elements:
- Columns prevent long line length making it more readable.
- White space and line breaks break up text and can be used to emphasise points.
- Borders and boxes make things stand out, as well as tidy up the text.
- Headings help with organisation and keep it visually interesting by putting text into sections.
- Pull quotes grab the reader’s attention.
- Bullet points give more white space, make the structure interesting, and points concise.
- Differentiating text – font, size, colour and style – make the text look more dynamic whilst emphasising specific words and phrases.
Make sure your images are of good quality
The should not be blurry, pixelated or distorted in any way. Blurring or pixelation usually comes from using an image that is not big enough - try using a reverse image search to find a bigger version of the same image. Another good tip is to make sure you use the corner handles when resizing images in all Office 365 apps - this keeps the aspect ratio of the image intact.
Spend time finding the right image
Don't just find the first image that vaguely meets your search criteria. Consider the messaging in the image - for example, are the people appropriately diverse? Also consider the colour scheme of your overall piece, is there an image that better fits in with this? (Or can you adapt your colour scheme to fit the image if it is perfect for your needs?).
Be careful how you mix image types
It can look unprofessional if you mix too many different types of image such as cartoons, photographs, icons and drawings. If images are doing the same job, then make them all the same type. For example, you can use a photograph in the background of an area and have a list of icons on top of it but you should not mix icons with cartoons in the same list.
Position them appropriately
If you are using visuals to back up your points, consider where you place them and how you refer to them in the text (if needed). More formal public communications (like some reports) may use figure numbers and captions and require you refer to them in your text as (see Fig 1) before you position the figure. Whereas, less formal pieces (such as magazine articles, blogs etc.) would just have a caption without a figure number and it is only the proximity to the relevant text that makes the connection.
Use Alt-text for accessibility
If your piece is digital, rather than print, make sure your meaningful visuals use alt-text to make your work accessible to those with visual impairments. Alt-text should summarise the image and the reason for its use; if it is there for decorative reasons this should be stated. In Office 365 you add alt-text by right clicking on the image and choosing Edit Alt-Text from the menu.
If you are using images designed for public communication, then any that you do not create yourself should have appropriate copyright status. We have a guide to accessing free resources, including sound, video and images, on our Digital Students SkillsGuide: Finding Free Resources.
Even if you use free image sites such as Flickr or Pixabay, you need to be aware of their licensing. When using images make sure you have the right to use them, check out our Licensing & Copyright Guide for information on Creative Commons and other licensing.
You can also search for images with Creative Commons licenses directly in a search engine:
Referencing and attributing images
Whilst academic referencing of images in the form of citations is not always needed on some public communications (like posters), you may need it in others (like magazine articles) or you may need to include references in a supporting document. Full details about how to reference images in different referencing styles can be found under the appropriate style of our Referencing Guidelines.
If an attribution is needed as part of licensing agreements, something like "image by XXXX" placed somewhere where it is obvious which image is being referred to, is all that is needed (if there is only one, it can go anywhere). You could also include where it came from i.e. "image by XXXX via Flickr. If the image has the Share Alike attribution then you should also show the Creative Commons license that is was shared under.
Image from Riesenspatz: Svenja Kirsch, Anna Lena Schiller,
CC BY-SA 4.0 via Wikimedia Commons