Sourcing, Preparing & Managing Assets

beginner20 min

Learning objectives

  • Source royalty-free written copy, stock images, icons and video
  • Prepare assets: trim video, compress files, select appropriate file formats
  • Manage assets using a logical folder structure and naming conventions

Learn

B2 — Asset sourcing and management

Sourcing responsibly

Never use written copy, an image, icon or video you don't have the right to use. Royalty-free sources like Unsplash, Pexels, Flaticon, Font Awesome and Pixabay provide assets free to use — but always check the specific licence (some still require attribution). Written copy you haven't written yourself needs the same care — either write it yourself (Lesson 11) or only use text you have a genuine right to reuse.

Preparing assets for the web

Large, unoptimised files slow a site down badly. Before adding any asset to your build:

  • Compress images — aim for well under 1MB each without visible quality loss (tools: TinyJPG, Adobe Express).
  • Trim and compress video — keep clips focused and under roughly 50MB (tools: HandBrake).
  • Choose the right format — JPEG for photos, PNG for images needing transparency, SVG for icons/logos that need to scale without blurring.

Managing assets

A messy asset folder makes a build slower and more error-prone. Use a logical folder structure and consistent naming conventions, e.g.:

assets/
├── images/
│   ├── img_home_hero.jpg
│   └── img_product_tshirt.jpg
├── video/
│   └── vid_welcome.mp4
└── icons/
    └── icon_basket.svg

Consistent, descriptive names (img_home_hero.jpg, not IMG_4821.jpg) make it far easier for you — and anyone reviewing your evidence — to find the right file quickly.

Task

Source, compress and organise the assets your site map says you'll need, following the naming pattern above. This is direct evidence for B.P4/B.M4/B.D2.

Log in to track this lesson on your progress dashboard.
Log in