Luminous: Insights on websites by Michael Barrish

Vertically Center an Image with CSS - A New Method

Vertical centering with CSS is hard. It's hard in general, and it's hard when you need to vertically center an image, which is what I needed to do today.

There are many methods for this, most of which are limited to cases in which you know the height of the image to be centered. Other methods work for images of unknown height but fail in IE6/7. Fortunately there's at least one method that covers both bases; however it requires three wrapper divs on the image, which is kind of like wearing three winter coats at once. (See Vertical Centering in CSS and scroll down to "Let's make it structural and without hacks.")

Today I came up with a different approach, one in which the image is loaded via inline CSS.

Here's the markup and CSS (in this example, I'm also horizontally centering the image):

<div class="vertically-center" style="background-image: url(/media/img-walt.gif)"></div>

.vertically-center {
   background-position: 50% 50%;
   background-repeat: no-repeat;
   height: 200px;
   width: 200px;
}


An example image, vertically and horizontally centered in a 200px by 200px div:

Suffice it to say, the method is not ideal. For one thing, no alt text. For another, limited use cases. However, such use cases do arise, as one did for me today, and when it does, I plan to use it.

Published in CSS

Death of a Standardista

I've never liked the term standardista. It's the "ista" part that bothers me, as it makes one sound like a zealot, someone whose passion is potentially blinding. It's true I'm passionate about web standards, but that's is only because standards support the production of quailty websites. If spit and chicken wire worked as well, I'd be passionate about spit and chicken wire. If I'm any kind of "ista," I'm a qualityista.

The moment I realized this was an epiphany. For one thing, it helped me understand the depth of my frustration with the poor writing on certain client sites. I have no interest in building kick-ass containers for crappy content. If you've ever worked with me, you know what I mean.

For some developers, the only thing that matters is a happy client. When you think this way, your job is to determine what would make your client happy and deliver it, no matter how ridiculous or ill-conceived.

I'd like to believe that few developers are really so lacking in, well, standards. Instead, most failed sites are made by people who want to make good websites but lack the requisite skills or understanding.

But back to my epiphany. What I saw in that moment is that my allegiance is not to any particular approach or methodology, but to a result which for lack of a better term I'm calling "quality." I'm obsessed by it. I want to see it, understand it, and most of all, create it. I really am a qualityista. If you've ever worked with me, you know what I mean.

Published in WWW, Web Standards

Great Copywriting—Not for Robots

So the fine folks at Smashing Magazine did a showcase piece on 404 error pages and included the 404 page at Luminous. If you haven't seen this page, it's written entirely in haiku. As is my About page, by the way. I like haikus.

I mention this not to discuss haikus but copywriting, specifically copywriting for websites. Why does so much of it suck? Actually, I think I know why. It sucks because copywriters read what other copywriters write and conclude that website copy is supposed to sound like it was composed by robots.

Now, in fairness to copywriters everywhere, copywriting is hard. For me it's harder than any other kind of writing. This is why I turned to haikus on my About page: they helped me circumvent the constraints of the form and to do so in a way that expresses who I am, which is the underlying point of any About page.

Mind you, I'm not advocating haiku as the one-size-fits-all seventeen-syllable solution to the problem. But a little personality, a little humor, some subtle indication of one's status as a living and breathing and thinking human being, can go a long way toward improving one's copy.

The People of Flickr

When it comes to great copy, the first site I think of is Flickr. Whoever writes their stuff is definitely not a robot. Consider the opening sentence on the Flickr About page:

Flickr—almost certainly the best online photo management and sharing application in the world—has two main goals…

Sorry, robots don't write "almost certainly." "Almost certainly" is a non-robot giveaway and we're only three words in.

I know the counter-argument: Flickr is Flickr, and Flickr is cool. Whereas X Company is not cool, so it can't come off sounding like it employs any actual human beings.

I disagree. Flickr may have more leeway than some, but they created that leeway, they carved it out. Naturally you must know your audience; that's a given. But when dealing with a company, people want to feel like they're dealing with other people; that's a universal.

Of course it's not easy to find the words that convey the right kind of "personness." It's a conjuring act, really, one for neither the faint of heart nor the narrow of mind. But here's the thing: Robots can't do it.

Published in Content

The Death of TimesSelect and the Future of Web Advertising

The New York Times just dropped TimesSelect, their online premium content subscription program. The program ran for two years and was generating about $10 million a year in revenue. Content previously restricted to subscribers is now available to all.

The reason for the change is simple: money. The Times can make more of it by switching to an advertising-based model.

There's a lesson in this, and it's not that information wants to be free.

Now, I remember a time when not quite every cultural product was a vehicle for advertising, a lure for eyeballs. The web circa 1998 was like this. If you were there, you know what I mean. It was cool. But of course the web circa 1998 was a rare respite (or semi-respite, really) from the deluge.

I reveal both my age and my idealism by mentioning this.

The Immediate Future of Web Advertising

Back in the real world, as it were, I've been meaning to note my appreciation for the advertising network approach used by The Deck, particularly the fact that they only accept ads for products or services they've bought or used themselves. It's a crafty move, too, since it adds cred to the ads that appear. (The Deck adds even more cred by being selective about who gets to join the network.) But the Deck, as an idea, doesn't scale easily, so it's hard to see it becoming a widely adopted approach.

The big money, of course, is in targeted ads. The more you know about your individual readers (and evidently the Times, a registration-based site, knows quite a bit), the more you can charge advertisers to hit them up.

I'm awaiting the day, not far off, when I encounter ads aimed directed at me and addressing me by name. This will work much like Amazon's personalized recommendations except the ads will appear on sites I never previously visited and will reveal an uncanny and terrifying insight into my deepest desires.

And what will these ads be about? Ad blockers. They'll all be trying to selling me new and novel ways to stem the deluge.

Published in Ads, WWW