[Proposal] A "facultative" attribute for img

Hi everybody.

As an eco-friendly web developer, I always wonder how we can improve our work for the benefit of the environment and its users. Until recently, for example, we had to use JavaScript to defer loading images (popularly known as “lazy loading”). Now we can use the “loading” attribute natively, without any script, and browsers know what to do; this is great progress.

Today, I would like to propose a new HTML attribute to go further in this direction.

Background

A lot of images on the web are purely decorative, we all know that. These images, in particular those from image banks, are often dispensable, but consume bandwidth and contribute little to the user experience in the end, when they do not harm it.

Solution

What if we gave to developers a way to specify when a resource is dispensable without “breaking” the site?

Depending on the user configuration of the browser (and why not, ultimately, the quality of the available network), these images may or may not be downloaded from the server. We would then obtain a drastic reduction in the environmental impact of our online browsing while accelerating it.

This job could be done with a “facultative”

fbkkbklbebfpblkb

OR “optional” attribute.

clfgdffcgpglhmmp

Of course, this idea could apply to different types of resources.

What do you think ? (Thanks for reading)

2 Likes

Although not sure of the proposed implementation, I can see having the ability to mark an image as optional in news articles being useful for something like Firefox’s Mobile Reader View. I believe it currently removes all images in an article when some of them are critical to the article’s content and should still be shown.

Hey, as a huge Firefox fan :fox_face:, I know Reader a little; this feature can effectively isolate a significant portion of the content, but:

  1. It necessary to manually switch from regular page mode to reading mode, so the resources are already downloaded first.
  2. Some images in the article itself are preserved, although they may be optional.

The attribute I am proposing should act when the client requests a page (just like the “loading” attribute) to prevent any useless download from the server.

Even though English is my native language, I was unfamiliar with that use of “facultative,” and the spell checker in the browser I’m using does not recognize it.

We already identify decorative images with an empty alt attribute.

As a user of web sites, I may have opinions about the importance of particular images. But my opinions may be different than those of the site author. Do we envision designers marking most of their own work as optional?

Can this be inferred from an empty alt attribute?

<img scr="decorative.jpg" alt="">

If the alt attribute is empty, then the image does not convey any additional information and can be safely removed in situations where the user wants to conserve bandwidth.

I think it could but might be problematic outside of something like a “reader mode.” I don’t know how comfortable implementors would be with applying this same logic when users explicitly opt to save data or if they encounter a flakey network and want to intervene on the user’s behalf.

Maybe the term optional that I suggested as an alternative is more appropriate for this attribute?
As a French person, I could be wrong about the meaning of the word “facultative” :upside_down_face:.

I’m not comfortable with this idea for a good reason: the alt attribute already has its own use.

Let take a look to an example :

Imagine this image is used as a purely decorative introduction to a few words about stress.

EDIT JULY 27 : I reformulate : imagine this image introduces a few words about stress but does not add any value to the content it introduces.

Here is how we should add it.

<img src="image.jpg" alt="a woman in front of a screen" />

As we can see, the alt attribute is important to describe the content of the image and leaving it blank will be a bad thing for some audiences (like the blind people), SEO, and so on.

But we said it: this image is not necessary to understand the content of the page. And the alt attribute is already used wisely. So, we can mark this image as useless with:

<img src="image.jpg" alt="a woman in front of a screen" optional />
(or <img src="image.jpg" alt="a woman in front of a screen" facultative />)

The image in your example is not decorative. A decorative image is an image whose alt text is empty. If an image has alt text, it’s not decorative.

Purely decorative images are visual enhancements, decorations or embellishments that provide no function or information beyond aesthetics to users who can view the images.

See https://www.w3.org/TR/html51/semantics-embedded-content.html#a-purely-decorative-image-that-doesnt-add-any-information.

2 Likes

Would it not be the correct thing to do? Images with empty alt text are invisible to screen reader users. That’s already one group of people that is excluded from these images.

When people choose to preserve data, the browser should respect that preference and prevent loading of non-essential resources. If images with empty alt text don’t fall into that category, than we’re not treating screen reader users fairly.

2 Likes

Sorry, I should have been clearer. I think it would be the right thing to do, I’m just not sure if we could convince enough implementors to go for it. I’d love to be wrong though and I’m happy to help push for it, it makes total sense to me.

You are right.

Again, I misspoke, sorry :sweat_smile:.

What I wanted to say is that this image does not add any value to the content it introduces. (I edited my post)

It makes sense to me too (that’s obviously why I’m here).

The climate is changing, the use of digital technology is exploding, and the Internet is a major pollutant. A community is growing around eco-friendly website design. Soon, this way could become the norm. I really believe that now we can help developers build a faster, cleaner web with this kind of initiative.

We must also admit the possibility that the image does add value but the publisher omitted the alt attribute.

Sadly, this may be the majority of images on the Web today.

Wider adoption of technologies such as server-side parse-event streams (e.g. EXI) could save power and bandwidth with less breakage.

Similarly, content negotiation for image pixel size with corresponding cacheing moduiles for popular http servers might reduce bandwidth more than dropping some elements.

Final note - there’s no alt attribute possible for CSS background images, although these are often part of the main content. That would also be worth fixing as saying, don’t use background images when they are important, isn’t working.

1 Like