mezzoblue

Variants on Stuart Robinson’s paragraph–level link hovering, acknowledging the $750 million Microsoft/AOL settlement, finding Zeldman’s link to the TechNet article that announces the death of a stand–alone Internet Explorer. Stuart Robinson recently showed us a use of the :hover pseudo–class on arbitrary elements to highlight all links in a given paragraph. An effective idea, I took his example and came up with a few variants. Scanning for links is a long–established behaviour, and unfortunately Stuart’s example adds an extra step to do this effectively, for the sake of aesthetics. My approach has come from the opposite direction, allowing the user to scan without interaction, but making it easier to do so given a bit of input. Take a look . Nothing ground–breaking here, but it’s another approach to the same concept. § And in a bit of timely news, AOL , today’s owner of Netscape, has decided to shake hands and call it a draw in their on–going suit against Microsoft. The latter has agreed to a settlement to the tune of $760 million, as well as licensing Internet Explorer to AOL for 7 years, free of charge. So if AOL gets to continue licensing IE , in spite of just recently moving their code base to Mozilla… and if IE ’s development has slowed to a halt… then… Forget it. I have no idea what any of this is going to change, if anything at all. Let’s just wait and see. § Note to self: read Zeldman before posting next time. Beyond covering the AOL /Microsoft settlement, he’s linked an elucidating transcript on Microsoft’s Technet from 3 weeks ago that neatly summarizes the future of Internet Explorer: “ IE will continue to evolve, but there will be no future standalone installations. IE 6 SP1 is the final standalone installation.” and further: “Legacy OSes have reached their zenith with the addition of IE 6 SP1. Further improvements to IE will require enhancements to the underlying OS .” Since, last time I checked, Microsoft wasn’t developing Mac OS , there’s only one way to interpret that: Mac IE is dead, and Windows IE will stumble along patch by patch, if at all, between major Windows releases. Awfully convenient to cough up licensing of a dead product, wouldn’t you say? And so we’re at a stand–still. Get used to coding for IE 6, because the underlying engine is going to be with us a good long while. § ]]>

Permalink › | 9 comments

More speculation on the death of Internet Explorer, and the Firebird experience. A bit of cruising through a network of coders’ sites this morning (starting point: Dave Winer ) offered some interesting perspective on the ‘ Is IE Dead ?’ meme I touched on a few days ago. Ron Green of Slightly Bent speculated that the lack of leaked screenshots of a new version of IE is a bad sign… his hearsay further touched on the size of the IE team, and how it looks from the outside as if it’s getting smaller daily. Take a look at the comments on his post for even more fun speculation. Grain of salt free with every link. A guy named Robert Scoble who, I presume, works for Microsoft has gotten in touch with some people in the know to get an official word of some sort. His results are vaguely discouraging. “Why is there a belief that team size means innovation… ?” — is anyone else interpreting this to read “don’t be surprised when you find out we’ve only got three holdouts left who even look at the source anymore”? And so the conjecture continues. Rumours are flying, and the only thing coming out of Redmond at this point is a conspicuous silence. This is an interesting time for the future of the browser. § In other browser news, on Adam’s prompting I downloaded a copy of Firebird (Phoenix) on Tuesday. I’m giving this a solid shot at becoming my browser of choice. I tried Netscape 7 when it was first released, but it was just too damn slow, so IE remained my default browser. Phoenix is quick, runs the Gecko rendering engine, blocks pop–ups and allows tabbed browsing. On their own, each of those features are great. Combine them all in a single browser and you’ve got a force to be reckoned with. If the Firebird (Phoenix) team can work on the installation and make it user–proof, this is the browser I will start recommending. There’s an opportunity here — selling standards to end users is a worthless proposition because they will never understand the benefit. And they shouldn’t have to. To encourge adoption of the great new browsers that are still being developed, users need to see extra features that get them excited. Tabbed browsing is a big one; pop–up blocking even more so. No one likes pop–up windows, and if you offer the average user a good, solid way out, there’s a chance they will take you up on it. Sell technology on features that are valuable to the user, not the developer. If there’s anything the dot–com fallout should have taught us, that’s it. § ]]>

Permalink › | 14 comments

A great independent music store that pays the artists directly, Douglas Bowman’s submission to the css Zen Garden and his design notes, and a reaction to Eric Meyer's musings about the future. So one of the unexpected benefits of launching the Zen Garden was that some people were so happy to see proofs–of–concept that, yes, CSS can do that, that I got a few freebies out of the deal. Nick Bradbury sent me a copy of TopStyle , which I am really digging for creating new style sheets, and a guy named Derek Sivers who owns his own music distribution company sent me a couple of great CDs. Indulge me, if you will, because Derek’s store, CD Baby , is a really REALLY good idea and I think everyone who can should support it. I would be saying this with or without the tunes (my going price for being bought off is far higher than two CDs these days. I’d need at least 4.) I’m one of these oddball anti–copyright geeks who thinks Eldred should have won, and supports just about anything that damages the RIAA these days thanks to their recent tactics. Charging ‘tax’ on blank media? Selling willfully damaged CDs that won’t play on computer CD drives? Suing 4 college students for $98 billion ? If you are at all like me on this count, allow me to open up the window and let some fresh air into the room. Derek’s business model cuts out all the overhead the music industry makes you pay for, and sends a far larger cut of the final sale price directly to the artist. You are paying only the artist and the distributor, not the executives in the middle, or the promotional campaigns of acts you don’t even like. In fact, Derek even keeps track of how much has gone to the artists. How cool is that? The caveat is that most of these artists are people you’ve never heard of. There are sample clips from all the CDs, so you can preview before you buy, however, and if you’re tired of the plastic Britneys and Creeds that the recording industry keeps forcing on us, this is arguably a point in CD Baby’s favour. We’ll now return to regularly scheduled publishing. § I haven’t attempted this ‘more than one thought per post’ idea before, so I’ve just thrown a <hr> in there for the time being. A perma–link to each thought is a problem I’ll have to face at some point. At any rate, Douglas has written a great piece on some of the challenges he faced putting together his submission for the Zen Garden , with promise of a follow–up shortly. If you’re thinking of submitting something, do yourself a favour and check out his conclusions. § Eric, Eric, Eric… You’re still, in everyone’s mind, THE master, and the guy we’ll all turn to when we need the latest and greatest. CSS–3 is around the corner, and I’m anxiously awaiting your first couple of tutorials on it in the next few years. I’m looking at YOU to teach me this stuff, man! § ]]>

Permalink › | no comments

There was an interesting article last week on Federal Computer Week, an information technology mag for the U.S. Government trade. Online Feng Shui — focus on users and not designers or committees. As a designer, you can cater to the end user’s need, provide information and create value for them, striving for the ideal of a good user experience. Or, you can cater to your client’s wants — adjust spacing, imagery, font and colour until they stop bothering you with their personal preference, and ignore the guy who actually has to use the site. Often, you end up having to do both. Clients sometimes get so wrapped up in their wants that they forget their users have needs that, if not met, will be taken elsewhere for fulfillment. The worst of both worlds is when your work results in a cheap shill to make someone a quick buck, with no consideration to the end user. This, I find, is capitalism at its worst, and I avoid this type of client as much as possible. In an article I wrote for this site in January, poorly titled “Marketing Bad, Useful Good”, I addressed a job where I had to stow my principles and create a horribly marketing–heavy site I was ashamed of. It’s worth noting that the epilogue to the story is that I’ve recently been contracted to revise my original work, because the end users were finding it to hard to use, and therefore didn’t. It’s hard not to say I told you so. update: for a much longer and more vexing look at the issue, check out Keith Robinson's post.

Permalink › | 1 comments

Well now… there’s a rumour going around that Microsoft may stop development of Internet Explorer, to focus on MSN instead. See the comments in Craig Saila’s post on CSS flubs in IE. This makes sense from a business standpoint. The browser war is long won, so it’s time to stop offering a free product and begin making money on monthly services. Consider the Mac OS situation — MSN for Mac OS X was released last week, when we haven’t seen an update for Mac IE5 in how long now? I’d be willing to wager that, with Safari and Chimera on the radar, and given the average Mac–head’s disdain for Microsoft, one isn’t forthcoming either. It’s tough to predict long–term strategy from the outside, but it wouldn’t surprise me if we only see one or two more revisions of IE for the PC before it’s left behind. Which gives the average PC user three choices — pay for MSN service, download an alternate browser, or simply don’t upgrade. Given how Microsoft won the browser wars, guess which one my money is on?

Permalink › | 10 comments

It’s a thrilling experience to see your words translated into a foreign tongue, even more so when the language is completely unrecognizable to you. With the first Zen Garden translation (Greek, thanks to Akis Apostoliadis) just about ready for prime–time, and the second one (French, thanks to Nic Steenhout) under way, I’ve had to start thinking about foreign characters.

French is a snap, since all non–English entities like â, ç, ö and so forth have well–supported character entity codes, as well as even better–supported numeric equivalents. Most of the Germanic and other European languages are built in to modern operating systems so they’re easy to handle.

But Greek… that’s where I had no experience. Would I have to save the Garden as double–byte Unicode and double the file size? I’ve played with Unicode before and, while it displays wonderfully in browsers that support it, my current ASP setup is unable to process it. IIS is incapable of parsing Unicode files, which makes them completely useless for anyone running Windows. I’m finally moving the Garden to its own domain and switching to PHP in the next few days, but I have even less experience with Apache.

Long–term planning aside, I don’t have to deal with server–side concerns yet, at least. Greek is supported well enough that even though I couldn’t see the Greek characters as I edited, assigning my XHTML the proper character set renders a viewable Greek version of the Garden in even my English browser.

Though I believe I’ve incorrectly declared my XHTML character set. I used the old standby:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Which seems to work on the document level, but according to the crib notes I should also insist on an XML declaration:

<?xml version="1.0" encoding="EUC-JP"?>

This particular encoding is just the test example, but I’ve been running around in circles trying to find out what to substitute for ‘EUC-JP’ and let my XML know that, yeah, I would rather see Greek in there. There’s no reference or link in the XHTML spec, so I did my best to pull up information on XML, which makes me break out into a cold sweat. A fruitless search ended up pointing to the Unicode site, where I found a brief Web FAQ.

I’m still not seeing my answer, but maybe I’m not being observant enough. Is there a place where I can find out how to encode an XML document in the Greek language? I will have to keep looking this evening.

The other catch, too, is that if I re–insert that XML declaration, IE6 gets thrown into quirks mode. I suppose this isn’t terrible since box model hacks abound in the Garden, thanks to IE5. In a few years when IE5 is no longer an issue though, we might be re–visiting this one.

Permalink › | 3 comments

Jeffrey explains far better than I could why this is important, but if you develop web pages in any capacity, go sign the PNG petition. You’ll be glad you did in 1 to 3 years.

For real-life examples now, load up your trusty PNG-friendly browser (NN7, Mozilla, Opera, Safari, even IE5/Mac, whatever, as long as it's not IE/Win) and point it to these pages—1, 2.

update: Also check Owen Briggs' thoughts on the matter. Good points, Owen.

Permalink › | 4 comments

Good news from the W3C today. The proposed Royalty–Free Patent Policy has been approved.

Quote: “The Policy affirms and strengthens the basic business model that has driven innovation on the Web from its inception.” They’ve hit the nail squarely on the head with this one. The spirit of the web is information sharing and openness, and it’s encouraging to see a guiding body like the W3C maintain that philosophy.

Points of interest in Tim Berners–Lee’s official decision —

• The announcement was timed to coincide with the ten year anniversary of CERN’s original, similar decision about the early web
• Support amongst W3C members of the originally proposed Royalty–Free Patent Policy has been higher than any other recently adopted recommendation.
• Recognition is made that this policy can be perceived as threatening to some business models, but it’s noted that ultimately this is the right decision for the web, not individual companies.
• There is, however, a provision made for the possibility of later inclusion of non–Royalty–Free technology. It’s understood that this is only a last resort after all Royalty–Free alternatives are explored.

The last paragraph in Berners–Lee’s decision states that no group involved got exactly what they wanted — be they patent holders or open source developers — which goes to show how political the process of developing this Policy was. In the end a balance had to be struck, and compromises made, but the end result speaks for itself.

Permalink › | no comments

One day soon I will make a post that is non CSS–related. It will happen, I swear it. On to business. Simon Willison has taken on two of the most vocal critics of CSS in the past few weeks, Dave Winer and Jamie Zawinski. Both of the mentioned debates generated a flurry of controversy, and catalyzed argument on whether to use CSS or not. Simon’s examples are coded well, documented well, and generally make a good point: using nested tables to achieve visual effect is a concept whose time is coming to an end. The more I see examples like this where existing design techniques are converted to CSS layouts, the more I see two very tense camps forming. There are people who use CSS daily, who wouldn’t give it up for the world, and who realize that quirks and bugs aside, browser support is solid enough for use. There are also people who haven’t bought into it yet, who see the somewhat inconsistent support amongst browsers, and deem the whole thing a waste of their time. A note to both camps: table–based layouts still work. They aren’t going anywhere. CSS–based layouts also work, as more and more people are proving. It boils down to this — consider who you’re designing your site for, and use the appropriate tool. If you want heavier page loads and tough code to edit, but absolutely guaranteed consistency amongst browser back to 1997, chose tables. If you want elegant code that’s a snap to edit later, but can cause headaches as you learn the quirks of today’s browsers, chose CSS. People who turn this into a silly all–or–nothing debate are missing the bigger picture here: the user doesn’t give a damn about how you built the site. They want it to load fast, they want it to navigate well, they want it to look good, and they want it to work. The rest of this is, ironically, just semantics.

Permalink › | 6 comments

Alright! Now we’re going somewhere! The Zen Garden has shown up on BD4D and Newstoday, both design portals that reach the other half of the audience that the Garden is intended for. I’ve said it a few times now, and feel free to correct me if you see it differently — the problem has been that code geeks have wrapped their mind around advanced CSS layout and know how to use it well, but they’re incapable of anything beyond simple, boxy layouts. Designers haven’t had the slightest interest in figuring it out due to sketchy browser support, and far more importantly, lack of design tools. That’s why the best graphic designers are so focused on Flash — it’s intuitive to build with, has a well–built design interface, and the coding works. All the time. In every browser. We’re hitting a turning point here, where valid CSS layout is now more than a pipe dream, it’s a legitimate way of building a site. Once designers get their mind around it and the ideas start flowing, you will begin seeing amazing things. Bet on it. (Incidentally, there have been 8 additions to the Garden since its launch, make sure not to miss the latest)

Permalink › | 17 comments

Roll call. The above two links will take you to some interesting numbers, although nothing you haven’t seen before. IE has enjoyed a majority position in the browser market for what’s going on 3 years now, and the new wave of standards–compliant browsers are barely making a scratch. Is this really much of a surprise to anyone? Let’s think about how Microsoft pulled this off: IE came bundled with Windows so that your new computer had a browser right from the get–go. The more technologically advanced of us had the option of upgrading, but we will always be a small minority. The path of least resistance in getting on the internet was and is to use the default browser, which is exactly why Microsoft won the last round, and why IE isn't going anywhere. And we shouldn’t forget about how many of us were cheering them on back then, too. What was the alternative? The oft–derided Netscape Navigator 4, which was obsolete almost as soon as it was released. Then it hung on like a bad head cold, years after anyone in their right mind could believe it. Even today traces of its odour still linger like recently disposed fish gut. So we’ve come full circle. We were ecstatic to see something better than NN4 replace it, now we’re beginning to hope against hope that something will replace its replacement. “IE is the new NN4.” I’ve heard it more than once. Given the great new browsers in the past year from the Mozilla project, Apple, and Opera, we are finally getting the standards support we’ve been aching for; but is it doing us any good at all if the rest of the world ignores them? We’re trying to hit a moving target, and they ain’t cooperating. What’s it going to take to move to the next level? Short of a revolutionary change in technology or mindset, not only are we stuck with the most popular browser vendor dragging its heels on a new release, but we’re also faced with a user base that sees no reason to upgrade. The WaSP’s recent Browser Upgrade Campaign was an unqualified success in eliminating the remaining few percentage of NN4 users, but will they have to start it up all over again once we see IE7? Tantek Çelik posts that MSN for OS X came out Thursday with a huge update to the Mac IE5 rendering engine, Tasman. That’s a glimmer of hope that something might be around the corner from Redmond for IE itself, but will even that be enough? What if no one upgrades? This is why I find it hard to salivate over the new offerings of CSS–3, and why I can’t be bothered to care about the tiny or major differences between XHTML 2.0 and 1.1. We’re not going to be in a position to actually use either of those for a very long time yet. It’s great to have new browser releases to keep the market fresh; it proves that there’s hope for the future. But for right now? There’s no point in lamenting the most esoteric CSS–2 selectors won’t work in any browser but Mozilla. Instead I’m going to take the training wheels off my XHTML 1.1 and CSS–1 and see how far I can go with the tools I have now. Come along for the ride, it’ll be more fun.

Permalink › | 7 comments

This morning as I dutifully hopped onto Amazon.ca to order my copy of Jeffrey Zeldman’s new Designing With Web Standards and bump his sales rank of 89 up even further, a few little nits popped up that need picking. The Canadian equivalent of a zip code is called a Postal Code, and comes in the format A1A 1A1 (where A’s are letters and 1’s are numbers). This standard has been around forever, and only a few possible variations exist. The correct separator is a space; however, hyphens, periods, and even no space at all are some of the more popular deviations. I’m fond of using a hyphen myself. It’s been how I’ve done it for as long as I can remember. Amazon.ca told me this was invalid though, and refused to process the form until I replaced my hyphen. The programming logic to account for this variant is so simple that it makes me wonder how this got past Amazon’s quality control; it’s on the same level as forcing someone to enter their credit card as ‘4123412341234123’ rather than ‘4123 4123 4123 4123’. According to Jeffrey, the book is making its way to the various bookstores, which means that Amazon is still reporting it as ‘soon to be released’. When pre–ordering a book, I expect it’s going to take some time to reach me, so I don’t need of any sort of priority shipment. Well, Amazon only offers Express and Priority shipping, piling on added expense to the final total. Even for pre–ordered merchandise. Is it too much to add an option for plain old regular post? Canadians already get screwed on books, price–wise. We pay a premium for American books so that cross–border shopping is discouraged. It’s not uncommon for $20US books to have a sticker price of $35CDN, resulting in over $40 paid for a single book after tax. And those are the cheap ones. My final total at Amazon.ca for Jeffrey’s book after shipping and tax were accounted for: $47. (Chapters.ca has a sticker price of $53, which probably works out to well over $60 after GST and shipping) I’m in San Francisco in a few weeks. Borders is around the corner from where I’m staying. It will be cheaper to import it myself. So much for shopping locally; go Canada.

Permalink › | no comments

Okay, who’s the smartass? And how did you do that? It made me laugh anyway, whoever you are.

Permalink › | 8 comments

Hopefully the last I’ll be posting about the Garden for a while; I’d like to go back to regular posting soon. Quickly, now — MetaFilter and BoingBoing both linked within the past 48 hours. I freaked out, but thanks to a sympathetic host, I was allowed to just bump up my account type as opposed to getting a huge bill at the end of the month. Thanks guys! I’m in good shape. I’ve had a wonderful offer for free hosting in Florida which I think I may just take over the long term. I’ll have 10GB transfer/month on my current account come June (40GB super–extra–strength account for May, to get through the deluge) but it’s debatable whether or not that will keep the Garden going. A .zip file of Garden submissions is also in the works, for learning purposes. I debated this initially, since it makes it that much easier to steal the graphics. Remember that while the CSS is free to use given attribution, the graphics belong to their respective owners. I’ll let the copyright owners decide themselves — I don’t see a problem with creating the archive with select designs removed if their owners would rather them not be included. Payola: Visit BradSoft and buy lots of copies of TopStyle. I have started playing around with my complimentary copy, and it looks rather promising. Let it be noted that while I don’t think it will be necessary to put up a PayPal button on the Garden, I am not remotely opposed to accepting free things. I’ve had a few other offers, which I may just post about when the items show up. This project has started some great discussion about the role of CSS on the current web. The reaction seems to be 95% in support, 5% still seeing too many problems with the Garden to use CSS in real–world scenarios. Note to the latter: the glass doesn’t have to be half–empty, guys. I made some mistakes, specifically around fonts, but designer error doesn’t mean the technology doesn’t work. Don’t miss Wicked Grove, RPM and Dead or Alive, the latest three additions. Oh, and for the record: it’s ‘Shea’, not ‘Shae’.

Permalink › | 5 comments

The first user submission from Jason Estes is now up and there’s another in the pipeline. I’ll try and refrain from making a special post every time a new one is added, but I get the feeling the daily links will be seeing a lot of Zen Garden action. Me, yesterday: Wow, this has been quite a trip for me. Trite given that today saw three times as much traffic. I have a 3GB monthly cap, my front page pushes 100k, and someone browsing through all five iterations of the Zen Garden is drawing about 300 to 400k; I’m worried. Crossing my fingers that my host will pro–rate their next plan up from my current. This one may have been oddly prophetic.

Permalink › | 5 comments

A couple of reactionary items to feedback on the Garden.

The URL csszengarden.com forwards you to mezzoblue.com/zengarden, which effectively breaks the back button. I didn’t realize this was happening! I definitely wouldn’t have chosen that way on purpose; when I figure out what to do about hosting, I’m hoping the domain will be the final URL instead of a forward.

The issue of font scaling has popped up a few times now.

For me, some of the designs that are posted are hard to use because I normally scale fonts up. arch4.20 and Stormweather suffer when this is done to them. I hope that font scaling and different user base fonts will be considered ‘normal’ uses that designers are expected to take into account.

— Michael Croft

I think I screwed up on that point. I’m so used to coding font sizes as pixels (and since IE6/Win doesn’t allow you to resize hard pixel values) that in my testing I never think to fool around with font size and see what breaks.

Part of the problem in a project like this is that while text can scale gracefully, images can’t. It’s inconsequential to tell a box with only a background colour to grow as text scales, but it gets a whole lot harder when that box has to fit inside another box that only has so much room.

This is one of the problems with CSS as a design language — it’s either all or nothing where fonts are concerned. It’s a perfectly valid design requirement to constrain text within a certain area; if CSS provided a way to say “resize all fonts but these ones” then the problem is eliminated. Short of serving all your text as an image, there just isn’t a way to do this right now.

Any designer worth his or her salt will agree with that point; font scaling needs to be taken into account. But it’s a give–and–take process, and you can’t expect him or her to cater to every contingency. There’s no way I’m going to be able to make my pixel–value background images work if someone chooses to browse at text–size 300%.

The wonderful thing about style sheets is that if my entire design is done with them, I can provide an alternative. If someone chooses to surf at 300%, they’ll have the option of a different stylesheet which doesn’t break. It may not be as pretty, but at least they can get to my content.

This is probably the best of both worlds. I will give you what I think is my most effective design by default. If you have problems with it, I will give you an alternative or two to chose from that will hopefully clear up those problems. It’s tough being all things to everyone; it’s substantially easier when there’s a choice involved.

Permalink › | 15 comments

Wow, this has been quite a trip for me.

The feedback so far has been overwhelmingly positive, and I appreciate everbody who has taken the time to view the work and comment. It took till this morning to see my first negative comment, when I was expecting far more of them off the mark. I knew I rushed to get it up, so Mac testing was a bit on the light side. Most people have understood this, and supported the project.

Stormweather has, of course, been the biggest problem. Seems like most every Mac browser cringed, with the added bonus of assorted Mozilli 1.3 onwards balking too. Which is odd, because Netscape 7 and Mozilla 1.0 didn’t seem to have any problems with it. Ain’t life grand? I received an e–mail from Phillipe Wittenbergh this morning with a corrected style sheet. Thanks Phillipe!

A couple of submissions have made their way across my inbox, and I hope to get my first user submission up over the weekend. This is where the project starts to get real interesting.

On to the reviews. Pardon me as I toot my own horn for a bit, but it’s comments like these that put the perma–grin on my face yesterday.

How cool is this. Via Simon Willison comes news of the CSS Zen garden, a stunning “demonstratation of what can be accomplished visually through CSS–base design.” What a fantastic idea.

— Jeremy Hedley, AntiPixel

Want to see some wonderful, and strikingly different, designs for the same content? Want to contribute your own themes? Then get on over to the CSS Zen Garden. I have two reactions: delight and jealousy.

— Eric Meyer, MeyerWeb (among others)

We need more examples which show the integration of beautiful design and solid structure. Mezzoblue's Zen Garden is certainly one of them. It’s this kind of stuff which inspires me to the core and makes me want to contribute.

— Douglas Bowman, StopDesign (emphasis his)

That rocks. Thanks also due to Craig Saila, Nathan Steiner of Web Graphics, Simon Willison of Incutio, Ian Lloyd of Accessify, the esteemed Jeffrey Zeldman, and many, many more. It’s your great comments and constructive criticism that have made the past month of work worthwhile.

Permalink › | 5 comments

With a few caveats and a bit of apprehension, I present to you my latest pet project: The CSS Zen Garden. (also available on it’s own domain) Inspired in roughly equal parts by Chris Casciano’s Daily CSS Fun and rant (of which I strongly share the same opinion), the recent Hack Hotbot contest, and an independent idea I’ve had stuck in my head forever, I finally committed to creating this. I think it’s needed. Even if it’s not, I think it’ll be fun. Now for the caveats: Macs are quirky little devils, aren’t they? I have it on good word that some of the designs work jes’ fine in Safari and IE for Mac, while others do not. Having no Mac testing machine at the present time presents a bit of a problem in squashing those bugs. One of them is still a bit weird in IE5/Win, but I’m fixing that soon. Basically, my caveats boil down to: my CSS is valid, the browsers are a bit grumpy. We’ll work out our differences. The goal was to hit some important milestones: I wanted to create a page that allows for some wildly different CSS designs, while coding valid XHTML 1.1, valid CSS, and conforming to Section 508 and AAA accessibility guidelines. Time will tell how successful the former is, but the technical requirements were met. Anyway, enjoy. I hope to address to quirky browser incompatibilities ASAP. Special thanks to Paul and Kris for the Mac screenshots.

Permalink › | 14 comments

jwz: CSS is BS Steven Canfield: CSS: Where art thou? (Height: Auto) Jamie’s issue smells to me like someone with a basic understanding of a technology throwing their hands in the air and denouncing the whole damn thing because they just can’t figure out how to do exactly what they want. No one claimed CSS was going to be a walk in the park, but assuming it isn’t capable just because you don’t figure out how to make things happen strikes me as a flawed approach to learning anything. Steven tackles a much thornier issue, one that as of yet has no sensible workaround or solution. He has obviously tried, and come up short, but that’s no reason to throw CSS out the window. I’ve never personally laid claim to CSS as being the be–all and end–all of web design. Far from it. The further I probe into what it can and can’t do, the more I realize it was designed with semantics clearly in mind over visuals. There are inherent flaws in the language that probably won’t be addressed for years to come. However quirky CSS is though, I have to conclude we’re still better off than using HTML alone to solve these problems. Okay, we can’t do everything HTML 4.0 or even 2.0 let us do. But look at how much more we can do that neither of those could. Global style, separation of content and presentation, and reduced download times are huge points in favour of the new. I’m sure the grass will always be greener on certain issues, but isn’t it nice to have more or less solid CSS support and lament a couple of trivial bits of HTML 4, rather than bemoan the lack of support for CSS while stuck with HTML 4 alone?

Permalink › | 4 comments

I’m pleased to report that California is still much as I left it back in February, but somewhat chagrined to report that airport security is still as ridiculously paranoid as ever. At 30,000 feet, I had to marvel that travelling down the United States’ west coast took all of a couple of hours. When you consider that flight was out of the reach of the average working man even up to 70 years ago, and that same trip could have taken days by car (or weeks by horse), the luxuries we consider almost pedestrian today take on a new light. In the same respect, it’s even more incredible to look out the window of a 737 and gaze from horizon to horizon, with the odd cloud interjecting the repetitively featureless landscape and ocean, and consider you are seeing the smallest fraction of a percentage of this planet’s surface. And when you add up a whole lot of these fractions you’re starting to talk about some real distances. And then without losing perspective of any of that, it’s phenomenal to think that people from that far away are able to bridge that distance and view your work, read your thoughts and access any information you wish to provide them with only the slightest millisecond of delay. I’m a half a world away from you in the U.K., you in Estonia, you in the Netherlands, and you in any one of the growing list of countries I get visitors from. But the electronic separation between us is razor thin, and you could just as well be in my backyard. It’s been expounded upon time and again, no doubt, the virtue of a worldwide network. Probably better than anything I could write, too. But until you actually go out there and consider with live visual examples what exactly that means, it’s all too easy to take for granted the absolute accessibility the internet offers.

Permalink › | 2 comments

When using CSS, the one thing that almost no thought is given to is how to format the file itself.

Most CSS examples use the verbose format, with each attribute on its own line. Like so:

p {
    text-align: left;
    font: 12px/16px verdana, sans-serif;
    color: #333;
    }

This seems to have caught on as a standard method, and while it looks nice, it’s horrendously unusable for larger style sheets. A couple of columns of text on each line fill up only the first portion of the editor and leave the rest of the window empty. Scrolling to find any given element takes far too long, and wastes too much time. There’s a better way to use that space.

I’ve started using a more compact format recently that works wonders. Depending on the size of your site, almost your full CSS definition fits on one screen, and a quick glance is all it takes to find the element you’re looking for. The above example would look like so:

p { text-align: left; font: 12px/16px verdana, sans-serif; etc. }

Not much different on the first glance, but compare these two files — verbose and compact — and you’ll see how the space savings start to add up with larger CSS definitions.

A bit onerous at first glance, I suppose, but it doesn’t take scrolling through seven screens to find the element you need to edit. It even saves a trivial few dozen bytes of line breaks and spaces, if you’re into that kinda thing.

Just a recommendation to make your life easier. You’re welcome.

Permalink › | 8 comments