Friday, August 19, 2005

Why Panoramio is not XHTML/CSS valid?

In my previous post Fade in and out I said that I didn't care about Panoramio not being xhtml/css valid.

If that sounds weird, it's just because people have forgotten the real goal of validating a site. Validation is a mean, not an end.

The goal is to have a site as cross browser as possible, so that any potential user is able to enjoy it. Validation is a tool to use towards this goal, but it is not the only tool, and not even the most useful one.

Even if people where using fully compliant browsers to see your site (and we all know they are not), there are an awful lot of things that are just not in the specification and can ruin the look of a perfectly valid page. For instance, the standard is silent about the default margin, color and font that a browser should use for any element. There are very good reasons to not specify such things. Font names are not the same between different systems, for instance. But the point is that if you don't really test your page against different browsers, no matter how much does your page validate, it may still look awful for a lot of your visitors.

You can also experience the reverse. You can have a non valid page that is perfectly usable on a 100% standard browser. And I don't mean that “almost everything will work”, I really mean perfectly usable! The XHTML / CSS standards says how a XHTML / CSS document should look, and it also says how a compliant browser should behave in the presence of certain invalid documents. For instance, unknown attributes should be ignored.

It is thus perfectly legal to invent new attributes, and give them a particular meaning with javascript (just remember that your user may not have javascript activated). Any compliant browser will render your page without a glitch. The only downside is that your page will not be anymore XHTML valid. But if you concern is to have webpages that can be read and used with any browser, you will not have a single problem with this strategy.

This trick is used in our login and register forms in Panoramio, to explicit what test should be run by the client on each field before the form is submitted. E-mails should be real e-mails, some fields are mandatory, that kind of thing. The result is much cleaner than adding these tests ad-hoc in javascript. (Note that this framework is not yet finished, and thus the javascript code still does some tests in an ad-hocist manner.)