Posts in the Tech Category

“This page best viewed in…”

If that phrase doesn’t provoke a shudder of horror and loathing, it should.  It’s the battle cry of the Browser Wars, those terrible and ultimately futile years at the end of the last milennium.  It’s the rallying cry of those who would take the open ubiquity of the web and fragment it into a collection of gated communities, where entrance to each is predicated on running a specific browser.

“Your browser is not compatible and must be upgraded…”

All too often, because developers are too fearful or prideful or just plain lazy, they put up unnecessary barriers to entrance.  They prevent people from using their sites based on choice of browser.  Of course there are situations where the experience will be different—nobody expects Netscape 4 users to be able to see all 2007’s pretty CSS effects, just like table-based sites look beyond bizarre in Mosaic.  That’s no excuse for sites that intentionally lock users out just because their choice of browser doesn’t line up with the developer’s expectations.  It’s regressive, short-sighted, and just plain unprofessional.

“This site is for iPhone users only.”

STOP IT.  Stop it right now.

The fact that optimizing pages for an iPhone makes the development of such specialized pages attractive in no way excuses lockout of other users.  I might be willing to entertain the argument if the iPhone’s browser were some specialized non-web contraption.  It’s not.  It’s a full-fledged XHTML+CSS+DOM browser that happens to lag a bit in some implementation areas and won’t run some plugins.

Besides, if you’ve developed a version of your site (or application or whatever) that works well on the iPhone, then why in the name of Tim Berners-Lee would you deny other people that optimized experience?  You might find that they prefer to interact with the site that way no matter what platform they’re using.  You might find that you don’t need a separate iPhone version after all.  The iPhoned version might be the only version you need.

Designers will argue that pages optimized for the iPhone screen will look bad on a desktop browser.  Maybe, and maybe not, but stop preventing your users from making that decision for themselves.  Nobody says you have to convert your whole site to be iPhoney.  But your lockout of non-iPhone users is worse than rude.  It’s stupid.

We finally learned, after much sweat and a fair number of tears, that “best viewed in” is a fool’s errand.  Are we so eager to rush back into that morass and fight the war all over again?

Please.  Just stop.

• The Veteran’s Charge was published on Wednesday, August 8th, 2007.
• It was assigned to the Browsers, Rants, Standards, and Web categories.
• There have been eighty-nine replies.

So while I was off indulging in the extravagance of an extended vacation/family reunion/road trip, seats went on sale for a two-day CSS workshop in London, starring yours truly and run by the fine folks at Carson Workshops, which will run 13-14 August.  The seats are something like half-sold already, so if you want in, don’t wait.  Sorry I didn’t say anything sooner, but, you know.  Family time!

To those who do decide to attend, I make this pledge: I will not wear the blue-shirt-with-tan-slacks combo again.  This I swear.

• London Workshop was published on Thursday, July 19th, 2007.
• It was assigned to the CSS and Speaking categories.
• There have been five replies.

I don’t know about you, but I keep a “staging” file for my posts here.  It’s a text file on my hard drive where I can write posts offline, and can also keep a list of things I want to write about.  Right now, that list is longer than a typical short entry.  I suppose two weeks’ vacation (photos from which are slowly going up on Flickr) will do that to a schedule, especially with all the driving that was involved.  (And may I express my deep and unbounded loathing of the usually ambiguous and often misleading road signage in the New York City/New Jersey area?  Yes?  Thank you.  I needed that.)

So, to begin the jamcracking: AEA Chicago‘s early bird deadline is fast approaching; it’s just nine days away as I post this.  As we start gearing up for the show, we’ve re-started (and rebooted) an AEA feature called “Better Know A Speaker”.  Originally, these were testimonials from Jeffrey and me, but that turned out to be more than our schedules can accommodate.  So we’ve redone them as short interviews with speakers, which I think is far more interesting anyway.  The first of these new BKAS pieces, with Dan Cederholm, went up last week.  This week we’ve got Jeremy Keith.  In the weeks to come, we’ll cover the rest of our Chicago speakers.  The AEA news feed is of course the best way to keep up with these tidbits and other AEA info, but I’ll probably either blog or linkblog them here as well.

• Better Know was published on Wednesday, July 18th, 2007.
• It was assigned to the An Event Apart and Travel categories.
• There have been six replies.

For them what might be interested, this Monday (July 2nd) I’ll be the guest on Off By One, a half-hour technology radio show originating from the studios of WCSB in sunny downtown Cleveland and is available on iTunes as well as via the station’s streaming audio.  Locals can, of course, catch it at 89.3 MHz on their FM dials.  The show starts at 12:30pm EDT and runs a half-hour, so it will be, y’know, off by 1:00pm.  (Hee hee!)

This will be my first time on the air since Your Father’s Oldsmobile ended back in 2005 (unless you count my talk radio call-in earlier this month), and the first time I’ve done a live on-air chat about my professional work and life in about seven years.  Bart, the show’s host, and I haven’t discussed any specific topics to be covered, so if you’ve ever wanted to find out what I’m like in an almost totally unrehearsed environment, well, now’s your chance.  I’m looking forward to it.

Update [4 Jul 07]: a recording of the show is available via the “Off By One” weblog.  Apparently I say “fractional update” a lot.

• ‘Off By One’ On 2 July was published on Saturday, June 30th, 2007.
• It was assigned to the Interviews and Tech categories.
• There have been four replies.

Because the world needed another browser/platform combination to test, Apple has released a beta version of Safari for Windows.  Why?  Arguably, it’s to make sure that Windows developers have access to the browser in the iPhone, so they can make sure that their Web 2.0 sites work on the iPhone without having to buy new computers.  (Though this also robs them of the primary justification for getting an iPhone on the company dime.  Haven’t they suffered enough, Steve?)  On that note, I hope this new foray will expand the pool of people contributing ideas to Greg‘s post about cool new apps for the iPhone.  (There’s already a truly brilliant idea in there, albeit with a name I can’t use here due to readers behind content filters.  Who’s going to make it happen?)

It will also be interesting to see if the presence of another highly standards-compliant browser (joining Firefox and Opera) on the Windows platform spurs more Windows-based web developers to pressure Microsoft to maintain their momentum on the issue, so as not to see IE fall behind all the competitors.  As you might expect, I certainly hope so.

Remember: this is a beta!  There’s going to be weirdness.  PPK, for example, ran into layout problems that may or may not be related to the video card in one of his systems.  Other people are reporting crashes; though many of them are reporting crashes on CNN‘s site, which crashes my OS X copy of Safari from time to time.  Interesting to see that kind of cross-platform crash consistency.

The beta’s certainly worth checking out if you’re interested, but—as with the IE7 betas—do not start reworking your site to address layout problems in this beta.  Report them to the WebKit team instead.  When the final version (or a feature-frozen RC version) is released, it’ll be time for testing, charting, and possible reworking.

Interesting times indeed.  If you’ll excuse me, I have to go make some changes to my browser-release timeline slides.

• Windows Safari was published on Tuesday, June 12th, 2007.
• It was assigned to the Browsers category.
• There have been forty-three replies.

Thanks to everyone who shared their thinking on the ordering of link states.  It looks like a minority of people were in favor of my preferred ordering, which is: Link-Visited-Hover-Focus-Active.

The reasoning is fairly straightforward, and starts with the assumption that a person who uses solely a keyboard to navigate won’t ever encounter a hover effect.  Thus, for such users, the states might as well simply be LVFA.  For them, the placement of the hover styles is irrelevant.

On the flip side, a person using a mouse to navigate will have far more links in hover states than focus states.  Once a link is selected (clicked) by a mouse-wielder, the link enters the active state until the user lets go of the mouse button.  Then it’s both in focus and hovered, at least until the mouse cursor moves away.  (It’s also either visited or unvisited, but that’s not relevant to the question at hand.)

So in this situation, I want to provide a visual cue that the link has in fact been clicked, even though the mouse button is no longer down.  I want this to happen regardless of the hover states of the link.  Therefore, the focus styles need to come after the hover styles.  If not, the focus color will only take effect once the mouse moves away from the link, thus exiting the hover state and removing the hover color.

Yes, this will only take hold in browsers that update the focus state while asking for the requested page.  While that isn’t all browsers, it’s most of them, from what I can tell.  Safari 2.x seems to be the notable exception.  (I didn’t test 1.x, and haven’t installed 3.x yet because I don’t want to lose 2.x.)

So what mnemonics can we use to keep this ordering straight?  I’ve come up with a few.

• LoVe’s Hurts Fade Away
• Luther Vandross Hits Fabulous Arpeggios
• Lord Vader Hates Furry Animals
• Lusty Vampires Hunger For Absinthe
• Lord Voldemort Has Foul Ambitions

What do you have?

• Who Ordered the Link States? was published on Monday, June 11th, 2007.
• It was assigned to the CSS category.
• There have been twenty-nine replies.

So Microsoft announced a touch-surface interactive computing device called “Microsoft Surface“—gee, now there’s a creative name!—and practically everyone in the known universe has gone crazy over it.  Eh, I don’t know.  I might be interested, but only if they can get the proper environment running on it, as pictured here.

Oh, c’mon.  You know it’s the first thing you thought of too.

• Surface Tunnels was published on Tuesday, June 5th, 2007.
• It was assigned to the Humor and Tech categories.
• There have been twenty-two replies.

Spend any time at all writing above-beginner CSS, and you’re going to come across the “link-visited-hover-active” (LVHA) rule.  This holds that the four link states should always be listed in that order, like so:

a:link {color: blue;}
a:visited {color: purple;}
a:hover {color: red;}
a:active {color: yellow;}

Masters of the dark arts of specificity know why this rule exists and how it does or doesn’t apply, but if you’re still a padawan in these matters (or just rusty), you can get a quick refresher from this old chestnut of mine.

Now, it’s the case that this will become less of an issue over time becuase IE7 supports (and one presumes future versions of IE will continue to support) chained pseudo-classes, like a:link:hover {color: red;}.  Once you start chaining those you transcend a lot of the specificity-ordering concerns that drive the LVHA rule.  However, we’re not there yet.

Which brings me to the point of all this: the fifth possible link state, :focus.  Assuming we’re going to avoid chaining pseudo-classes for a while yet, but that we want to introduce link-focus styles, where should it fit in the ordering?  For the purposes of this discussion, assume the following:

a:focus {color: orange;}

a:link {color: blue;}
a:visited {color: purple;}
a:hover {color: red;}
a:active {color: yellow;}

We need to move the a:focus rule so it has a visible effect.  But where?  Should it come before a:hover, after a:hover, or after a:active?  In other words, which states’ styles should the focus style overwrite?

I’d like to hear your thoughts on the matter, and especially the rationale driving your answer.  Accessibility experts are particularly welcome to weigh in, but it’s anyone’s game here.

(Postscript: I know that many problems can be avoided by picking a different styling effect for the focus style, like a border or outline, or boldfacing or italicizing the text of a focused link.  Still, some people will want to handle everything through color, regardless of the problems this can cause for the colorblind or images-as-links, and I’d like to address that specific situation.  Thanks.)

• Ordering the Link States was published on Monday, June 4th, 2007.
• It was assigned to the CSS category.
• There have been twenty-two replies.