What’s that? You want miscellaneous design notes? You got it!
If, heaven forbid, you’re using Internet Explorer, you may have noticed this site looks like shit. That’s because I’ve hidden the site’s stylesheets from all versions of IE on Windows, including IE7.
Why have I done this, you may well ask? After all, there’s nothing particularly bleeding-edge going on here, and not much that couldn’t be pulled off in IE with a little perseverance. Even the fixed header is doable with some JavaScript hackery.
Well… no. Although that’s certainly not untrue. The answer, though, is in the format. Testing and ensuring compatibility with IE should be a one-time affair, provided the stylesheet won’t be modified after the fact. But that’s exactly what will be happening here, in effect. While I don’t plan on changing the “wrapper” of the site (header, comments area, etc.), I do plan on modifying the style of the entries with some degree of regularity.
Writing entry-specific CSS is already quite a bit of work (albeit enjoyable work, at least for me). But having to spend time in Parallels, tweaking individual entries for IE… well, let’s just say that falls above my tolerance threshold, and would not only limit the CSS capabilities I could exploit, but would also likely discourage me from making the effort at all.
Of course, there’s also the fact that I’m fortunate enough to have an IE readership of virtually zero, which should be enough justification in and of itself, as far as I’m concerned. But it was nice to get that out of the way.
The grand irony of all this is that while I was able to hide the universal site styles from IE (thanks to @import url("stylesheet.css") screen;), I couldn’t figure out a way to hide entry-specific CSS, which is embedded in a <style> element in the HTML. So styled entries look particularly odd (not to mention potentially unreadable) in IE at the moment. If anyone knows of a validating method of hiding embedded stylesheets from all versions of IE on Windows, I’d greatly appreciate it.
I just realized the Safari CSS hack I’m using to compensate for Safari’s inability to apply padding to certain form elements doesn’t validate. Boo. I’ll have to find a validating one.
As much as I’d love to take all the credit for the nifty auto-expanding comment box, the reality is I’m a JS n00b who couldn’t code his way out of a paper bag. All thanks go to Peter Michaux for his ingenious script.
In addition, the comment form layout was shamelessly ripped from Greg Storey’s Airbag. What can I say, I like it. And evidently, I’m not the only one.
The text of this site should render in Palatino on Mac, and Palatino Linotype on Windows. That it should look mighty fine on Mac is a given. But if you’re using Windows (XP), do your eyes a favor and enable ClearType. While fonts like Verdana and Georgia were designed for low-resolution screen display, Palatino was not, and it shows.
Less metablogging from here on out, eh?
3 Comments
ZOMGS this text expandee thingie is so cool! @_@ Your blog entertains me. :D
That last sentence was so quintessentially Canadian that I felt compelled to comment.
o.o *jaw drop*
friggers to you and Andrew. Curse your javascript sites and my inability to a decent effort into designing my own.
:p very nice, though.