QuirksMode.org redesign

Regular visitors may have noticed that my homepage has changed a bit in the past few days. The old one was too cluttered and contained too much information. Besides, it didn't have any space left for the new Elsewhere on the 'Net feature. So I significantly revised my main blog pages and the content they deliver to the homepage.

Like my recently started validation drive, the homepage restructuring is just one aspect of the full-fledged QuirksMode.org redesign I'm planning. Besides, the redesign set me thinking about separation of structue and content.

Redesign

I use frames. My graphic design is not so much bad as well bloody boring, and it doesn't support the content too well. The amount of content becomes even more staggering with every passing month; and I have to shoehorn ever more significant parts into the homepage, which has become rather (too much?) information-rich.

Since I completely agree with Andy Clarke's call for more cultural diversity in web design, the graphics will be created by a Dutch designer. I need some interface design and usability advice, too. Finally, I suppose the backend (MT) needs some subtle tweaks.

And that doesn't even mention the navigation, which will have to be de-framed, but which I flatly refuse to include (either hard-coded or through SSI) in every content page. Right now my sitemap/navigation page is 25K, and that's really too much of an additional download to include in every single page on my site. Instead, I suppose a bit of nifty AJAX scripting is called for, and Chris Heilmann gave me the start of an idea in the fringes of @media 2005.

Although I've got my dream team already lined up in my mind, and I know roughly which steps we should take, the real, visible work will start in late August at the earliest, and maybe even much later. Nonetheless, the remake of the interface is only one aspect of the QuirksMode.org redesign.

Outdated content

The validation drive I started earlier is of course meant to move all pages as close to XHTML 1.0 Trans as possible. A second, and maybe even more important, goal is to review all content on this site, and to rewrite it where possible.

The content of about two thirds of my JavaScript pages is outdated. There pages were written between 1998 and 2002, and still pay attention to, for instance, Netscape 4. A while ago I asked what I should do: keep them as they are, rewrite them and keep the originals in an archive, or rewrite them and trash the originals. The vote on this subject will remain open until Monday, so you can still add your opinion.

The validation/rewrite drive has already started and will proceed more or less independently of the redesign. This gives raise to an interesting point, which has theoretical and practical implementations.

Separation of structure and content?

Right now I use a style sheet which, unsurprisingly, hinges on the current structure of my pages. My future style sheet will do the same. To make sure the transition between style sheets goes as smoothly as possible, I can therefore not change the structure of my pages during the validation/rewrite drive.

Besides, one of the big advantages of separation of structure and presentation is supposed to be that I can just upload a new style sheet, and presto, my site has changed without any need to edit the actual pages. One of the purposes of the redesign is to find out if this scheme of things actually works in practice.

Significantly updating my site content means that I'll add or remove headers, paragraphs, <pre>s, <div>s with compatibility information, and anything else that might be necessary. Nonetheless, this does not affect the structure of my site (or at least, it shouldn't).

Structurally, the main text of any page remains marked up with paragraphs that are direct children of the <body>, and whether or not I change the number and content of these paragraphs doesn't matter. That's what I mean when I say the content will change, but the structure won't.

Is it time to add separation of structure and content to our best practices? Is this a fundamental feature of standards-aware, modern web development that has received too little attention?

Or am I way behind the times and have people already written on this subject? If so, pointers would be welcome.

Written on 7 July 2005
Categorized in Redesign
Previous entry: ...and again
Next entry: Benchmark tests: style vs. className

This is the blog of Peter-Paul Koch, web developer, consultant, and trainer. You can also follow him on Twitter or Mastodon.
Atom RSS

If you like this blog, why not donate a little bit of money to help me pay my bills?

Categories:

Comments

1 Posted by Pingu on 7 July 2005 | Permalink

Surely your site is driven from a database of content, with HTML and CSS used to display the content via templates? I'm astonished the upgrade to XHTML should be such a trauma.

You can't separate content from structure in CSS/HTML, certainly not yet. The number of fiddles and quirks mean HTML is rather more required than we'd all desire, and will be for a long time to come.

2 Posted by Faruk Ates on 7 July 2005 | Permalink

Pingu, I get the feeling it isn't...

In any case, the important thing is to separate structure and presentation, but you (PPK) are already doing that for most of it.

I'm curious as to your "dream team" :-)

3 Posted by Jeroen Coumans on 7 July 2005 | Permalink

To a large degree, the use of a content management system with templates and a database backend already easily facilitates the seperation of structure and content. In that case, templates are used for structure and and the database for the pure content. From a point of view of redesigning a page, this is arguably just as helpful as the seperation of content and presentation, because it's always tricky to change the design a lot if you depend on the structure of your content, as you have. By abstracting the structure away, the redesign process can easily incorporate restructuring without affecting your content.

4 Posted by Dante on 11 July 2005 | Permalink

I like it PPK. It reminds me of Stopdesign.

Are you using del.icio.us for the Elsewhere on the 'net feature?

5 Posted by ppk on 14 July 2005 | Permalink

Sharp, Dante. Yes, I looked at Stopdesign while restructuring the homepage. It's one of the better information layouts when you have lots of little bits to show.

And no, I don't use del.icio.us . Just old-fashioned browsing and linking.