Posts in the CSS Category

We’ve gotten some interesting feedback about XFN, as well as a number of blogroll adoptions and even tools that offer XFN support!  Two commentaries in particular drew me in:

• Richard Tallent pointed out that XFN could be a key component of building trust networks between blogs.  He also had some gripes about the syntax and scope, which is fine, as we don’t envision XFN as being complete by any means and are very keen to see what people suggest.  My responses can be found in the comments section of his post.
• Leigh Dodds took me mildly and quite fairly to task for some minor inaccuracies in the XFN/FOAF comparison article I wrote, and also had some great observations and ideas regarding XFN.  Leigh’s comment that he finds XFN to be elegant was especially satisfying, because Matt, Tantek, and I worked hard to keep it that way.

One of the things I forgot to point out in my announcement yesterday is that not only can you add XFN values to your links, but you can do so and still have your HTML validate— see, for example, the validator report for the main page of meyerweb— because XFN uses an existing HTML attribute (rel) in a way that HTML itself allows.  In other words, XFN enhances the Web without breaking it, very much in the spirit of Tim’s original vision of interlocking technologies that worked together to create a social medium.  That’s an important aspect of XFN, and one I didn’t want to overlook.

Of course, XFN isn’t constrained to HTML.  Any XML language can also use XFN, given the right hooks are included in the language’s DTD.  Thus, we’ve created something that works today as well as tomorrow.

We’re still very interested in suggestions and constructive criticism, so keep those posts coming!

• Friendly Discussions was published on Wednesday, December 17th, 2003.
• It was assigned to the CSS and XFN categories.
• There have been no replies.

Okay, a lot of you have managed to come up with puns and jokes similar to the one I first saw at Jay Allen‘s site, and Dunstan Orchard has taken the whole theme to the (il)logical conclusion.  One of the most common puns I’ve seen is:

#ericmeyer:first-child

Amusing, yes, but here’s the problem: that describes any element with an id of ericmeyer that is the first child of another element.  Now, I can be described that way; I am the oldest of my parents’ two children.  But it doesn’t describe Carolyn, unless we accept the convention that a child’s id should be given a value with his or her father’s name.  Such a convention would limit every father to one child, which might make for excellent social policy but seems unnecessarily restrictive from a structural point of view.

So, while this particular little joke validates, it doesn’t do what the author(s) intended, probably due to the widespread lack of understanding about what :first-child actually does. You’re supposed to be describing her, people, not me!  Every time you write an inappropriate selector, it makes the Baby Carolyn cry.  You wouldn’t want to make her cry, would you?

A selector that does describe her is:

#ericmeyer :first-child

…which is functionally equivalent to:

#ericmeyer *:first-child

Both will select any element that is the first child of another element and is also descended from an element with an id of ericmeyer.  This would also select the first children of any children that I have, so first grandchildren (and so on) would be members of the same set.  Thus, it might make slightly more sense to use the following:

#EricMeyer > :first-child

…which is to say, any element that’s the first child of an element whose id is EricMeyer—more precisely, any element that is the first child of another element and is also the child of an element with an id of EricMeyer.  I suppose that this particular selector could describe many children, as I expect I’m not the only ‘EricMeyer’ (and yes, the capitalization matters) in the world to have had a child.  But it should, at least within the confines of my docu—er, my family tree, select Carolyn uniquely.

Here endeth the lesson.

At another time of year, I might have struggled with what kind of music to play for Carolyn.  Big Band?  Classical?  Hard rock?  Some blues, maybe?  “Weird Al”?  Fortunately, there is no dilemma, as we’re pretty much playing holiday music front to back.  Jiminy Cricket sings “From All Of Us To All Of You” about twenty times a day.  Good thing I have a fondness for that record.  I’m still going to get Handel’s “Messiah,” Bach’sBeethoven’s “Ode To Joy,” and a few other pieces from Bombastic Dead White Guys into the mix.  Plus “Santa Baby” as sung by Eartha Kitt.  May as well start with the confusion early!

I’ve just read, much to my confusion, that Diana Krall and Elvis Costello were married in Elton John’s mansion, thus forming a Weirdness Trifecta.  I mean, hey, if they’re happy with each other, I’m all for it, but those just aren’t names I would have put into the same sentence.  Ever.

• Appropriate Selections was published on Thursday, December 11th, 2003.
• It was assigned to the Carolyn and CSS categories.
• There have been no replies.

As an experiment, I’ve added a ‘blogroll’ to the home page of meyerweb.  Those of you using IE/Win and the default theme (Eos) won’t see it because of positioning bugs in IE/Win, and you’ll get slightly incorrect display in a couple of other themes, but people using more conformant browsers should have no trouble.  This isn’t the list’s final form by any means—as I say, it’s an experiment.  It’s actually pushing me toward YAR (Yet Another Redesign), truth be told, one that compacts the sidebar content so that I can introduce new stuff.

Suddenly I have an idea for an update of the classic “Yar’s Revenge.”  In this new version, you control a Web designer who runs around the screen avoiding validation errors, font-sizing bugs, table-layout fanatics, CSS-layout fanatics, wandering usability experts, and snarky bloggers while trying to collect as many design components, standards powerups, and “help points” as possible in pursuit of your ultimate goal: a new redesign that’s accessible, attractive, and uses very lightweight markup.  Every level is a new redesign, each one requiring more standards and components than the last one.  Anyone who makes it past five redesigns without giving up in frustration earns the title “Web design guru.”  Once you attain that rank, you’ll have about ten times as many bloggers trying to tear you down in subsequent levels.  Have fun!

For some reason, I’m strongly reminded of the writing I’ve been doing this weekend.  I said a while back I had one chapter left to write in the second edition of Cascading Style Sheets: The Definitive Guide.  I still do, although said chapter is (at the moment) about 80% done.  It’s the chapter on table presentation, and let me tell you, it’s definitely my least favorite chapter.  I think I did a decent job explaining things, but the subject matter itself is… well, I don’t like it.  Both of my technical reviewers expressed their sympathies to me before I started writing it; that ought to tell you something.

Regardless, the chapter should be done by the end of the weekend.  Then all I’ll have to do is write/create the last few appendixes (no big deal) and go through the author review stage, where I look over the copyeditor and technical review comments and make any necessary changes.  And then it will be really and truly done.  I’m no longer sure how long it will take to finish up those last few bits, but I still hope we’ll have the book on shelves before next summer.  Keep your digits crossed…

• Rolling On was published on Sunday, December 7th, 2003.
• It was assigned to the Books, CSS, Redesign, and Writing categories.
• There have been no replies.

In rummaging through my pictures from last weekend’s trip to San Francisco, I came across another picture I just had to share: the laundry machines where Jeff Veen‘s clothes get washed and dried!  They seemed bigger than normal machines, somehow.  As if they were mighty colossi of laundry machines, towering over the cleanliness landscape and emitting peals of spin-cycle sounds that shake the skies like thunder.

Then again, I could just be projecting.

So what’s with all the pictures all of a sudden?  Partly it’s me messing around with the export features in iPhoto, which are frankly not the greatest.  It generated tons of “jaggies,” and in JPEG images, no less.  I need to find some tools that do a better job, or at least some decent plug-ins for iPhoto.  I think I said that some time back.  It’s more true now than it was then.  (Speaking of which, is there a trick to adding folders to the Dock?  I can’t seem to figure it out.)

Over the past few days I’ve run into two very familiar forms of grumbling:

• XHTML is bogus because it’s so much pickier than good old HTML.
• CSS layout is bogus because it can’t do everything possible in table-based layout.

These aren’t new complaints, by any stretch.  Heck, I myself whined long and loud about how XHTML forced everything to be lowercase—I called it “xhtml” for the longest time—and those trailing slashes looked stupid.  Over time, I realized those were silly reasons to dislike a language, especially since HTML is still around and quite available.  (What’s this site authored in?  Hmmm…)  I realized I was ambivalent toward XHTML not because it was pickier, but because it was a reformulation of HTML in XML.  That was exactly its point, and while I could see some utility in that effort, I thought (and still think) it a mistake to abandon all further work on HTML and push forward with XHTML.  I couldn’t come to that conclusion, however, until I stopped carping about things being different and took the time to understand why things were different.

As for CSS-P, of course it has limitations.  So does table-based layout.  The question is which set of limitations you’re willing to accept, and conversely which features are more important to your current project.  I still fail to understand why people have to treat everything as being a binary situation.  It’s not a question of only using tables, or only using CSS, for layout, forever and ever amen.  Some projects do well with one, some with the other, and some call for both in the same layout.  I don’t know how many times I’ve said this over the years, but I guess I’m saying it again.

And if you object to something simply because it’s new and doesn’t act like the stuff you already know, take it from me: that form of resistance isn’t going to work for long.  If you can’t deal with change, you’re on the wrong planet, and if you’re a Web developer/designer then you’re really in the wrong line of work.  Things will always change, whether it’s due to new browsers or new standards or new critical patches from Microsoft or just plain new thinking.  Your best bet is to learn as much as you can so that you can make the best possible decisions about what to do, and why.

• Lather, Rinse, Repeat was published on Wednesday, November 19th, 2003.
• It was assigned to the CSS, Mac, and Web categories.
• There have been no replies.

Off the road again: I’m back from User Interface 8, where a good time was (once more) had by all.  Especially me.  I don’t know exactly how I ended up with good-looking women in my lap so often, but I don’t think I’ll complain about it too much.  I have a huge collection of pictures that cry out to be shared, and a huge lack of time to assemble a gallery.  I could use iPhoto’s export-to-Web function, except I hate it.  I’ll have to dig up one of those cleaner plug-ins I’ve been hearing about and give it a whirl.

To catch up things that happened while I was away:

• A List Apart is back.  That in itself is cause for celebration, even if my article “Going To Print” no longer makes sense in the new template.  However, the real news from where I sit is the publication of “Sliding Doors of CSS” by the always brilliant and readable Douglas Bowman.  Check out the presentation, HTML source, and text-zooming robustness of this demonstration page from the article, and then read the article if you’re impressed—as I suspect you will be.  I’m seriously thinking about publishing a followup article to “Rounding Tab Corners” using Doug’s Sliding Doors technique, and comparing it to the techniques presented in the the original article.  Some have said that Doug built on my article, but that’s not true.  He came up with his approach independently, and if anything I’ll be building on his ideas, not the other way around.
• Russ Weakley published the Floatutorial, which “takes you through the basics of floating elements such as images, drop caps, next and back buttons, image galleries, inline lists and multi-column layouts.”  It does this with a simple yet powerful step-by-step approach that reminds me a bit of Eric Meyer on CSS, except it’s much more concise.  The Floatutorial joins the Listutorial in Russ’ oeuvre.
• The House of CSS (not to be confused with the House of Style) opened its doors, and the crowd went wild.  I like it.  Sure, it’s a whole lot of structural hacking to achieve a purely visual effect, but so what?  I didn’t think of it, and neither did you.  Or if you did, you didn’t bother to assemble it.  Chris Hester did, and he deserves recognition for the creativity and skills it took to do so.
• Apparently Microsoft’s recently started admitting that Longhorn will launch in 2006, as I predicted a few weeks ago.  A few people wrote to ask if I’m always so prescient.  The truth is, it didn’t take an oracle, a guru, or a clairvoyant to figure out that Longhorn was likely to be delayed by a year or more.  As I’ve been known to say every so often, the best predictor of future behavior is past behavior.
• In a possibly related move, Microsoft has apparently decided to save time by releasing their critical-flaw fixes in groups, or what I’m going to start calling “patch batches.”  You know what to do, right?

For no apparent reason, I’ve had the song “Rhinestone Cowboy” stuck in my head all day.  Even a potent cocktail dosage of Ministry, Joe Boyd Vigil, Crystal Method, The Prodigy, and DJ Z-Trip has failed to dislodge it.  I’m starting to think that a power drill is my only hope.

• Roundup was published on Wednesday, October 22nd, 2003.
• It was assigned to the CSS, Speaking, and Standards categories.
• There have been no replies.

Today I received my first Complex Spiral paycheck.  Yay!  I’ve done several paying jobs by now, and more are underway, but this is the first check to actually show up for deposit.  Let that be a lesson to those of you who might be thinking about striking out on your own: if you can’t cover all of the expenses you’ll incur between leaving your old job and the point two months after you finish your first project at the new job, you can’t afford it.

Yesterday, the mail brought to me a package from New Zealand.  It contained a copy of the Digital Life episode on Web standards.  That was especially fascinating since this morning an article on standards support (and the limits thereof in Internet Exporer) was published on c|net quoting me, Zeldman, and others.  With Explorer’s development at an apparent end, it’s becoming a heavier and heavier millstone around the necks of designers.  Let’s assume that there are no advances in Microsoft’s Web standards support between now and Longhorn.  That’s close to three more years of the millstone getting heavier.  By then, we’ll all have serious back problems.

(Yes, I can count: Microsoft’s Longhorn launch date of 2005 says to me it’ll actually launch in 2006.  I’m just drawing a historical inference here.)

Of course, the whole Eolas situation probably doesn’t have the Microsoft folks in a benevolent frame of mind regarding standards.  If they just abandoned the public Web and moved everything into a closed, proprietary sandbox of some kind, they might be able to avoid these sorts of problems altogether.  That’s exactly what I expect them to do in Longhorn, and the expectation worries me.  If the whole world moves into the sandbox—and let’s face it, in an e-commerce sense, IE/Win is the whole world—what reason would there be to pay any more attention to the Web?

We might say hey, fine, let’s get Microsoft and its partners the hell off the Web so we can go back to developing it the right way; let’s take back the neighborhood.  That would make about as much sense as rooting for Flash to be the technology used on every Web site in existence.  When one company owns the medium, everyone else loses.  Thus far, the Web has been a community asset, with no one company calling the shots.  How can we make sure that situation continues past the next few years?

• Checks and Balances was published on Thursday, October 9th, 2003.
• It was assigned to the Consulting and CSS categories.
• There have been no replies.

I think I’ve been semi-Slashdotted.  Having one’s site mentioned in the comments associated with a post isn’t as good as having a whole post about your book, but it’s probably still driven a lot of traffic this way.  So howdy, Slashdotters!  Hopefully this will also drive a little more traffic to my standards-oriented consulting business,  Complex Spiral Consulting.  Ser Zeldman is right on about the shift in tone over at Slashdot when it comes to standards issues.  It’s a nice change to witness.  This may be one more bit of support to my claim that Microsoft didn’t win the browser wars: standards did.

Mac OS X folks should delay not a moment longer their introduction to xlab, which I found thanks to Jeremy Keith.  xlab is chock full of tips and pointers, and it looks clean and attractive to boot.  And is that a CSS-driven layout I spy?  Why yes, I believe it just might be.

For those who were thinking about asking, I won’t be sharing with you what’s in my Dock.  This is partly because I keep it on the left and so it’s very tall, and I don’t want to waste that much space.  It’s also because I’m getting very close to dumping the Dock in favor of a registered copy of DragThing, which I use on my Classic OS machine and sorely miss in OS X.  The Dock just doesn’t have enough features to be an effective replacement.  If people indicate an interest, I suppose I could talk about OS X tools and widgets I find useful.  Otherwise, I’ll stick to the usual foolishness that passes for witty discourse ’round these parts.

• Slash Or Dot? was published on Wednesday, October 1st, 2003.
• It was assigned to the CSS, Mac, and Standards categories.
• There have been no replies.

An interesting idea: Pixy’s fast no-preload rollovers, which I first heard about in a presentation at Seybold.  It seems to me there’s one potential drawback in this method, which is that it requires that your links be an exact size, or at least never be taller than a certain size.  Since I spend a lot of time thinking about techniques that will work well even if the text is scaled up 300% or more, this “drawback” is probably more of a concern to me than to the rest of you.  I don’t mean to denigrate what Petr has done—it’s a clever technique, and has a great deal to commend it, including reduced server load.

So, Eolas.  Their claims of inventing plug-ins or applets or whatever put me in mind of a similar yet much dorkier situation surrounding the new movie Underworld, summarized rather well by the guys at Penny Arcade, as usual.  Of course, Microsoft itself patented style sheets back in the late Nineties, so it’s not like they’ve never been down that road themselves.  I’ll freely admit that Microsoft never did anything with said patent, and that puts them a step above Eolas in the trudge toward something resembling the faintest shadow of a moral high ground.

One of the reasons I’ve not gotten too worked up about all this is I still have this idiotic faith that reason will, eventually, prevail.  The British Telecom “patent” on hyperlinks came to nothing, so far as I can tell.  Whether this was due to a court throwing out the claim, or the collective will of the Web ignoring it outright, I’m not sure, but that’s sort of the point: it was never a big deal.  I keep thinking whatever process got us there will similarly operate in the Eolas case.  I can’t do much about it either way.  Hey, maybe Eolas did patent the process of whatever it is they claim to have invented years after other people had already done it.  Great.  As soon as I secure a patent for my novel method of representing complex information using only the integers one and zero, I am so going to clean up in the courts.  (Hat tip: Chris Lilley, ca. 1999.)

Of course, we also have ISO and OCLC poisoning the community well in different but still deeply distasteful ways, so maybe I should reconsider my faith in reason winning the day.  Is it time to pull out the term “morons” yet?  How about “scummy bastards?”  Somebody let me know.  Meanwhile, I generally find relief from goofy humor and mind games (of the good sort), so let’s try some of that on for size, shall we?

Davezilla shares a semi-coherent translation on a snack-food packet (for more such goodness, please to enjoy the site of Engrish).  I’m reminded of one of my favorite business cards of all time; it came from a fortune cookie factory in San Francisco’s Chinatown.  This card stated, in bold red capital letters near to bursting with pride, “WE SPECIALIZE TO MAKE ALL OCCASIONAL COOKIES.”  Sadly, this glorious bit of prose no longer graces the new cards they now hand out, which instead inform us that they are happy to offer novelty adult cookies.  I sometimes wonder if that simply means that the fortunes come with the words “in bed” already printed at the end of the phrase.

The page I’m about to point to is best viewed with a fairly wide browser window, because it’s peppered with some very wide images, but “The latest works” is very much worth visiting if you’re fascinated by optical illusions.  I’m always intrigued by examples of the brain percieving motion where there is none, and sometimes wonder if this capacity is in some weird way the neurological basis for conspiracism.  Note that not all the examples may work for you; only about half to two-thirds did for me.  But the ones that did… wow.  I expect it’s the closest I’ll ever come to being a synaesthetic.

• Dynamic Mental Static was published on Friday, September 26th, 2003.
• It was assigned to the CSS, Humor, and Politics categories.
• There have been no replies.