Know and understand that reducing the file size can be achieved by reducing the image resolution or colour depth

Topic 12 – Images: Reducing File Size and Basic Image Editing

Objective

Students will be able to:

• Explain how the file size of a digital image is affected by resolution and colour depth.
• Reduce an image’s file size by lowering its resolution or colour depth (without changing the compression method).
• Place, resize, crop, rotate, reflect, adjust brightness/contrast and order images or layers in a document.
• Identify appropriate file formats, extensions and the type of compression (lossless vs lossy) for a given purpose.
• Understand why optimisation is important for e‑safety and accessibility.

What Determines an Image’s File Size?

Three factors influence the size of an image file:

1. Resolution – total number of pixels (width × height).
2. Colour depth – bits required to describe the colour of each pixel.
3. Compression method – lossless (e.g., PNG) or lossy (e.g., JPEG). This note focuses on the first two because they can be altered without re‑encoding the image.

Resolution

Resolution is written as width × height (e.g., 1920 × 1080). The total pixel count is:

Total pixels = width × height

Reducing the resolution removes pixels, which directly reduces the amount of colour data that must be stored.

Colour Depth (Bit Depth)

Colour depth is the number of bits used for each pixel. Common depths are shown below.

^†Alpha channels are not required for the IGCSE/A‑Level exam; they are shown for completeness.

Calculating the Uncompressed File Size

For an uncompressed image:

1. Calculate the total number of bits:
   

   bits = total pixels × bits per pixel

2. Convert bits to bytes (1 byte = 8 bits):
   

   bytes = bits ÷ 8

3. Convert bytes to mebibytes (MiB) (1 MiB = 1 048 576 bytes):
   

   MiB = bytes ÷ 1 048 576

Remember that most image files you encounter are compressed, so the actual file size will be smaller than the uncompressed value.

Practical Example

Image: 1200 × 800 pixels (total = 960 000 pixels)

If the resolution is halved to 600 × 400 pixels (still 24‑bit):

Uncompressed size = (600 × 400 × 24) ÷ 8 = 720 000 bytes ≈ 0.69 MiB

Compressed JPEG would be roughly 0.25 MiB.

Advantages and Disadvantages

• Reducing resolution

  • Pros: Large reduction in file size; faster loading; lower bandwidth use.
  • Cons: Loss of detail; image may appear pixelated when viewed larger than the new size.

• Reducing colour depth

  • Pros: Very effective for graphics with few colours; retains sharp edges.
  • Cons: Colour banding; gradients can look posterised.

When to Use Each Method

File Formats, Extensions and Typical Colour Depths

Compression Methods

• Lossless compression – No image data is lost; the original can be perfectly reconstructed (e.g., PNG, GIF, BMP when saved uncompressed).
• Lossy compression – Some data is discarded to achieve much smaller files; quality depends on the chosen setting (e.g., JPEG).
• Choosing the right method depends on the image type: photographs usually use lossy JPEG, while graphics with flat colours often use lossless PNG‑8 or GIF.

Basic Image Editing Operations (Syllabus Requirement)

In addition to size reduction, learners must be able to:

• Place an image with precision – align to margins, use grid/guide lines, or snap to other objects.
• Resize – scale up or down while maintaining aspect ratio (or deliberately change it).
• Crop – remove unwanted outer areas.
• Rotate / Reflect – turn 90°, 180°, or flip horizontally/vertically.
• Adjust brightness and contrast – make an image lighter/darker or increase the difference between light and dark areas.
• Group / order images or layers – bring forward, send backward, lock, or group objects for easier manipulation.

Step‑by‑Step Procedure (Common Free/School Software)

1. Open the image in an editor (e.g., GIMP, Paint.NET, or Photoshop).
2. Place the image

   • Drag the image onto the canvas.
   • Use alignment tools (e.g., Align centre, Snap to grid) to position it precisely.

3. Resize (change resolution)

   • GIMP: Image → Scale Image…
   • Photoshop: Image → Image Size…
   • Enter the new width and height; keep the “maintain aspect ratio” box checked.

4. Crop

   • Select the Crop tool, drag a rectangle around the area you want to keep, then press Enter.

5. Rotate / Reflect

   • Rotate: Image → Transform → Rotate 90° CW/CCW (or arbitrary angle).
   • Reflect: Image → Transform → Flip Horizontally / Vertically.

6. Adjust brightness/contrast

   • GIMP: Colors → Brightness‑Contrast…
   • Photoshop: Image → Adjustments → Brightness/Contrast…

7. Change colour depth

   • GIMP: Image → Mode → Indexed… → choose “Maximum number of colours” (e.g., 256).
   • Photoshop: Image → Mode → Indexed Colour… → select the desired palette size.

8. Group / order layers

   • In the Layers panel, drag layers to reorder, or right‑click → Group Layers.
   • Use Bring to Front / Send to Back for single objects.

9. Save the file

   • Choose an appropriate format (see table above).
   • For JPEG, adjust the quality slider to balance size and visual quality.
   • For PNG‑8 or GIF, ensure the colour‑depth reduction step has been performed.

10. Check the new file size (right‑click → Properties). If it is still too large, repeat steps 2–8 with slightly lower values.

e‑Safety & Accessibility Note

• Large image files consume more bandwidth, increase loading times and may exceed data limits for users with slow or metered connections.
• Optimising images improves page‑load speed, reduces data costs and makes digital content more accessible for learners on mobile devices or low‑bandwidth networks.
• Always keep a high‑quality master copy before optimisation, in case the image needs to be re‑used later.

Key Points to Remember

• Uncompressed size = (pixels × bits per pixel) ÷ 8 bytes.
• 1 MiB = 1 048 576 bytes (use this when converting to megabytes).
• Reducing resolution cuts the number of pixels; reducing colour depth cuts the bits per pixel.
• Both methods can be combined, but always review the visual quality after each change.
• Choose the file format, extension and compression type that best suit the image’s purpose.
• Remember the basic editing operations required by the syllabus – place, resize, crop, rotate/reflect, adjust brightness‑contrast, and manage layers.