Images are a hugely important part of website content. Articles with images get 94% more views than those without and the first image your viewership will see is the featured image on your post. It pays off to think carefully about how you use images in your content.
When used well, images can help improve comprehension by reinforcing information provided in the text. Images are memorable and stick with people in a different way.
Sourcing and Copyright
Where do we source images from?
Getty editorial library
Commissioned photography, by freelance photographers covering a certain issue.
Amnesty staff, members or supporters sometime take or provide photography.
Donated images from human rights defenders, friends and family, Amnesty members and local NGOs.
Regardless of the image source, any images you’re working with should be stored on ADAM: Amnesty’s Digital Asset Management System. This allows them to be shared for usage by the rest of the movement.
Copyright
We must have permission to use an image on any Amnesty International output. This will take the form of:
- A license from a photo agency or library.
- Permission / purchased rights from a photographer
- Creative commons license
- Donated to Amnesty Commissioned or taken by Amnesty staff.
How do I use the copyright symbol?
Our house style for the format of a copyright credit is to use the copyright symbol: ©.
Keyboard shortcuts
- Windows: Alt + 1069
- MAC: Option + G
Desktop applications
- Windows: Character Map
- MAC: Character viewer (Control + Command + Space)
Can I use images from people’s social media accounts?
Yes, BUT:
- You must ask permission from the image creator / owner.
- Or have evidence that you have made every effort to locate the image creator / owner.
- Be conscious the person who posted it may not have permission to use, or allow use by others. You can use a screenshot / embed the whole post.
How to embed a Twitter post in a WordPress post
- Insert a Twitter block.
- Copy the url to the Tweet.
- Paste url into the Twitter block and click embed.
Image content
Who or what is in the image?
When selecting an image from Getty, be conscious of who and what is in the picture:
- None of the images will have informed consent, so portraits or close up images of individuals should not be used.
- Images where an individual appears at a distance in a ‘general view’ of a location are permissible.
Responsible representation
It is important to be sensitive to what an image contains and how it might be perceived by an audience.
- We aim to present an accurate and balanced view of any individual, issue or event, where human dignity is upheld.
- Protect the security, rights and wellbeing of individuals portrayed.
- Do not use photos purely to shock or disturb. The visible reality of human rights violations should be depicted only where appropriate.
- Be conscious of any corporate signage, flags or symbols of political parties, potentially offensive or incendiary messages written on placards that might feature in an image.
The subjective nature of visual communications means we need to:
- Have awareness of the limits of our experiences and perspectives in relation to what an image can mean / represent to others.
- Show diversity without propagating racial or cultural stereotypes.
- Actively challenge and interrogate our decision making.
- Be open to other peoples opinions, and to discussing sensitivities around the use of material.
If in doubt, ask a colleague for a second opinion!
Distressing images
Images should be assessed on a case by case basis.
Pictures which show death or the physical effects of human rights abuses should only be used with legitimate reason (e.g. as evidence).If this is necessary, it should be an image in the body of the news post, not the featured image.
It may be necessary to proceed the image with a content warning. Any overly graphic aspects of an image can be blurred to reduce impact on viewers. Always seek advice from colleagues.
The death penalty team advises not to use any images of the methods used to execute people, e.g. nooses, needles etc.
How to add a content warning on an image in WordPress
Here is one way of creating a content warning over an image, using the slider block.
- Insert a slider block
- Un-toggle the show tabs option in the block settings.
- Click add slide to insert the first slide
- Add your content warning text into this slide.
- In the block settings, add a slide title (for reference) and select the ‘transparent’ background style.
- Click add slide to insert the second slide
- Add a slide title (for reference).
- Select hide content in the slide settings.
- Click set image and choose an image from the media library.
Wellbeing
Amnesty staff may be exposed to images of a graphic or distressing nature, and it’s important to recognize the potential impact of these images on yourself and the well-being of others.
- Prepare yourself as much as possible before viewing anything which might be of a challenging nature.
- Try to minimize the time you spend looking at images, take regular breaks to reduce long periods of time exposed to distressing content.
- If sharing distressing images with colleagues, forewarn them, share via a link or zipped folder to avoid immediate exposure.
- Seek support from colleagues or your manager if you feel impacted.
Featured images in WordPress posts
Importance of great featured images
- Unlike the images you add to the body of your posts, featured images will travel much further. From social media site shares to recent posts suggestion boxes, your featured images will be published in all kinds of places for potential audiences to stumble upon.
- Your featured image is the visual representation of your content, telling your users what they can expect. If the featured image is confusing or complex it may affect users understanding and engagement.
- If the featured image is confusing or complex it may affect users understanding and engagement.
Featured images: what doesn’t work?
- Text in images
- Text may be cropped out or too small to read in some screen sizes.
- Text isn’t recognizable by search engines or screen readers (inaccessible).
- The featured image won’t make sense in other languages.
- Maps as featured images
- Maps don’t tell a story the way photographs do.
- Instead, insert maps in the body of the post.
- Cartoons as featured images
- Unlikely to be banner-shaped
- Need contextualizing with a caption
- Cropping on different screen sizes may obscure meaning
- Insert cartoons in the body of the post
Featured images: what does work?
- High quality
- Works as a banner image
- Good representation of the story
- includes people
- Alt text
- Copyright
How to add a featured image to a post
- In the post settings sidebar, click set featured image
- Select the image from the media library
- Click set featured image to return to your post
Accessibility: alt text
It’s important to always add an alt text image description to every image you publish online.
This allows people using screen readers to consume the images on your post.
- Makes your post more accessible.
Image descriptions should:
- Be descriptive
- Use inclusive language
Find out more about web content accessibility in our Accessibility guide.
How to add alt text to a featured image
To add alt text to your featured image:
- In page settings, go to your featured image.
- Click on the image to open it in the media library.
- Add your alt text in the ‘Alt Text’ field.
- Click ‘set featured image’
How to add a caption on a featured image
To enable this:
- Open the Appearance settings on the post by clicking the little paintbrush in the top right corner. The ‘hide featured image caption‘ will be selected by default.
- Click the toggle to un-select it.
- The copy displayed in the caption is the ‘caption’ field in the media library.
- The caption will be displayed at the bottom of the featured image, on the left hand side, with the copyright on the right.
Other images in WordPress posts
Images
You may want to add other images or visual assets in a post to support the story you’re telling, e.g.:
- Images of people affected by the issue
- Satellite images to show evidence
- Maps
- Infographics
- Explainer video
How to add an image
- Use the forward slash or the block selector to add an Image block.
- Upload new image or select the image from the media library.
- Don’t forget to complete the descriptive Alt Text and to add the image credit in the description field.
Embedded content
Maps, charts and videos, hosted on other sites such as MapMe, Datawrapper, Infogram and YouTube can be embedded into posts.
It’s important to consider translation of these assets.
To embed graphs, charts and maps we can use the responsive iframe block. For videos we can use the YouTube block or Vimeo block.
Please note: content created on third party systems should always be created using Amnesty International licenses / accounts so that we have control over the content that is displayed on our site. For example, YouTube videos should only be embedded from Amnesty YouTube channels.
How to embed a video
- Click on the Block Inserter (+), or type /YouTube in a new paragraph and press enter.
- Copy and paste the url of the YouTube video into the block
- Click embed
How to use an iframe to embed visual content
- Click on the Block Inserter (+), or type /responsive iframe in a new paragraph and press enter.
- Copy and paste the iframe source url into the field.
- Click embed.
- Adjust the minimum height of the iframe in the block settings to ensure there is no scroll bar.
- Include an iframe title for accessibility.