2

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?

Superhuman
  • 61
  • 7
  • The ones I see that could have issues there are Assistive Technologies (AT), particularly the ones aimed at people with sight issues. Some may not need to load an image at all, and thus may have no incentives to support/implement the `srcset` attribute. [According to the specs](https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element:represents-8), an without an `src` but with an `alt` attribute "represents the text given by the alt attribute", i.e for AT this is not an image but really just text. Should specs look at `srcset` too? Maybe, but currently they don't. – Kaiido Mar 09 '23 at 02:05

2 Answers2

0

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.

Nicolas Hoizey
  • 1,954
  • 1
  • 17
  • 24
0

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.

Rob
  • 14,746
  • 28
  • 47
  • 65
  • 1
    Does not really answer the question "does it serve a purpose?" Honestly I'm not sure why the specs are asking for `src` to be required when as OP notes a set `srcset` will already have all that this attribute offers. IIRC the specs need a big rewrite in that area anyway. – Kaiido Mar 09 '23 at 10:56
  • @Kaiido He says he doesn't want to use it cause he doesn't support older browsers. He also asks why the MDN page says it's required. I answered both questions and am steering him away from wanting to not use it and make his markup invalid. – Rob Mar 09 '23 at 10:59
  • This only answers "Why does the MDN page says ...?", but it doesn't provide a sensible reason. Now the question becomes "Why do the specs say ...?". There must be a reason for this rule exists, this reason is what they're disputing, and once again I think they have a point. – Kaiido Mar 09 '23 at 11:24
  • There is a very related [specs issue](https://github.com/whatwg/html/issues/4478) on how the specs haven't been updated correctly for `srcset`. – Kaiido Mar 09 '23 at 11:40
  • @Rob After rendering the page, the browser doesn't even add its own src attribute to the img element in the DOM, it is left as is. It's not like the browser correctly render the image because it's smart enough to autocorrect like it does for when you add a table without tbody element. – Superhuman Mar 09 '23 at 12:49
  • @Superhuman browsers don't add markup. You are seeing how it handles your markup – Rob Mar 09 '23 at 12:57
  • @Rob I don't understand how some web pages can be totally accessible by web browsers, screen readers, sighted users, deaf users, visually impaired users, mobile users, desktop users, tv users, Internet of things users, search engines and yet considered invalid by the W3 HTML validator. I think a better tool is needed when that happens, not a better website. – Superhuman Mar 09 '23 at 12:57
  • @Rob I know but it's like virtually adding it since what you see is how the page is interpretated by the browsers. I know it doesn't change the source code. – Superhuman Mar 09 '23 at 13:00
  • @Superhuman Browsers are required to do the best they can with the markup given to them. If you supply them invalid markup, then you are letting them guess at your intentions. Do not let browsers guess your intention. – Rob Mar 09 '23 at 13:39