[TYPO3-content-rendering] Current html5 wrapping

Thomas Skierlo pubtsk1 at pix-pro.eu
Mon Dec 17 16:12:14 CET 2012


Hi,

I joined this list today because I'm struggling myself with semantics in 
TYPO3 applications.

currently (TYPO3 4.7.x) a navigational element is rendered correctly as 
nav tag, if in an html5 environment. To get this tag instead of a div, 
two expensive CASE directives are needed. One for the opening and one 
for the closing tag.

Two possible issues with that:

1) Old and outdated browsers don't know nav at all. They don't really 
misbehave, because they just see a container and maybe mumble some ugly 
words which nobody will ever hear. They would prefer an old fashioned 
div, which is not really a bad thing. Not even in terms of html5. Having 
a nav tag here invites people to start styling it, which is not the 
intention of semantic tags.

Better way:

div...nav|nav...div

2) If you are trying to get semantics into a CMS like the current TYPO3, 
which does not offer content wrappers without use of community 
extensions (TemplaVoila, Gridelements), you either could pre-wrap your 
columns and content sections with tags like article, section or aside 
(which is no good idea at all) or you define your own section_frames of 
type article, section and aside, which can be applied to individual 
content elements. Probably that's the way to go. In this case you must 
take care of opening and closing tags yourself.

Wouldn't it be much better and easier, to always use a div wrapped 
around any CType, with an additional semantic wrap inside (artice, 
section, aside, nav, joedoe). The outer div carries the uid and can be 
used for styling. The inner one is semantic only. Can be applied (and 
overridden) like a piece of cake:


tt_content.stdWrap.innerWrap.cObject {

100 =< tt_content.stdWrap.innerWrap.cObject.default

100.30.override = ><section>|</section></div>

100.30.override.if.isInList.field = CType

100.30.override.if.value = header,text,textpic,image,bullets,table,uploads,mailform,login,search,media,shortcut,list,gridelements_pi1

100.30.override.fieldRequired = header

}


Doing so you even can fine grain the logic of semantic tags to 
individual tags which are "qualified" to be a "section". No header - no 
section. CType divider -- no article a.s.o. Otherwise editors must know 
a lot about semantics to always use the right wrapper.

My second current problem: Unreadable setup of css_styled_content due to 
maximum compatiblity with two very different standards. Xhtml and html5. 
Wouldn't it be much easier and more intuitive to fork in the very 
beginning? If html5 ? do that, otherwise do the old stuff. This would 
increase the chance to fix responsive image issues a lot.

Besides that. Keep up the good work,

Regards,

Thomas Skierlo



More information about the TYPO3-project-content-rendering mailing list