Images, text, audio, video and interactive elements used to build effective websites.
Website assets include all of the individual items that make up a site: images, text, icons, buttons, audio, video, animations and downloadable files. Choosing the right assets and optimising them is vital for usability and performance.
Website assets are the building blocks of a web page. They include logos, navigation icons, photographs, illustrations, background images, text content, buttons, audio clips, embedded videos, animations and downloadable resources such as PDFs.
Assets must be suitable for the target audience and purpose of the site, and they must also be stored in appropriate file formats and resolutions so that pages load quickly and look good on different devices.
These infographics summarise the main types of website asset and how to prepare them so pages look professional and load quickly on different devices.
The building blocks that appear on a web page.
Choices that affect quality, performance and accessibility.
For flash cards and mind maps, use our NotebookLM for this topic. It includes quick-fire revision prompts and visual links between key ideas.
📘 Open NotebookLM for Website AssetsDownload these slides for an in-depth look at the topic — perfect for revising key ideas and strengthening your understanding.
📑 Download Topic Slides (PDF)Use these games to practise choosing suitable assets, selecting formats and planning pre-production documents for web projects.
Choose the right planning document for each task and identify key components: mood boards, storyboards, scripts, wireframes and more.
Identify technical, symbolic and written codes in media examples and explain how they create meaning, impact and engagement.
Tackle scenarios on images, audio and video to pick the best file format and compression (lossy or lossless) for each client brief.
Inspect mock web pages for problems with images, filenames, resolution and optimisation for different devices.
Write your answers in the boxes below, then click Build & Copy AI Marking Prompt. Choose an AI tool and paste the prompt to get examiner-style marking and feedback.
Technique: Give a clear, specific example such as a logo, navigation icon, photo gallery image or embedded video.
Technique: Make one point about file size or loading speed, then explain how this affects the user experience.
Example structure: “Images should be compressed because… This means that…”
Technique: Describe what alt text is, then develop your answer by explaining how it helps users with screen readers and can support SEO.
Technique: Give two separate factors (e.g. relevance, resolution, tone, diversity, file size). For each one, explain how it affects the audience’s response or the performance of the site.
Technique: Cover choice of images, logos, icons, colour scheme, fonts and media, as well as file types, compression and responsive design. Reach a justified conclusion.
As you type, this will spot what’s missing for top-band answers.
