When it comes to mark-up and styling, you can do whatever you like if you're using umbraco. You'll get clean 1:1 mark-up as defined in the templates and macro's.
Well, since Umbraco is such a flexible system and gives you total control over your markup, you can use whatever you prefer :)
There's nothing in Umbraco that'll make it hard for you to use HTML5 and CSS3 - nothing. The table's that you are talking about can be removed right away as the person who has created the different macros, templates etc. have created these.
Like the fine gentlemen mentions above you have 100% control over the rendered markup (unless you use some asp.net control, which is still wrapped in bad table-based markup out of the box).
So you can create whatever markup you would like to do. You're not stuck with table based design at all.
However it can sometimes be a challenge to provide editors with enough flexibility when they need to create columns for content on a certain times. Then it's sometimes neccesary to use a template. But this should be possible to avoid by using templates in the rich text editor, which you can read more about here: http://our.umbraco.org/wiki/how-tos/enabling-the-%27template%27-plugin-for-tinymce
The HTML and CSS is 100% in your control no matter the iteration of these languages.
Maybe it would be more correct to change the output method to HTML since that now is in fact what your output is transformed into.Don't think you need the encoding though.
XSLT will always out put well-formed XML so it is not possible to not have a closing tag (unless you use <xsl:text> which is a hack). But havign a closing tag is still HTML5 so I'm not sure why this is a problem.
You could try using a razor macro but I just don't see the point on spending any effort on this.
Maybe if you posted the HTML you want to produce someone could assist.
you're correct. It seems I am a bit confused about that but now it's more clear. The xsl:text hack is the way to have html 5 valid code. If you do have closing tags like
<img /> or <link /> then you're not producing html 5 valid pages. So I'll use the following code instead.
My understanding of HTML is that the closing tag was optional and <img /> was still valid. I wouldn't want to do an image intensive site using the <xsl:text> method.
If it's really required I'd do it in Razor which doesn't have the XSLT/XML restrictions.
You don't need the <xsl:text> hack - the <link> element is perfectly valid with a slash on the end.
Generally you just need to set the HTML5 doctype and forget about it.
You can, however, do some great things for yourself by setting the output method to "html" as well, because that will output closing tags for elements that require them instead of the XML/XHTML self-closing tags.
Here's a rule of thumb: Whenever you use the <xsl:text> hack, you're either doing something wrong, or you're doing something that should probably be handled elsewhere (i.e. in an extension function).
Integration of Umbraco with HTML 5 and CSS3
Guys i would like to know how we designers will Umbraco be merging with HTML 5 and CSS 3??
Finally getting ride of <table> ?? Ive read a bit of Modernizr...
Fuji
Umbraco has nothing to do with HTML5 and CSS3.
When it comes to mark-up and styling, you can do whatever you like if you're using umbraco. You'll get clean 1:1 mark-up as defined in the templates and macro's.
Hi Fuji
Well, since Umbraco is such a flexible system and gives you total control over your markup, you can use whatever you prefer :)
There's nothing in Umbraco that'll make it hard for you to use HTML5 and CSS3 - nothing. The table's that you are talking about can be removed right away as the person who has created the different macros, templates etc. have created these.
/Kim A
Hi Fuji
Like the fine gentlemen mentions above you have 100% control over the rendered markup (unless you use some asp.net control, which is still wrapped in bad table-based markup out of the box).
So you can create whatever markup you would like to do. You're not stuck with table based design at all.
However it can sometimes be a challenge to provide editors with enough flexibility when they need to create columns for content on a certain times. Then it's sometimes neccesary to use a template. But this should be possible to avoid by using templates in the rich text editor, which you can read more about here: http://our.umbraco.org/wiki/how-tos/enabling-the-%27template%27-plugin-for-tinymce
The HTML and CSS is 100% in your control no matter the iteration of these languages.
/Jan
I've started basing all my new sites of HTML5 boilerplate framework which there are no problems integrating with Umbraco.
Hello all,
how can we add html 5 tags in XSLT? should we change the
<xsl:output method="xml" omit-xml-declaration="yes"/>
to
<xsl:outputmethod="html"encoding="utf-8"indent="yes"/>
or something similar?
Cheers, Giorgos
Hi Giorgos
Maybe it would be more correct to change the output method to HTML since that now is in fact what your output is transformed into.Don't think you need the encoding though.
/Jan
Hi Jan,
I've tried different things with no luck.
It would be great if anyone could a post a dummy xslt to have a look at it. I can't manage to have an img tag without having the close part of it.
Cheers, Giorgos
XSLT will always out put well-formed XML so it is not possible to not have a closing tag (unless you use <xsl:text> which is a hack). But havign a closing tag is still HTML5 so I'm not sure why this is a problem.
You could try using a razor macro but I just don't see the point on spending any effort on this.
Maybe if you posted the HTML you want to produce someone could assist.
Yes Paul,
you're correct. It seems I am a bit confused about that but now it's more clear. The xsl:text hack is the way to have html 5 valid code. If you do have closing tags like
<img /> or <link /> then you're not producing html 5 valid pages. So I'll use the following code instead.
<xsl:text disable-output-escaping="yes"><![CDATA[
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="/css/style.css">
]]></xsl:text>
Cheers, Giorgos
My understanding of HTML is that the closing tag was optional and <img /> was still valid. I wouldn't want to do an image intensive site using the <xsl:text> method.
If it's really required I'd do it in Razor which doesn't have the XSLT/XML restrictions.
Paul,
<img/> is still fine, sorry it was my mistake. It pass the html 5 w3c validator without problems.
The problem for validation would be with other tags like <link rel="stylesheet" href="/css/style.css"> that needs the xsl:text hack
Thanks
Hi Giorgos,
You don't need the <xsl:text> hack - the <link> element is perfectly valid with a slash on the end.
Generally you just need to set the HTML5 doctype and forget about it.
You can, however, do some great things for yourself by setting the output method to "html" as well, because that will output closing tags for elements that require them instead of the XML/XHTML self-closing tags.
Here's a rule of thumb: Whenever you use the <xsl:text> hack, you're either doing something wrong, or you're doing something that should probably be handled elsewhere (i.e. in an extension function).
/Chriztian
is working on a reply...