UCL Moodle Guides
Navigation
General links
Moodle Home
Quickscan Dyslexia Screening Tool
Keywords: image, graphic, alternative text, context, visualisation, visual, infographic, graph, chart
Each of the text editors available in UCL Moodle, Atto the Moodle default text editor and TinyMCE, enables the use of images as part of the entered text. Moodle accepts .jpg,.png,.svg and .gif formats.
Images can be used for aesthetic purposes and this also helps people to identify particular areas of a course, so can make it easier to navigate. They might also be used to visually illustrate complex ideas and information using diagrams, graphs, and charts. Whenever you are using images, please remember to follow accessibility guidelines (as explained in the 'Meeting the baseline' section below).
Images can be added by anyone while using the text editor.
The UCL Connected Learning Baseline suggests the following for Structure :
The Accessibility category suggests that you:
U se the toggle switch to turn 'Edit mode' on and edit the type of page element (Topic summary, Text and Media area, page etc) where you will get a text editor.
You can either drag and drop an image, copy and paste or upload one. Please see below for further instructions. If you are using high quality images, you can compress your images first so they don't slow down the page load.
Decide where you want to place your image (roughly), place the cursor there and paste your image.
If you want the image to be centred, then click the 'Align centre' or 'Centre' button (depending on the Editor you're using) to move the cursor to the centre of an empty line and thus ensure that the image is centred.
Click on the 'Insert or Edit Image' icon in the toolbar; the Image Properties window appears.
Course images help to make pages distinctive and orientate students in Moodle spaces.
Further help
Further guidance on the default Atto Text editor is available from Moodle Docs.
TinyMCE editor guidance is also available from Moodle Docs, if you are using the non-default text editor.
If you find any inaccurate or missing information you can even update this yourself (it's a communal wiki).
If you have a specific question about the tool please contact the Digital Education team.
If the image is not purely decorative, you should describe it so that visually impaired people can understand what the image contains, as this will be read out to them when using a screen reader. it also means that if the image doesn't load, the web browser will display this description instead. You will be prompted to enter a description when you add the image to a Moodle page. This description is known as alternative (or 'alt') text. When thinking of suitable alt text think "What does this image portray?" and then write this in a short (max 140 characters) description.
- None at this time.
- None at this time.