Zikula Community

BI've been doing XHTML AutoThemes for awhile and having a tough time with getting them x-browser-compatible. Then, like a ton of bricks it hit me why it wasn't working properly. Since I love to tell stories so much, here's what happened...

I set my theme to XHTML 1.0 Strict via the theme's settings in AutoTheme. Feeling satisfied with that, I didn't investigate any further. I've looked at my source in all the browsers and skimmed right over the DOCTYPE declaration without a notice.

The source was the same across the board, but still the browsers were rendering differently. Firefox and Netscape viewed identically... Internet Explorer and Opera were identical too... Everything was perfect, except for one scrolling div that was breaking the (778px, centered) layout in FF/NS.

Then I finally noticed (in the source) that PN was using it's own DOCTYPE (4.01 Transitional). AHA! :) This was the problem! See, when you declare a DOCTYPE, it automatically uses the browser's "quirks mode" unless you specify otherwise. After some research, I found this document which confirmed my "findings".

I then edited header.php in PN to use an XHTML 1.0 Strict DOCTYPE, and VOILA!!! All the browsers were rendering my design the same!!

So...moral of the story: if you're designing an XHTML AutoTheme, be sure to change PN's DOCTYPE declaration to reflect it...and you'll be well on your way to a fully accessible, and nearly identical, AutoTheme in the top 4 browsers... However, note that merely changing PN's DOCTYPE will not make it XHTML Strict, but it will definitely help you along in your design of compliant div-based themes.

Working strictly with

This will be a suprise cool addition to AutoTheme. Ease of docctype declaration in the admin and/or in the main template if you wish.

-Shawn

FYI... I voted for NO! I will use tables until a day they're no longer supported! mwooo haa haaa!

--
Get the Revolutionary AutoTheme HTML Theme System! Currently for PostNuke, PHP-Nuke, MD-Pro, CRE Loaded, osCommerce and Wordpress!

Can't wait for full support...browser-based DT switching would be excellent.

--
Photography | PHP | Other

I see that converting to XHTML is haaaaaaaaard...

Converting to XHTML is not 'that difficult' depending on how far you take the moove. I don't know the specifics with AutoTheme and selecting of doctypes (as outlined in this thread) but with xanthia the doctype is in the page templates. After that it's simply a case of updating the markup.

Note that there is a difference between making your theme compliant to the standard and making your theme semantically correct. A fully compliant XHTML page can still be tag soup full of tables and other unsuitable tags. Compliance is the letter of the law, sematically correct is the spirit and thus is much more important.

Sematically correct markup is about using the right tag for the right job. This, combined with accessibility guidelines (see WCAG), is where tables become not recommend for layout - the table tag is for marking up tabular data nothing more nothing less.

A few general tips for XHTML
1) all tag and attribute names should be lower case
2) all attributes values must be expressed as proper attribute value pairs i.e. attr="value"
3) all attrbute values but be quoted
4) all singular tags must be self closed i.e. or

5) all singular header tags must be self closed - note that this one will then invalidate the document as HTML 4.01 according to the w3c valaidator where as 1-4 don't (known as XHTML compatability).

In summary XHTML itself should not be goal, XHTML is an ends to a means. The goal really should be a a semantically correct, accessable site. This provides reall tangable benefits where as XHTML compliance is just meeting a (in some ways arbitrary) standard.

-Mark

I will try to se if with the AT team how it works, but overall, that was a very informative post about XHTML compliance...and its benefit...

I'll do my homework on the topic and see how i will do this but obviously

I can first reach the compliance and them reach semantic goal