Details

      Description

      Issue
      Alt text - the alt text for each user's picture in the online user's block is picture of user's full name then a link next to it is the user's full name. The image is there for a visual representation that has no context to a non sighted user. The alt text for these images should be empty so a screen read just reads who is online by the link in the name.

      Standard Level
      WCAG 2 1.1.1 (A) http://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html

      Impact
      Moderate

      Example Link
      http://demo.moodle.net/

      Test Steps

      1. Add the online user's block
      2. Have a screen reader read the block.

        Gliffy Diagrams

          Activity

          Hide
          Michael de Raadt added a comment -

          Would it not be preferable to have a description of the image in the alt attribute?

          Show
          Michael de Raadt added a comment - Would it not be preferable to have a description of the image in the alt attribute?
          Hide
          Jason Hardin added a comment - - edited

          Alt text is supposed to contribute to the intelligibility of the page as an auditory or tactile reading experience.

          When the screen reader reads the online users block it will read as follows:

          Link image picture of sam student link sam student

          That doesn't seem intelligible to me and when the purpose of the link is for the user to view Sam student's profile page the alt text for the image and the link to the image get in the way of a auditory or tactile understanding of the block. I would even go so far as to recommend a title on the link that is more descriptive as to the purpose of the link.

          This occurs in other places in the Moodle interface like the gradebook where the picture of the student is right next to the student's name or in forum where the picture of the user is in the forum.

          Someone with more accessibility knowledge than I should weigh in here as this was not reported by Deque because the block was not enabled on the test site.

          Show
          Jason Hardin added a comment - - edited Alt text is supposed to contribute to the intelligibility of the page as an auditory or tactile reading experience. When the screen reader reads the online users block it will read as follows: Link image picture of sam student link sam student That doesn't seem intelligible to me and when the purpose of the link is for the user to view Sam student's profile page the alt text for the image and the link to the image get in the way of a auditory or tactile understanding of the block. I would even go so far as to recommend a title on the link that is more descriptive as to the purpose of the link. This occurs in other places in the Moodle interface like the gradebook where the picture of the student is right next to the student's name or in forum where the picture of the user is in the forum. Someone with more accessibility knowledge than I should weigh in here as this was not reported by Deque because the block was not enabled on the test site.
          Hide
          Rajesh Taneja added a comment -

          Patch works great Jason. I agree in this case alt and title should not go on image, as it is just for decoration and link is actually solving the purpose.

          [y] Syntax
          [y] Output
          [y] Whitespace
          [-] Language
          [-] Databases
          [y] Testing
          [-] Security
          [-] Documentation
          [y] Git
          [y] Sanity check

          Show
          Rajesh Taneja added a comment - Patch works great Jason. I agree in this case alt and title should not go on image, as it is just for decoration and link is actually solving the purpose. [y] Syntax [y] Output [y] Whitespace [-] Language [-] Databases [y] Testing [-] Security [-] Documentation [y] Git [y] Sanity check
          Hide
          Dan Poltawski added a comment -

          Hi Jason,

          I was discussing this with Sam and I think that this may not be the complete solution, i'll give the example of my online user profile on moodle.org:

          <div class="user">
            <a href="https://moodle.org/user/view.php?id=104159&amp;course=5">
               <img src="https://moodle.org/pluginfile.php/3288/user/icon/moodleofficial/f2?rev=461357" alt="Dan" title="Dan" class="userpicture" width="16" height="16">
            </a>
            <a href="https://moodle.org/user/view.php?id=104159&amp;course=5" title="2 secs">
               Dan Poltawski
            </a>
          </div>
          

          As you can see, there is an anchor element wrapping the profile picture and removing the alt text would then leave an anchor on the image without anything conveying what its doing. It looks like the full solution would be to wrap both the the profile image and the users name in the same anchor.

          Show
          Dan Poltawski added a comment - Hi Jason, I was discussing this with Sam and I think that this may not be the complete solution, i'll give the example of my online user profile on moodle.org: <div class="user"> <a href="https://moodle.org/user/view.php?id=104159&amp;course=5"> <img src="https://moodle.org/pluginfile.php/3288/user/icon/moodleofficial/f2?rev=461357" alt="Dan" title="Dan" class="userpicture" width="16" height="16"> </a> <a href="https://moodle.org/user/view.php?id=104159&amp;course=5" title="2 secs"> Dan Poltawski </a> </div> As you can see, there is an anchor element wrapping the profile picture and removing the alt text would then leave an anchor on the image without anything conveying what its doing. It looks like the full solution would be to wrap both the the profile image and the users name in the same anchor.
          Hide
          Jason Fowler added a comment -

          Good point Dan, will get that sorted ASAP. Thanks

          Show
          Jason Fowler added a comment - Good point Dan, will get that sorted ASAP. Thanks
          Hide
          Jason Fowler added a comment -

          Thanks for pointing that out Dan, all fixed now, and pushing for integration again.

          Show
          Jason Fowler added a comment - Thanks for pointing that out Dan, all fixed now, and pushing for integration again.
          Hide
          Dan Poltawski added a comment -

          Hi Jason,

          That line is getting really long now, is there any chance you could break it up a bit?

          Show
          Dan Poltawski added a comment - Hi Jason, That line is getting really long now, is there any chance you could break it up a bit?
          Hide
          Jason Fowler added a comment -

          Sorry bout that Dan,

          Hopefully thats the last of it.

          Show
          Jason Fowler added a comment - Sorry bout that Dan, Hopefully thats the last of it.
          Hide
          Dan Poltawski added a comment -

          Looks great. Integrated to master, 24, 23 and 22. Thanks Jason.

          Show
          Dan Poltawski added a comment - Looks great. Integrated to master, 24, 23 and 22. Thanks Jason.
          Hide
          Mark Nelson added a comment -

          Works as expected. Passing.

          Show
          Mark Nelson added a comment - Works as expected. Passing.
          Hide
          Eloy Lafuente (stronk7) added a comment -

          Many thanks for your effort, the whole Moodle Community will be enjoying your great solutions starting now!

          Closing, ciao

          Show
          Eloy Lafuente (stronk7) added a comment - Many thanks for your effort, the whole Moodle Community will be enjoying your great solutions starting now! Closing, ciao

            People

            • Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: