Mike Davidson

Archive for the ‘Code’ Category

HTML Language Equals Javascript

Thursday, July 1st, 2004

Today marked the launch of Microsoft’s vaunted new MSN Search site. The new front-page design is so clean you could eat off it. With such a simple, spartan layout, you’d think the code would be museum-quality as well.

I am not one to bring out the firing squad for minor validation errors, but the very first line of MSN’s search page is pure folly:

Yes. I’m not kidding. HTML language equals javascript. And English equals C++. It took the MSN Search team exactly 7 characters to mess this up. I guess that’s what $100 million buys you these days.

Here is an archive link in case things have changed by the time you read this article.

If there was any doubt whether or not most major sites have caught the standards bug yet, the answer is clearly no. We love our MSNs and our Googles and our Yahoos but none have yet to exhibit any real effort with regard to designing with standards. As I’ve said in previous posts, it is more important to judge web sites on what they offer versus whether or not they validate, but spectacles like this show just how far some companies are from even making a decent effort. I will reserve overall judgment on the new MSN search site until I see how well it works for me, but this just doesn’t look like a great start.

History says that regardless of user experience or code quality, the new MSN search site will be relatively “popular” once it’s baked into every corner of the Windows environment. So the question is, with this power to pervade, does it really even matter how good the code is?

Posted in Code | 40 Comments »

Making Visited Links Radical

Monday, June 28th, 2004

Everyone does visited links differently. Jakob Neilson flunkies use the old school blue-and-purple combo to help show visitors where they’ve been. People with actual design taste use more palatable colors, or perhaps a font-weight variation instead. When Mike Industries launched, visited links differentiated themselves with a subtle grey background.

Although I liked the grey background implementation, it started to look more like a highlighter pen than anything else.

I decided to rethink the situation.

Since doing normal stuff is no fun, I decided to experiment with the :after pseudo class. What character could one insert after a link to indicate that the link had already been checked? Hmmm. How about a checkmark? The standard ISO character set gives us the mathematical “radical” sign (√) which looks remarkably like a hand sketched checkmark at small sizes. So this should be easy, right? You’d think something like this would do the trick:

a:visited:after {
	content: " &radic;";
	font-size: 75%;
}

Nope. It turns out that prints the actual encoded character series for radical after each link. But by using the unicode entity instead ( \221A ), the checkmark renders perfectly after each visited link:

a:visited:after {
	content: " \221A";
	content: "\00A0\221A";
	font-size: 75%;
}

* Thanks to Jens Meiert for improving this technique as illustrated above by using a non-breaking space before the radical, instead of a regular space.

I am not so naive to think this has never been done before, but I certainly do like the effect. Sure, the :after pseudo class isn’t supported in PC IE, but at least it degrades silently in feature-challenged browsers.

Posted in Code | 28 Comments »

Converting CGI Movable Type Templates to PHP

Sunday, June 20th, 2004

I love Movable Type. I really do. But there are two things about it which really chap my hide. The first is that it doesn’t offer dynamic page serving, so I must recompile my entire site after making a change. I can live with this problem as recompiling is just a question of hitting a button and waiting awhile.

The second problem, however, is that Six Apart left a few important pages as raw CGI queries. I’m talking mainly about the Search Results page, the Comment Listing page, and the Trackback page. I understand why the company initially set things up this way since when Movable Type first came out, not nearly as many people were using PHP as they are now. But now that PHP is so widespread, it would sure be nice if the company offered its customers an easy way to convert these templates to PHP.

Short of this, I’d like to share the ways I de-CGI’d these templates on Mike Industries. If you build portions of your pages dynamically with PHP, this entry is for you.
(more…)

Posted in Code | 35 Comments »

March to Your Own Standard

Saturday, June 12th, 2004

So what’s up with the little grey button at the bottom of this site? It is my official Invalidation Badge. It’s mere presence on every page of this site renders my entire domain XHTML 1.0 Non-Compliant. Invalid. Erroneous. Whatever you want to call it. Here are the various crimes this one line of code commits:

An ampersand is not properly encoded
An alt tag is missing
An attribute called “myfavoritetag” is made up
An attribute is missing quotes
A script tag is missing its type and language attributes
A non-closing tag is missing its trailing slash
A tag is upper case… gasp!

By invalidating my entire site with this one line of code, I ensure that I am made aware the instant it matters. The instant this stuff starts to break anything in the real world, I will know. If I only had a few small errors on a few random pages around my site, I could easily miss the day when “the big switchover” happens and wind up with broken pages I don’t know about. And since this code is in the form of a server-side include, I can freely remove it with a few clicks.

It’s kind of like carrying a canary down a mine shaft with you. As long as the canary is alive and chirping, you know you’re okay for air. Actually, I guess it’s not really like that.
(more…)

Posted in Code | 68 Comments »

SEO Tests - Round 1

Sunday, April 4th, 2004

This is just a page to get the following links added to the search engine indexes. I’m running a quick test:

Posted in Code | No Comments »

Interview: The ESPN.com Redesign

Tuesday, June 10th, 2003

Interviewer: Eric A. Meyer, for Netscape Communications

ESPN.com, the online sister of the ESPN cable networks, serves up more than half a billion page views every month, so when the home page of the site dropped all layout tables in favor of structural markup and CSS-driven layout, the Web design community took notice. To add to the intrigue, the site’s design is (as of this writing) being adjusted over time, so that the site is in effect making the latter stages of its redesign process public. For a personal site to do such a thing is rare enough; for a major commercial site to do it would have been almost unimaginable.

The DevEdge team was as fascinated as everyone else, so we asked Associate Art Director Mike Davidson a series of interview questions via e-mail. We were so thrilled by his detailed answers, we decided to to split the interview into two parts rather than be forced to make major cuts for length. In this first part, Mike talks about the benefits of the new design, selling management on the move, browser testing, the ethics of upgrade requirements, and more.

(more…)

Posted in Code | 11 Comments »