Tired of Kubrick, I decided to jump to my own design a little bit early. The new theme isn’t quite done, and you’ll notice this in two ways:

• A lot of features are missing. Most prominently, this includes search¹ and comments (both reading and submitting). Update: Search is fully back.
• Most pages are missing. Right now, only the legal page is there. There’s no “about”, which used to be a somewhat comprehensive (though incomplete) section, nor “contact”.
• Some of the layout is inconsistent. This particularly affects older articles. If you spot an article whose layout doesn’t appear to make sense (presumably, it used CSS rules that I didn’t transfer over to the new theme), let me know. For current articles, consider upgrading your browser.

Improvements – visual refresh aside – include the addition of tags (I will deprecate most categories, leaving only a handful), better handling of images (they scale to higher quality) and what I hope will be generally regarded as a less-in-your-face layout.

The site makes extensive use of CSS 3 properties, which means it won’t display quite as nicely on older browsers, but I have tried wherever possible to make things degrade nicely. Several browsers won’t support the multi-column layout, but they should degrade nicely to a single column of text. Most won’t do drop shadows underneath some of the text and images, but the site will look fine without them.

I also try to take advantage of some HTML 5 additions, such as the <header> and <footer> elements. (I’ll probably also try and let MYSTlore take advantage of HTML 5’s <video> element.) The site isn’t entirely valid at this point, but I’m getting there.

Finally, there will be a series of tabs on the top, as I showed a while ago.

Now, I realize that using CSS 3 and HTML 5 features this early makes navigating my little place on the Web ever-so-slightly less enjoyable on a regular browser, but when it comes to technology, I’ve always been the kind of guy to jump on bandwagons. (I can’t help it. )

I hope you enjoy some of the changes.

1. You actually can perform a search; there just isn’t any interface for queries yet. ↩

Via reddit: “Internet Explorer 7 Update”

Because Microsoft takes its commitment to help protect the entire Windows ecosystem seriously,

(Are we running out of buzzwords yet? Every manager at Microsoft who uses the term “ecosystem” ever again ought to be fired on the spot.)

we’re updating the IE7 installation experience to make it available as broadly as possible to all Windows users.

That is a brilliant concept! Guess competitors haven’t thought of that. Wait a minute.

With today’s “Installation and Availability Update,” Internet Explorer 7 installation will no longer require Windows Genuine Advantage validation and will be available to all Windows XP users.

Yay!

No, seriously: yay. That really is a step in the right direction. But wouldn’t it have been even more beneficial, in light of things like Storm, to get rid of WGA when it comes to any Windows security update? Being denied a browser update is one thing (particularly when there’s competition); no access to security updates that are otherwise significantly more difficult (if even legal) to obtain, on the other hand, causes tons of needless collateral damage.

To avoid a misunderstanding, I actually disagree with Schneier’s assertion that “Redesigning the Microsoft Windows operating system would work”. There are certainly things in Windows that can be improved on the matter of security, just like there are in most other operating systems (mainstream or otherwise), but the biggest problem by a wide margin is, as is often the case, the user. However, Microsoft (and any other OS vendor) ought to assist the user as much as possible in this regard, and that’s where WGA really hurts and gets in the way, not seldom even for legitimate customers.

If you are already running IE7, you will not be offered IE7 again by Automatic Updates.

You don’t say.

Additionally, we’ve made minor changes to IE7 for Windows XP based on customer feedback:

The menu bar is now visible by default.

Double-yay! Common sense has prevailed, users have voted, this new invention of pull-down menus is really taking o…

…wait.

Okay, so the two noteworthy changes in this update are steps back. What does that tell you? Things aren’t looking good for this browser.

Meanwhile, guess what browser has the highest growth rate, and which one has been losing the most.

Gruber links to a piece lovingly titled “It’s Official: Apple’s Stupidest Interface Innovation Ever”.

Now, I can’t deny I expected this UI change to be rather controversial when it was first leaked. And I haven’t seen it in person, so I admittedly cannot judge it well. But I think Kirk may be exaggerating just one little bit.

Like others, I think a division of two-thirds/one-third might work a lot better than the current 50-50. But in general, I understand why they went with the split screen (to display just the traditional menu on such a high-resolution screen is so wasteful!), and do think it’s a neat idea. Again, though: I can’t really judge how distracting the (Ken Burns-like?) movement animation feels in real life. Perhaps I’d hate it too.

I just don’t think I would. On the contrary, I feel that cover art, when done well, can be quite pleasant to look at while navigating the menus.

I’ve been continuing to work on ’soeren says 2′, the redesign of this site. While most of the initial testing was done in static HTML hand-crafted with TextMate’s help, I decided last night to set up a test WordPress installation and building my own theme to work off, and got surprisingly far. It’s nowhere near finished, but I’ve enjoyed tinkering with it.

Unfortunately, not everything is going quite the way I’d like it to. One of the greater stumbling blocks is the choice of HTML version, specifically with regard to XHTML. You might wonder at this point how larger websites solve this, but the answer is typically: they don’t. They pretend the problem isn’t there:

Wikipedia, for instance, use XHTML 1.0 Transitional, but serves it as text/html, thus effectively making it identical to HTML 4.01, only harder to parse. Flickr, who you might be inclined to think is all modern and hip and such, uses HTML 4.01 Transitional, as does Apple’s website, despite the recent redesign. Google, well, let’s just say their markup is a mess of minefield-like proportions. Facebook, to their credit, use XHTML 1.0 Strict, but mostly render that moot because they, too, serve it as text/html.

The XHTML 1.0 standard makes an exemption that using text/html is okay, but only sort of. After all, using that content type effectively turns the markup into SGML-HTML, not XML-based HTML. So the end result isn’t XHTML, nor does it benefit from any of XHTML’s benefits over HTML 4, nor are browsers allowed to pretend it’s XML; they all use the legacy HTML parser to handle something that looks like XHTML, but is not. Yes, you still get to use XML parsers on the server side, but the advantages are typically slim.

The main reason using XHTML’s actual MIME type, application/xhtml+xml, is out of question is Internet Explorer: even in version 7, it does not support that type. For good reason, too: as the post explains, actual XHTML support wouldn’t be particularly good. Now, there is the workaround of sniffing the UA string and trying to guess, thusly, which MIME type to serve the content as. But that’s error-prone, and an ugly hack.

However you roll the XHTML problem, the current situation just isn’t any good, and pretending it doesn’t exist isn’t a good idea. (Go read this, too, particularly the section with “You have a couple of choices:”.) Rather, the answer (to me, anyway) has always been to favor traditional HTML.

So, all hunky-dory, right? Just use text/html, which is a tad easier to write anyway, works across a ton of browsers, and has virtually no effective disadvantages. As an extra bonus, WHAT-WG has been busily working on some modernizations in their Web Applications / HTML5 effort!

But, no. That approach, too, can bite you in the back. You see, the rather nonsensical marketing surrounding XHTML hasn’t just gone so far that Microsoft once accused Opera of not supporting XHTML (when it was in fact IE that didn’t; oops), but also that a lot of software has started implementing and sometimes even hardcoding a number of its specifics. Including WordPress, the CMS that powers this blog: it has numerous deeply-rooted hardcoded uses of <br />, <img something-something />, <link blah />, and so on.

My options include jumping to another platform (nanoc anyone?), fixing WordPress’s code (after every single upgrade, no less), writing or using someone’s extension that filters WordPress’s code and fixes it on the fly, or doing what just about everyone else does: using XHTML-that-isn’t-quite and pretending it isn’t a problem.

Which, effectively, it kind of isn’t. But that doesn’t mean I have to like the status quo.

I’ve been working on an actual design for this blog. As in, something created from scratch, rather than rather light modifications from the Kubrick theme that’s been WordPress’s default since 1.5 or something. It’s not so much that Kubrick is bad (though it arguably has gone a little out of fashion over the time), but rather that, being the default, it makes every blog that uses it look like “yet another WordPress weblog”. Sticking to the default design just doesn’t express creativity.

Now, I’m no good designer. I know quite a bit about HTML and CSS, certainly enough to customize pages, but starting with an empty page is very hard for me. Some people, I suppose, have this exquisite skill where they can stare at a blank page and imagine it filled the way they want it to, and then proceed to get to work. I can do this with individual pieces, but never quite the whole ‘picture’.

But I try. I’m subscribed to Bartelme Design’s blog because it has interesting tutorials and other stuff every now and then, and one day, Wolfgang wrote about creating a “Ray of Light” effect in Photoshop. The trick makes perfect sense once you read it, but it’s not the kind of thing I’d come up with on my own. In any case, I eventually started experimenting with using that as a basis for a new header image. I didn’t get much further than that, though, and soon afterwards, hospital and all that happened, and I haven’t really been in the ‘zone’ to work on it since.

Until today. I made a lot of progress, and am quite happy with the results so far. It’s nowhere near finished, but it’s more than enough to be something I’m proud to have created. It won’t win a design contest, but it represents me more so than any third-party’s work ever possibly could. And it has unique little touches that are playful, but shouldn’t get in the way much at all:

• In the top right is a 150×150 pixel picture of me (or, say, our house), with a horizontal opacity gradient from 0 to 100%. While the current design has something similar, the entire backdrop for the top banner is currently randomly loaded each time. With the new approach, only that small photo is loaded. Also, the fetching is now done on the client side, using MochiKit with AJAX and a JSON file randomly generated from PHP. Every minute, a new image is fetched (with a fading transition), or you can manually click to swap it. There’s still some bugs with this, and I need to cut down on the loading times (by taking out the 90% of MochiKit that I don’t use, for instance), but I think it’s just neat enough and, while obviously not essential, not too obtrusive. And yes, I’m being a good net citizen: if you have JavaScript disabled, it’ll degrade gracefully and simply leave the image out. Looks fine, too.
• I’m significantly simplifying the layout. No sidebar. Currently, no archives list, no calendar, and no search form. I suppose I’ll have a link to archives instead, and put the search form in there, but I haven’t decided thus far.
• I’m adding a few typographical features courtesy of CSS. Each paragraph now has a slight indentation. Articles have a different visual separation. Etc. But most significantly, if things work out okay, I’ll be taking the risk of already using pre-CSS3 multiple-column layout, with each column taking up to 30em, and a gap of 3em. This works great for me in Firefox 2 and Safari 3. Older browsers will just ignore this and make the text full width, so that, too, degrades okay. Resizing the window in a column-supporting browser and seeing it dynamically determine how many columns to display (and how wide to make each one) is very nice; the WebKit and Gecko folks did a great job implementing this in the engine.

Here’s a demo of the new header image:

As you can see at the beginning, there’s a ‘bug’ of sorts whereby the randomizer will occasionally give you the same image twice (unsurprisingly), or even more often than that. This will become less relevant as I add more images, though, so I’m not sure there’s a need to write a workaround (I tried, but it’s more complicated than I thought).

And a demo of the columns. Sorry for the lag; recording such a large area while resizing the window and reflowing the layout is unfortunately quite computationally intensive these days, so it’s hard to really show how nicely it does flow.

Anyway, this is a bit of an overview of what I’m working on. In addition, I have also altered the WordPress installation to use Subversion-based updates, so if something is (still) broken, please let me know. We shall now return to our regularly-scheduled blog.