Adding an Image to Blackboard

Adding images to your content is an easy and simple way to illustrate a point or help explain a complex idea.

Before you start

Important Point

You need to establish the correct display size for the image before uploading to Blackboard. You can use a simple image editor, for more information see our pages on Editing and Saving an Image Using Microsoft Windows Paint or Editing and Saving an Image Using Mac OS X Preview.

The process of uploading

At a minimum you will need to

before clicking the Insert button.

Additionally, you might also


Uploading an image from your computer

To add an image select the 'Insert/Edit image’ button (No.1) in the content editor.

This opens a new browser window with three tabs ('General’, 'Appearance’ and 'Advanced’) and a variety of options for choosing and controlling the display of the image. The window opens on the 'General’ tab by default.

How to set the general settings when adding an image to Blackboard

Select 'Browse My Computer’ (No.1). This will open a file system dialogue box, use this to navigate to the location of the file on your computer. Select the file and select 'Open’. The 'Image URL’ (No.2) field will be automatically filled in for you and a thumbnail of the image will appear in the window.

Reusing an Image in Blackboard that has previously been uploaded to your module

If you wish to re-use an image within a module, you do not need to upload it twice. Instead after selecting 'Insert/Edit Image’ in the content editor, select 'Browse Organisation’. This opens up a list of all the files in your module. Browse the list until you find the image you are looking for, then select the radio button at the start of the row (No.1). Then select 'Submit’ (No.2). As with uploading an image the 'Image URL’ field will be automatically filled and a thumbnail of the image will appear in the window. Insert an 'Image Description’ and select 'Insert’.

How to insert a previously uploaded image into Blackboard Content

Accessibility Issues – Creating ALT text

How to set the general settings when adding an image to Blackboard

Next you need to create an 'Image description’ (No.3). This is for the benefit of visually impaired users who rely upon assistive technology. These users will hear your description of the image, rather than see the image. Therefore, you need to provide an appropriate, accurate description which will provide an equivalent user experience for visually impaired users.

If an image is used solely for decoration, do not use alt text as this just causes unnecessary clutter for someone using a screen reader. For easy to foolow information and examples take a look at the RNIB Accessibility guidelines for alt text

For more detailed guidance on best practice in writing an 'Image Description’ (also know as 'alt text’ or 'alt’) you might like to read these articles:

Accessibility Issues – What to do if your image is particularly complex

If your image is very complex, for example a scientific diagram, then a description of it may be too long for the 'Image Description’. In this case you may need to provide a 'Long Description’ (No.2). You can find this under the 'Advanced’ (No.1) tab. The 'Long Description Link’ field allows you to enter a link to the 'Long Description’. This means you will have to have uploaded it to a website first.

How to set the advanced settings when adding an image to Blackboard

Having written your 'Image Description’ you can ignore 'Title’ (No.1); using this can have a detrimental effect on usability for users requiring assistive technology. Finally, select 'Insert’ (No.2).

How to finish inserting an image into content in Blackboard

Controlling the appearance of your image

The 'Appearance’ tab (No.1) provides you with extra control over the display of the image.

How to set the appearance settings when adding an image to Blackboard

'Alignment’ (No.2) allows you to control how the image aligns to the text. By default 'Not Set’ results in a left alignment, this is the best option, though you may find reason for a different alignment occasionally. 'Dimensions’ (No.3) allows you to control the size of the image.

You should set the size of an image outside of Blackboard. You can use a simple image editor, for more information see our pages on Editing and Saving an Image Using Microsoft Windows Paint or Editing and Saving an Image Using Mac OS X Preview. If however, you would like to present an already uploaded image at a smaller size you can define the size here. Always keep the 'Constrain Proportions’ (No.4) option checked, and never use this option to make an image larger; this would result in a loss of image quality and legibility.

The 'Vertical Space’ and 'Horizontal Space’ (No.5) options allow you to create a margin around your image defined in pixels. 'Border’ (No.6) will create a black edge around your image of the width defined in pixels. 'Style’ (No.7) requires a firm understanding of CSS (Cascading Style Sheets) and should be ignored.

The 'Advanced’ tab contains options that should be ignored, except for the already discussed 'Long Description Link’.