New
New
Year 11
OCR

Images and links

I can build accessible web pages that include images and connect to other pages.

New
New
Year 11
OCR

Images and links

I can build accessible web pages that include images and connect to other pages.

These resources will be removed by end of Summer Term 2025.

Switch to our new teaching resources now - designed by teachers and leading subject experts, and tested in classrooms.

These resources were created for remote use during the pandemic and are not designed for classroom teaching.

Lesson details

Key learning points

  1. Accessibility is a design approach that ensures what is being created is usable by all, regardless of individual needs.
  2. Web pages use images to visually enhance and support the content being presented.
  3. Images on web pages can be made accessible using the alt attribute.
  4. Web pages can connect to other web pages using hyperlinks.

Keywords

  • Accessibility - consideration of design so that what is created is usable by everyone

  • Attribute - a characteristic or feature of an object that can be changed or adjusted

  • Hyperlink - a clickable link that takes the user to a specified location

Common misconception

If someone cannot view an image on a web page it can be ignored as text on the page will be sufficient.

Images are used in web pages to provide the reader with extra context. By not describing them in some way the reader might not understand the information in the same way than if it was viewed.


To help you plan your year 11 computer science lesson on: Images and links, download all teaching resources for free and adapt to suit your pupils' needs...

Pupils will have encoutered many uses of HTML in the world around them. Tailor the activities in the slides to best reflect the experiences pupils in your school will have had when using HTML-based technology.
Teacher tip

Equipment

Access to the Raspberry Pi Foundation's Code Editor or some other means of creating HTML files.

Licence

This content is © Oak National Academy Limited (2025), licensed on Open Government Licence version 3.0 except where otherwise stated. See Oak's terms & conditions (Collection 2).

Lesson video

Loading...

Prior knowledge starter quiz

Download quiz pdf

6 Questions

Q1.
What kind of software is used to view and interact with webpages?
text editors
web servers
Correct answer: web browsers
FTP clients
Q2.
What is the primary purpose of HTML?
Correct answer: to structure content on webpages
to style webpages
to host webpages
to secure webpages
Q3.
What is the term used in HTML to indicate where different elements of a webpage are located?
Correct Answer: tag
Q4.
Which HTML tag is used to create a paragraph?
Correct Answer: <p>
Q5.
Name one type of list used in HTML.
Correct Answer: ordered, unordered
Q6.
What is a hyperlink?
a text style
Correct answer: a clickable link to another page
a type of image
a web server

Assessment exit quiz

Download quiz pdf

6 Questions

Q1.
Match the terms with their definitions.
Correct Answer:accessibility,usability by everyone

usability by everyone

Correct Answer:attribute,a feature that can be adjusted

a feature that can be adjusted

Correct Answer:hyperlink,a clickable link that takes the user to a specified location

a clickable link that takes the user to a specified location

Q2.
Why is accessibility important in web design?
to increase loading speed
to enhance graphics
to improve SEO
Correct answer: to ensure usability for everyone
Q3.
What should a web designer provide to ensure that users who cannot see an image still understand its content?
a larger image
decorative borders
Correct answer: descriptive alt text
a colour filter
Q4.
What is required to correctly display an image on another webpage using HTML?
only the
<img>
tag
only an
src
attribute
the
<img>
tag and a
href
attribute
Correct answer: the `<img>` tag and an `src` attribute
Q5.
What attribute is used to make images accessible?
Correct Answer: alt
Q6.
Which HTML element is used to create hyperlinks?
<img>
<div>
Correct answer: `<a>`
<span>