Labelling of images [suggestion for improvement of User Documentation]

[Schezeen Fazulbhoy]

Hi,I would like to introduce myself as Schezeen Fazulbhoy, a GSOD'19 aspirant. 

On going through the official user documentation (found at https://github.com/oppia/oppia.github.io/tree/master/pages), I happened to notice that the images present in these HTML pages did not contain an "alt-text", in addtion to not being visually labelled as well. 

Given below are a few suggestions I believe would improve Oppia's user documentation. If they do make sense, I would like to take it upon myself to publish them as an issue on the oppia.github.io repository and work on resolving them. Do let me know if implementing these changes would help!

Case 1:  alt-text missing

Alt-text, also known as "alternative text" or "alt-descriptions" are used within the <img/> tag in HTML code to describe the function of an image on a page. These are crucial and a highly important standard for good documentation. Alt-text helps improve accessibility and understandability. None of the images present in the Oppia user documentation contain alt-text. 

Example:

Given below is an image tag present in the CreatingAnExploration.html page:

<img src="static/images/libraryCreateButton.png" style="width: 100%;">

A better way to rewrite the same piece of code would be:

<img src="static/images/libraryCreateButton.png" alt="Library Create Button" style="width: 100%;">

The presence of Alt-Text has a lot of benefits. They are listed as follows:

1.  Helps visually impiared users understand what the image is trying to convey by merely reading its description

2.  Alt-tags will be displayed in place of their corresponding image if the image file does not load/takes time to load

 

Case 2: image label missing

It is not a norm or convetion to have a visual label under images found on the web. However, having a small tag/label under an image has a lot of benefits, especially those found in user-guides, manuals or tutorials. One of the major benefits of labelling a series of images found in documentation of this nature is that it makes it easier for the user to follow the steps/tutorial in a faster way. The user is thus not required the read the paragraph above the images that cite what the images are about in great detail. Instead, upon looking at the image and its corresponding label, the purpose of the image is easily conveyed. 

An image label comprises of two parts, the figure number and the description. Attatched is a file (oppia-image.docx) depicting the contrast between a labelled image and an unlablled image.

To summarize, labelling images has the following benefits:

1. Easy on the user's eyes: The user can understand what the image is trying to convey just by looking at the image and its corresponding label. He does not have to break the reading flow to understand what is happening.

2. Gives complete context to the image present in the document, citing its purpose and the information it is trying to convey.

3. Upon glancing at the document, gives the user a partial idea about the information present in the document.

4. Serialing images via 'figure number' gives the document more structure.

Thanks and Regards,

Schezeen Fazulbhoy

(Twitter: @schezfaz10)

[Vojtěch Jelínek]

Hi Schezeen,

this is really great analysis. Don't hesitate to create issues for these on GitHub and if you want to implement them!

Thanks,

Vojta

--
You received this message because you are subscribed to the Google Groups "oppia-sod-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to oppia-sod-disc...@googlegroups.com.
To post to this group, send email to oppia-so...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/oppia-sod-discuss/0b907898-6366-4520-8eaa-27dda8f57825%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Schezeen Fazulbhoy]

Thankyou, Vojta!

Currently working on a PR regarding the same. 

Regards,

Schezeen Fazulbhoy

To unsubscribe from this group and stop receiving emails from it, send an email to oppia-so...@googlegroups.com.