Sunday, April 8, 2007

Almost valid XHTML with "Minima Stretch"

pencil icon, that"s clickable to start editing the post

Finally I've collected energy to give the work for a template that produces valid XHTML a shot again. I'll use the post The Firefox is a Panda! as a test case because it's small and simple, so I can focus on the template.

To validate the page (template) I'll use the W3C Markup Validation Service and call it with a reference to the mentioned blog post.

I've fiddled with the templates before and once ruined some of the functionality (missing CSS-sheets) also when I realized that it was probably going to be impossible to get a complete valid blog my enthusiasm took a hit, but now I'll try to see how far I can come, and I'll try to keep track of what changes and the score as I implement all the changes. The order will be more or less random and then I'll maybe make a more systematic grouping and analysis in a later post and update the postings that I've all ready made.

To get started I first reset the template by choosing Revert widget templates to default in Template -> Edit HTML -> Revert widget templates to default, which wipes all the customizations that's been made to the widget part of the template, that's the <body> element tag in more practical terms, all the widgets that you've added stays but revert to default. Then I choose the template once more inn the Pick New Template sub menu under Template. When validating the page I got 117 errors which is actually much better that the first time with my former template.

The needed changes I've made are:

  1. comment in the skin tag after CDATA section, and removed xtra -- to keep the comment section valid (83 errors).
  2. Replacing navbar (74 errors).
  3. Moved the namespace declarations to the first level custom element (71 errors).
  4. Making Wellformed link for 'Email Post' (70 errors)
  5. post body in div tag instead of p tag (69 errors)
  6. well formed link to quickedit (68 errors)
  7. Making the 'comments-block' dependent on real content of 'data:post.comments' (67 errors)
  8. making the 'Post a Comment' link well formed (65 errors)
  9. replacing target='_blank' with rel="external" (65 errors)
  10. deleting 'quickedit' includes in sidebar (51 errors)
  11. adding xtra 'amp;' to link templates in <b:includable id='toggle' var='interval'> (24 errors)

Extras:

  1. Adding Google analytics
  2. Adding inline favicon
  3. Adding link to W3C Markup Validator

What remains are still the faulty Archive widget that gives me the 24 errors and to eliminate that I'll either have to wait for the blogger team to correct the error (close to a miracle) or do some heavy rewriting that I'll dodge for now :-). Also parts of the template isn't used with this post, ex. comments, so those parts probably also needs some taking care of later.

As for how browsers present the produced markup I've only used Firefox 2.0 where i looks correct and I've just tried Konqueror 3.5.6, which looks almost correct except for the uneeded vertical scrollbar for the navbar.

0 comments :