Web Accessibility fix

forty

Hi i test homepage and i get error that i think is from template form offcanvas and or ACM
When i disable all offcanvas position modules and all ACM modules error disapears.
It is about fancy box see image.
I need a fast fix or advice to fix it
Check it https://wave.webaim.org/report#/https://kousis-underwear.gr/en/
Thanks

forty

And a fix for w3.org validator.
Images filenames will be fixed by me, i need help for other errors... login module and offcanvas cart, any template override fix?

Error: The only allowed value for the type attribute for the style element is text/css (with no parameters). (But the attribute is not needed and should be omitted altogether.)

From line 101, column 2; to line 101, column 31

le=no"/>↩	<style type="text/stylesheet">↩		@-w

Error: CSS: width: device-width is not a width value.

From line 106, column 32; to line 106, column 43

 { width: device-width; }↩	<

Error: Bad value /images/virtuemart/product/resized/BeFunky-collage (4)_1980x2640.jpg for attribute src on element img: Illegal character in path segment: space is not allowed.

From line 445, column 146; to line 445, column 342

10207319"><img  class="featuredProductImage" border="0"  loading="lazy"  src="/images/virtuemart/product/resized/BeFunky-collage (4)_1980x2640.jpg"  alt="Sloggi Men Start  Movember H Short  C2P 10207319"  /></a><d

Error: Bad value button for attribute type on element a: Subtype missing.

From line 980, column 2; to line 980, column 159

d-cart">↩	<a class="btn-cart off-canvas-toggle" id="head-cart-dropdown" type="button" data-pos="right" data-nav="#t3-off-canvas-cart" data-effect="off-canvas-effect-7">↩	  <s

Error: Element a is missing required attribute href.

From line 980, column 2; to line 980, column 159

d-cart">↩	<a class="btn-cart off-canvas-toggle" id="head-cart-dropdown" type="button" data-pos="right" data-nav="#t3-off-canvas-cart" data-effect="off-canvas-effect-7">↩	  <s

Attributes for element a:
    Global attributes
    href — Address of the hyperlink
    target — Browsing context for hyperlink navigation
    download — Whether to download the resource instead of navigating to it, and its filename if so
    ping — URLs to ping
    rel — Relationship between the location in the document containing the hyperlink and the destination resource
    hreflang — Language of the linked resource
    type — Hint for the type of the referenced resource
    referrerpolicy — Referrer policy for fetches initiated by the element

Error: Bad value button for attribute type on element a: Subtype missing.

From line 1088, column 11; to line 1088, column 145

										<a class="btn-user off-canvas-toggle " type="button" data-pos="right" data-nav="#t3-off-canvas-user" data-effect="off-canvas-effect-1">↩					

Error: Element a is missing required attribute href.

From line 1088, column 11; to line 1088, column 145

										<a class="btn-user off-canvas-toggle " type="button" data-pos="right" data-nav="#t3-off-canvas-user" data-effect="off-canvas-effect-1">↩					

Attributes for element a:
    Global attributes
    href — Address of the hyperlink
    target — Browsing context for hyperlink navigation
    download — Whether to download the resource instead of navigating to it, and its filename if so
    ping — URLs to ping
    rel — Relationship between the location in the document containing the hyperlink and the destination resource
    hreflang — Language of the linked resource
    type — Hint for the type of the referenced resource
    referrerpolicy — Referrer policy for fetches initiated by the element

Error: Bad value /images/virtuemart/product/resized/BeFunky-collage (4)_1980x2640.jpg for attribute src on element img: Illegal character in path segment: space is not allowed.

From line 3408, column 146; to line 3408, column 342

10207319"><img  class="featuredProductImage" border="0"  loading="lazy"  src="/images/virtuemart/product/resized/BeFunky-collage (4)_1980x2640.jpg"  alt="Sloggi Men Start  Movember H Short  C2P 10207319"  /></a><d

Error: Element style not allowed as child of element body in this context. (Suppressing further errors from this subtree.)

From line 3972, column 150; to line 3972, column 172

fb.css" /><style type="text/css">↩     

Contexts in which element style may be used:
    Where metadata content is expected.
    In a noscript element that is a child of a head element.
Content model for element body:
    Flow content.

Error: The value of the for attribute of the label element must be the ID of a non-hidden form control.

From line 971, column 3; to line 971, column 66

earch">↩		<label for="mod-search-searchword107" class="element-invisible">Αναζήτ

Check if you want https://validator.w3.org/nu/?doc=https%3A%2F%2Fkousis-underwear.gr%2F

saguaros

Hi forty

I've shared this issue with the team for updating.

Thanks for your report.

forty

Ok thanks but we need fast fix, can i try to fix it my self ? Can you help me and after i will update when new version is complete

saguaros

Hi forty

The team will check and update this soon, in the mean time, you can share the ftp account also.

forty

saguaros Ok i did it Thanks

forty

Hi, sorry if i push you but we have at most 10 days to fix those issues it is very important.
Can you give me a temp solution and then update?

forty

Hi again, i fixed all errors and i have just 1 to correct but i need your help and it is URGENT

The error i get here https://validator.w3.org/nu/?showsource=yes&doc=https%3A%2F%2Fkousis-underwear.gr%2Fel%2F#l972c66

is about file head.php on template folder tpls/blocks/
Code is below

<!-- META FOR IOS & HANDHELD -->
<?php if ($this->getParam('responsive', 1)): ?>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<style>
		@-webkit-viewport   { width: device-width; }
		@-moz-viewport      { width: device-width; }
		@-ms-viewport       { width: device-width; }
		@-o-viewport        { width: device-width; }
		@viewport           { width: device-width; }
	</style>

saguaros

forty Let me check with the team and will get back to you soon.

forty

saguaros Hi i removed this code and errors dont appear but is this code needed for devices view?

saguaros

Hi forty

Do you mean the code for ''?

forty

saguaros Yes

saguaros

Hi forty

This code is required. And I don't see any error at this moment with the HTML checker now. It's just the warning so I think it will be fine.

forty

I removed this code that is why you dont see errors. Now i replace with the original head.php and if you check you will see the error!

Error: CSS: width: device-width is not a width value.

At line 99, column 57 in resource https://kousis-underwear.gr/el/

saguaros

forty Let me check again and will get back to you shortly.

forty

Hi, i get the same error on glocom.gr but days earlier with update was fixed. I dont know why the validator find again error

It is the same code with error above
https://validator.w3.org/nu/?showsource=yes&doc=https%3A%2F%2Fglocom.gr%2Fel%2F

  <style  type="text/css">↩
    @-webkit-viewport   { width: device-width; }↩
    @-moz-viewport      { width: device-width; }↩
    @-ms-viewport       { width: device-width; }↩
    @-o-viewport        { width: device-width; }↩
    @viewport           { width: device-width; }↩
  </style>↩

saguaros

forty Could you temporarily remove this code and see how it goes?

forty <style type="text/css">↩
@-webkit-viewport { width: device-width; }↩
@-moz-viewport { width: device-width; }↩
@-ms-viewport { width: device-width; }↩
@-o-viewport { width: device-width; }↩
@viewport { width: device-width; }↩
</style>↩

forty

saguaros Where is this code? Template is JA VITAL.

About this thread we have already fixed!! But now vaidator shows the same error with this thread

https://www.joomlart.com/forums/d/34998-wcag-2-0-level-aa-compatible/23

saguaros

forty

It's defined in this file: /plugins/system/t4/themes/base/html/layouts/t4/index.php

Remember to backup your site first.

forty

saguaros Ok thanks