joomla / joomla-cms

Home of the Joomla! Content Management System
https://www.joomla.org
GNU General Public License v2.0
4.74k stars 3.65k forks source link

HTML5 validation -> void tags / self-closing tags #38856

Closed jjnxpct closed 1 month ago

jjnxpct commented 2 years ago

Problem identified

Recently the W3C HTML5 validator started telling me I should not used self-closing tags:

_"Self-closing tag syntax in text/html documents is widely discouraged; it’s unnecessary and interacts badly with other HTML features (e.g., unquoted attribute values). If you’re using a tool that injects self-closing tag syntax into all void elements, without any option to prevent it from doing so, then consider switching to a different tool."_

This applies to for examle the tags that are inserted by Joomla (4) when we use $doc->addHeadLink. This inserts a link tag with that is self closing. When we want HTML validation (form W3C) we need to have those unclosed because this is a void tag that van never have any content. Browser will render this OK but accoriding to the warning this might in some cases cause issues.

I am not sure if this has been discussed before and also I am not sure how important this is. Just wanted to put it out there.

Proposed solution

For the $doc->addHeadLink the output should then be changed to omit the closing tag.

Open questions

Should Joomla (4) be able to output sel-closing tags that are HTML5 proof? Eventhought it does not cauze any issues at the moment?

jjnxpct commented 2 years ago

Update: JCE editor creator Ryan pointed met at this code when I asked him about CSS files that were inlcuded by JCE:

https://github.com/joomla/joomla-cms/blob/4.2-dev/libraries/src/Document/Renderer/Html/StylesRenderer.php#L190

He said: "Stylesheets are rendered via the Joomla API, and this using self-closing tags regardless of the doctype."

itmagpro commented 1 year ago

I use joomla 3.10.11 and set in template $doc->setHtml5(true);

but in result have not valid self-closing tags in header, like this <meta charset="utf-8" />

how to fix this bug?

jjnxpct commented 1 year ago

I don't think this is a bug, but a change in HTML5 validation checks. It won't do any harm, but I do thinkt the Joomla output should somehow be able to produce selfclosng tags that are valid HTML5. I do thnk when these tags (like br,img, etc) omit the closing tag they will stille be OK for older browsers / templates as well. I think modern browsers will just ignore te closing slash, but again it's not vaild HTML5. In the future that might become an issue in browsers. The W3C HTML5 validation check now shows these 'errors'. I did not before.

jjnxpct commented 1 year ago

Also I think Joomla 3 will not be changed with regards to this issue. But maybe J4 will.

jjnxpct commented 1 year ago

In Joomla 4 we also see the Web AssetManager adding link tags (to add stylesheets) tha have a closing slash at the end of the tag. This is not 'HTML5 proof.'

brianteeman commented 1 month ago

please test #43961

alikon commented 1 month ago

closing as we have a pr to test