skip to Main Content

For example, the following image element with no src tag provides the last image link as the default image when all media conditions fails and load perfectly well in modern browsers. The alt text content will display correctly in case the browser fails to load the image.
I can’t think of a single case where using an src attribute will be useful here except to support old browsers.

  <img srcset="//cdn.glitch.global/8b425bca-2f6e-497b-baf5-8b951ea30edf/firefox_logo-only_RGB120.png 120w, //cdn.glitch.global/8b425bca-2f6e-497b-baf5-8b951ea30edf/firefox_logo-only_RGB400.png 400w" sizes="(max-width: 500px) 120px, 400px" alt="Mozilla logo">

If I don’t plan on supporting old browsers, is it really necessary to add the src attribute to img elements that already have srcset attribute. Why does the MDN page says the attribute is required when the image loads perfectly fine without it?

2

Answers


  1. Based on data currently available on https://caniuse.com/srcset there are still 3.45 % of users that don’t understand srcset/sizes.

    So I would recommend keeping src, as it’s not difficult at all, if you use one of the URLs from srcset.

    Login or Signup to reply.
  2. From the HTML standard

    The src attribute must be present, and must contain a valid non-empty
    URL potentially surrounded by spaces referencing a non-interactive,
    optionally animated, image resource that is neither paged nor
    scripted.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search