Products

Solutions

Resources

Partners

Community

About

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

The Community Blog is a personal opinion of community members and by no means the official standpoint of DNN Corp or DNN Platform. This is a place to express personal thoughts about DNNPlatform, the community and its ecosystem. Do you have useful information that you would like to share with the DNN Community in a featured article or blog? If so, please contact .

The use of the Community Blog is covered by our Community Blog Guidelines - please read before commenting or posting.


DNN & XHTML

As Cathal posted before, a lot has been done to get core DNN XHTML (transitional) compliant.
For now we focussed on the public side of DNN, the next step will be to get the admin side XHTML compliant too.
I noticed that with the corrections on the public side, the admin side has become much more compliant already

Why XHTML
Here's why I think XHTML is important for DNN

1. XHTML pages are a good step towards more accessible pages (the alt attribute for "img" tags is mandatory for instance)
2. That's why in a lot of countries government / public service websites must be XHTML compliant.
3. XHTML is cleaner, content and style are (in general) better separated.
4. The XHTML doctype makes skinning a lot easier since it avoids some important IE style bugs.
(don't worry there are plenty left even with an XHTML doctype ;-)
5. If the core is XHTML compliant this makes it easier to "debug" (ascx) skins. A lot of cross browser problems are caused by HTML errors.
Finding a HTML error in the skin is easy if your HTML validator shows 2 errors instead of a 55 + 2
6. XHTML is the future, HTML 4 transitional is history (just like classic ASP ;-)

Modules and XHTML
We started testing the modules for XHTML compliance  in December 2007, as part of the release process (for now only the public side). We did not fail any modules though, if they where not XHTML compliant.
This will change from now on. Modules that enter the release tracker have to be XHTML compliant to pass (except for minor bug fixes).
I think this is a step forward towards full XHTML compliancy, for core and core modules.
(and yes, the new skin for DNN 5 is XHTML compliant)

Third party Modules / Skins
The XHTML status of a lot of third party DNN products is a bit like the situation for the core about a year ago (there are exceptions).
I noticed that the number of commisions with mandatory XHTML compliancy is increasing, which means XHTML compliance is becoming one of the a selection criteria.

XHTML Compliant skins
As Cathal mentioned the default doctype in DNN 5.0 will be XHTML transitional, this means people will expect a skin to be XHTML compliant too, or at least render correctly. The majority of the third party skins is not XHTML compliant.
If you don't make your skins XHTML compliant you will sell less skins in the future.

I would like to encourage  all "non core" module developers and skinners to move forward and also make their products XHTML compliant.

How to Change to XHTML
Here are some tips:

XHTML warnings in VS
A lot of errors can be avoided by using the validation options in Visual Studio. VS will warn you for invalid (X)HTML

Testing your pages
The VS option only works for static HTML, so You will have to test the module / skin on the actual page too.
You can use the W3C validator for this.
But I prefer the "Html Validator" extension for Firefox (I use it for the XHTML tests)
It integrates with FFs "Source view".
Use:
Install the extension.
Choose Tools > Html Validator option" and set
- Algorithm to "Serial"
- Enable validation in Browser, this will show an Error icon in the browser (right bottom) if there are errors.
Double-clicking the icon will open the source view, showing the errors / warnings.
If you double-click an error it shows the offending HTML in the top pane of the source view window.

Most Common XHTML problems
Here's a list of the problems I see most during the XHTML tests:

-All tags should be closed
Wrong: <br>
<hr>
<img src="test.gif" alt="test">
Correct: <br />
<hr />
<img src="test.gif" alt="test" />

-All attributes should be in lowercase
Wrong: <div Class="test">
<div onClick="myfunction">
Correct: <div class="test">
<div onclick="myfunction">

-All Attribute values should be quoted:
Wrong: <td colspan=2>
Correct: <td colspan="2">

-No alt attribute defined for images
Wrong: <img src="test.gif" />
Correct: <img src="test.gif" alt="test image" />

-Deprecated tags: Wrong: <center></center>
Correct: <div class="DNNAligncenter"></div>

-Block elements inside inline elements:
Wrong: <span><div>test</div></span>
Correct: <div><div>test</div></div>
This is often caused by the use of the label control, use the literal control instead (with a div). If you have to add a block element inside an inline element, use an inline element and set its CSS to display:block, the result is the same and it will validate. Please note that a <p> element can not contain any block element either so use divs.

-Script tags without type="text/Javascript"
Wrong: <script src="myscript.js" language="javascript"></script>
Correct: <script src="myscript.js" type="text/javascript"></script>

- Links to external CSS stylesheet inside the body of the page
A Link to an external stylesheet must be in the <head> of the page to be compliant
For modules, move all this CSS to module.css, if it's dynamic CSS, write it in the head of the page.
Skins should have all CSS in either in skin.css of "skinname".css

Comments

Comment Form

Only registered users may post comments.

NewsArchives


Aderson Oliveira (22)
Alec Whittington (11)
Alessandra Davies (3)
Alex Shirley (10)
Andrew Hoefling (3)
Andrew Nurse (30)
Andy Tryba (1)
Anthony Glenwright (5)
Antonio Chagoury (28)
Ash Prasad (37)
Ben Schmidt (1)
Benjamin Hermann (25)
Benoit Sarton (9)
Beth Firebaugh (12)
Bill Walker (36)
Bob Kruger (5)
Bogdan Litescu (1)
Brian Dukes (2)
Brice Snow (1)
Bruce Chapman (20)
Bryan Andrews (1)
cathal connolly (55)
Charles Nurse (163)
Chris Hammond (213)
Chris Paterra (55)
Clint Patterson (108)
Cuong Dang (21)
Daniel Bartholomew (2)
Daniel Mettler (181)
Daniel Valadas (48)
Dave Buckner (2)
David Poindexter (12)
David Rodriguez (3)
Dennis Shiao (1)
Doug Howell (11)
Erik van Ballegoij (30)
Ernst Peter Tamminga (80)
Francisco Perez Andres (17)
Geoff Barlow (12)
George Alatrash (12)
Gifford Watkins (3)
Gilles Le Pigocher (3)
Ian Robinson (7)
Israel Martinez (17)
Jan Blomquist (2)
Jan Jonas (3)
Jaspreet Bhatia (1)
Jenni Merrifield (6)
Joe Brinkman (274)
John Mitchell (1)
Jon Henning (14)
Jonathan Sheely (4)
Jordan Coopersmith (1)
Joseph Craig (2)
Kan Ma (1)
Keivan Beigi (3)
Kelly Ford (4)
Ken Grierson (10)
Kevin Schreiner (6)
Leigh Pointer (31)
Lorraine Young (60)
Malik Khan (1)
Matt Rutledge (2)
Matthias Schlomann (16)
Mauricio Márquez (5)
Michael Doxsey (7)
Michael Tobisch (3)
Michael Washington (202)
Miguel Gatmaytan (3)
Mike Horton (19)
Mitchel Sellers (40)
Nathan Rover (3)
Navin V Nagiah (14)
Néstor Sánchez (31)
Nik Kalyani (14)
Oliver Hine (1)
Patricio F. Salinas (1)
Patrick Ryan (1)
Peter Donker (54)
Philip Beadle (135)
Philipp Becker (4)
Richard Dumas (22)
Robert J Collins (5)
Roger Selwyn (8)
Ruben Lopez (1)
Ryan Martinez (1)
Sacha Trauwaen (1)
Salar Golestanian (4)
Sanjay Mehrotra (9)
Scott McCulloch (1)
Scott Schlesier (11)
Scott Wilkinson (3)
Scott Willhite (97)
Sebastian Leupold (80)
Shaun Walker (237)
Shawn Mehaffie (17)
Stefan Cullmann (12)
Stefan Kamphuis (12)
Steve Fabian (31)
Steven Fisher (1)
Timo Breumelhof (24)
Tony Henrich (3)
Torsten Weggen (3)
Tycho de Waard (4)
Vicenç Masanas (27)
Vincent Nguyen (3)
Vitaly Kozadayev (6)
Will Morgenweck (40)
Will Strohl (180)
William Severance (5)
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out