Quote

We're also available for Custom Joomla Development

Hire us now
danyeld on Thursday, November 16 2017, 03:19 PM

Accessability Requirement

Hello,

Because of updates to the accessibility act, I have run a check on my site and found that the Banner Plugin which is generating a Javascript is not adding a proper ALT tag description. I have added ALT tag descriptions within the banners themselves, but it does not appear to pick them up. Here is the error

An 'img' element must have an 'alt' attribute, except under certain conditions. For details, consult guidance on providing text alternatives for images.

Line 256 HTML5
JavaScript added element:
<a class="nivo-prevNav"> </a><a class="nivo-nextNav"> </a>
JavaScript added element:

JavaScript added element:
http://www.vermeulens.com/images/banners/Science-and-Technology.jpg


257
JavaScript added element:
<a class="nivo-control active" rel="0">1</a><a class="nivo-control" rel="1">2</a><a class="nivo-control" rel="2">3</a><a class="nivo-control" rel="3">4</a>


258
       
  • Replied by admin on Saturday, November 18 2017, 05:21 AM · Hide· #1
    HI Could you let me know the URL of your site so I can take a look? The alt tag should be included in the slider (please have alook at the demo site : https://demo.templateplazza.com/joomla/index.php/responsive-banner-slider-nivo-default )
    Please post rating at the Joomla! Extensions Directory - http://extensions.joomla.org/profile/profile/details/264
  •  
  • Replied by danyeld on Wednesday, November 29 2017, 01:01 PM · Hide· #2
    http://www.vermeulens.com
    Also yours has the same issue.

    avaScript added element:
    <div class="nivo-directionNav"><a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div>
    JavaScript added element:
    <div class="nivo-caption" style=""><span>This is Responsive Banner Slider</span><br><i>A com_banner based image slider module from TemplatePlazza</i></div>
    JavaScript added element:
    <img class="nivo-main-image" style="" src="/https://demo.templateplazza.com/joomla/images/banners/responsivebannerslider/car2.jpg" width="940" height="437">
    </div><!-- end slider-wrapper/theme- -->

    189
    JavaScript added element:
    <div class="nivo-controlNav"><a class="nivo-control active" rel="0">1</a><a class="nivo-control" rel="1">2</a><a class="nivo-control" rel="2">3</a><a class="nivo-control" rel="3">4</a></div>
    </div><!-- end slider/nivoSlider -->

    190</div>


    Please go to

    https://www.powermapper.com/products/sortsite/checks/accessibility-checks/

    And there you will see for yourself.
  •  
  • Replied by admin on Thursday, November 30 2017, 02:16 AM · Hide· #3
    Hi I tried to open your website, and found that the image slider is already have the 'alt' tag.
    Please see this screencast :
    https://www.dropbox.com/s%2F5vtw35t27u12ftm%2Frbssr.mp4%3Fdl%3D0

    Then I checked the demo server with powermapper.com, it indeed said no alt tag, but actually the alt tag is there.
    I have no clue why this happened. Please see this screencast :
    https://www.dropbox.com/s%2Fc5r03hfwdetzh0a%2Frbsr2.mp4%3Fdl%3D0
    Please post rating at the Joomla! Extensions Directory - http://extensions.joomla.org/profile/profile/details/264
  •  
  •  
    Replied by danyeld on Friday, December 01 2017, 03:07 PM · Hide· #4
    Although the banner image has an ALT tag - The JAVASCRIPT that is written does not. (See below)
    JavaScript added element:
    <div class="nivo-controlNav"><a class="nivo-control active" rel="0">1</a><a class="nivo-control" rel="1">2</a><a class="nivo-control" rel="2">3</a><a class="nivo-control" rel="3">4</a></div>
    </div><!-- end slider/nivoSlider -->

    This is the same on both mine and your demo. It is this javascript that needs to be addressed.
Your Response
Please login first in order for you to submit comments