Show an image — practice exercise

What you'll be asked to do

1. 1.Show an imageexercise · easy · 10 min

   Add an image pointing at the sample star.

   Passes when: Add an image pointing at the sample star.

2. 2.Describe the imageexercise · easy · 10 min · practice plan

   Give the image useful alternative text.

   Passes when: Give the image useful alternative text.

3. 3.Set the sizeexercise · easy · 10 min · practice plan

   Give the image an explicit width and height.

   Passes when: Give the image an explicit width and height.

4. 4.A decorative imageexercise · easy · 10 min · practice plan

   Mark a purely decorative image with empty alt text.

   Passes when: Mark a purely decorative image with empty alt text.

5. 5.Lazy-load an imageexercise · medium · 10 min · practice plan

   Let the browser defer loading until it is needed.

   Passes when: Let the browser defer loading until it is needed.

6. 6.Fix the wrong attribute for the filebug fix · easy · 8 min

   Images point at their file with src.

   Passes when: Images point at their file with src.

7. 7.Fix the missing alt textbug fix · easy · 8 min · practice plan

   An image with no alt is invisible to a screen reader.

   Passes when: An image with no alt is invisible to a screen reader.

8. 8.Fix the size set with a stylebug fix · easy · 8 min · practice plan

   Give the image real width and height attributes.

   Passes when: Give the image real width and height attributes.

9. 9.Fix the alt describing the filebug fix · easy · 8 min · practice plan

   Alt text describes the picture, not the filename.

   Passes when: Alt text describes the picture, not the filename.

10. 10.Fix the wrong value for lazy loadingbug fix · easy · 8 min · practice plan

    Deferred loading uses loading="lazy".

    Passes when: Deferred loading uses loading="lazy".

Between them these tasks cover Images, alt text and Dimensions.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.