CodeBetter.Com
CodeBetter.Com
RSS 2.0 via Feedburner
           Do you Twitter? Follow us @CodeBetter

Jeffrey Palermo (.com)

Blog moved to www.jeffreypalermo.com

How to ensure your web sites are valid Html (or XHtml) - level 300

I originally was going to label this post level 200, but given how few people know about Html standards, I've labeled it 300, but I don't think this _should_ be an advanced topic.

The first easy step is to try to validate your site with a validator.  The one I use is from the W3C: http://validator.w3.org/.  Type in the site, and it will tell you what is wrong with it.  A series of events brought my focus back to this.  I've posted on this topics previously here, here, here, here, and here

I was setting some CSS overrides for my Community Server blog, and I wasn't getting the results I wanted.  Then I inspected the page to find that the default skin of Community Server doesn't set a DocType.  I was very surprised by this since Telligent has been on the ball on so many things.  Telligent's own web site uses the XHtml 1.1 DocType, but it doesn't validate.

Not including a DocType at all leaves the browser guessing as to what kind of markup your page is.  IE will assume Html 3.2 or (quirks mode).  FireFox wants to render it as Html 4.01 transitional.  In fact, if you use the default DocType in VS.Net 2003, you'll be using an incomplete one that omits the location of the .dtd document.  You can write valid Html 4.0 this way (and I commend Microsoft for having a main page that correctly validates), but IE will still operate in quirks mode.  This may cause you some grief when laying out your pages because you will have unpredictable browser behavior.

Adhering to web standards greatly simplifies web application development when you need an attractive user interface.  There are some simple steps that even a beginning programmer can employ to ensure the web application is valid markup:

  • Add a DocType to the top of every page (or your master page in ASP.NET).  I recommend using:
    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  • Validate your app with the W3C validator.
  • Fix every error it finds.

These simple steps can lead anyone to standards-compliant web application.



Comments

Chris Wallace said:

I'm a big advocate for standards compliance and agree with you on this 100%. For some reason though, it seems as if we as developers will spare no expense making our backend code clean but we always neglect the UI. Granted, if you're doing intranet apps it isn't nearly as important due to mostly targeting a single browser but with internet apps, you shouldn't neglect your UI. Also, tables are not supposed to be used for layout....quit using them guys.
# July 29, 2005 11:56 AM

Ian Smith said:

Easier said than done Chris! ASP.Net server controls generate all kind of garbage that breaks validation. Don't get me started on the mess that is called "the datagrid". The problem is that nearly all the literature dictates platitudes assuming you're coding raw HTML and CSS, but .Net developers are not doing that. Maybe with Whidby things will improve but at the moment the "cost" of writing ASP.NET sites that are valid and accessible is extortionate and can not usually be justified for the perceived benefits they bring (most users don't have a clue whether somethings generated by a table or not, with the only clue being that the "clean" CSS design just breaks down in older browsers).
# July 29, 2005 1:43 PM

Chris Wallace said:

I agree it's difficult in 1.x but it is possible and doesn't require as much effort as you'd think. I did my old personal site with full compliance in about a week. 2.0 should fix things mostly since it's mostly compliant by default. They still use tables in a couple of places they shouldn't but it'll be a lot easier to fix a couple of places than the entire page.
# July 31, 2005 8:20 PM

Andreas Kraus said:

MS VS 2005 already uses XHTML 1.1 as Doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

However, sometimes I don't use Datagrids or Datalists at all and therefore code my own grid to be able to validate. It improved in 2.0 but in many cases it's still a big mess.

Also, I hope IE7 won't kill my current IE-Layout .
# August 2, 2005 12:57 PM

About Jeffrey Palermo

Jeffrey Palermo is a software management consultant and the CTO of Headspring Systems in Austin, TX. Jeffrey specializes in Agile coaching and helps companies double the productivity of software teams. Jeffrey is an MCSD.Net , Microsoft MVP, Certified Scrummaster, Austin .Net User Group leader, AgileAustin board member, INETA speaker, INETA Membership Mentor, Christian, husband, father, motorcyclist, Eagle Scout, U.S. Army Veteran, and Texas A&M University graduate. Check out Devlicio.us!

This Blog

Syndication

News

Headspring Systems

View Jeffrey Palermo's profile on LinkedIn

See my new blog at .jeffreypalermo.com