Alex Hardy

As a follow up to my post about the future of Microsoft Internet Explorer, I should note the passing into history of another browser. AOL ended support for Netscape as of February 1st, effectively pulling the plug on its life support.

I started to learn web design and development at university in 1996. At that time, Netscape Navigator was a major player in the browser market. Since then its market share was eroded by Microsoft’s integration of IE with Windows, upstarts like Firefox and an apparent lack of interest and direction from AOL (who bought it in 1999).

So Netscape joins IE5 on the list of dead browsers where the difficulty of supporting them massively outweighs the benefit. The number of visits I get from Netscape users is so negligible (0.13%) that it is no longer worthwhile to test against it.

AOL’s advice to Netscape users is to upgrade to Firefox.

UPDATE: Corrected a factual inaccuracy in the original post.

Microsoft have posted on their IEBlog that they have decided to modify their stance on version targeting in Internet Explorer 8. The previous suggestion that developers would have to explicitly invoke IE8’s standards compliance mode (via a meta tag) was a well-meant but controversial move.

The rationale was that the doctype switch is no longer effective. Less educated web developers were expected to omit the doctype in ignorance of its purpose, but equally well-meaning software authors have added them into the page templates in their applications.

Microsoft, quite rightly, take their responsibilities as the dominant browser maker seriously and don’t wish to “break” millions of websites in pursuit of web standards support. The goal was to find the lesser of two evils.

Purists were not happy, even though high profile developers like Jeffrey Zeldman and Shaun Inman came out in favour of it. In Inman’s words:

The strong have always been tasked with carrying the weak. In the case of the ongoing X-UA-Compatible bluster, the strong are the savvy standardistas. The burden? A single meta tag or http header. Can we move on now?

If you were knowledgeable enough to add the tag they argued, then go ahead and add it and stop moaning. Fair enough…

Microsoft have decided though that even this is not fair enough, and have done a u-turn in favour of standards. A meta tag switch will remain, but for those that want their pages to render as under IE7. If your website looks wrong under IE8 standards mode, it is far less painful to quickly add a tag while you address the problems than to have a broken website.

I applaud this move, and Microsoft’s commitment to openness and interoperability. Apple could learn a thing or two about that. The “browser wars” will be truly over not when only one app is left standing, but when web professionals can get on with creating content without worrying about browser quirks.

I’ll file this ramble under web standards because it is about standards on the web. The general quality of writing on the web never ceases to disappoint. I don’t mean the subjective matter of how interesting a website is or how thoughtfully articulated a blog post’s argument; I mean the careless way that people write.

You can (arguably) indulge the typical blogger for being an amateur writer. Freedom of expression isn’t just for those with a certain degree of education. I lose count though of how often I see for example, an inexperienced web designer berated for their poor grasp of semantic HTML by others who ought to be more troubled by their own grasp of basic spelling.

When professionals get sloppy, it’s embarrassing. Take the word “schadenfreude” – a German word with no exact English equivalent which means pleasure taken from someone else’s misfortune.

What a word for MacUser magazine to misspell in a recent post about Rob Enderle. I can’t deny it’s fun to highlight Enderle’s stupidity, but it’s better still when people trip over their own pretentiousness. I bet commenter #1 had schadenfreude indicating that blunder. I’ll close then with a few tips for those writing on the web:

• Inch marks are not the same as quote marks “ ”
• A hyphen is not the same as an en dash –
• Those little red lines underneath your words indicate misspellings
• Take a moment to fix them

That concludes today’s rant.

In a riveting bit of non-news, Apple and Microsoft have extended their deal which allows Apple to supply core Windows fonts (such as Times New Roman, Arial and Verdana) with Mac OS X. In a joint statement the two companies said:

Apple customers, developers and web designers can safely specify fonts knowing that their documents, presentations and web pages will appear as they are meant to be seen on screen and in print.

While this is obviously good news (ie: any other decision would be unthinkable), I can’t help but feel like an opportunity has been missed. With Windows Vista only just released, and Mac OS X Leopard almost here, is consistency through mediocrity the best we can expect in the year 2007?

Must we resort to CSS image replacement or sIFR to create a simple heading?

Granted, Verdana is OK (at small sizes) and Georgia is nice too. Arial however is a sorry substitute for Helvetica and in widespread use simply because it was cheaper. Instead of a handful of “web safe” fonts, why don’t we have hundreds? Surely billion dollar corporations can take a font licensing fee on the chin to elevate design across the web? Helvetica, Gill Sans and Futura would be a good start…

While we’re dreaming of changes let’s ban Comic Sans

I’m pleased to see two great web development applications get the recognition they deserve at this year’s Apple Design Awards.

Coda 1.0

Coda by Panic takes the award for Best Mac OS X User Experience:

Coda is a unique web development environment that offers a complete file browser (both locally and remotely), publishing, full-featured text editor, WebKit-based preview, CSS editor with visual tools, full-featured terminal, built-in reference material, and much more. Coda is the Mac’s first one-window Web development application that integrates numerous modules into one cohesive user experience.

CSSEdit 2.5

CSSEdit by MacRabbit wins Best Mac OS X Developer Tool:

CSSEdit has a polished and focused Aqua interface that sports flexible tabs, intuitive visual editors, and exhibits extreme attention to detail. CSSEdit offers real-time styling for absolutely any web page using technologies in a variety of ways.

If you are a Mac user and you make websites, I highly recommend that you check both of these out.

Meanwhile the runner-up award for best game goes to Wacky Mini Golf, reminding us that the Mac games market is still very dry. The EA and Id announcements haven’t come a moment too soon. Maybe the Mac will get Crysis. Fingers crossed…

Apple have released a public beta of Safari 3 for Mac and Windows. It will be released as part of Mac OS X Leopard in October, and for Windows XP and Vista presumably around that time.

Their main reasons for doing this appear to be:

1. Provide Windows-based developers with a browser that they can use to effectively test their web apps designed for iPhone
2. Continue to infiltrate the Windows operating system with Apple software, in the hope that more Windows users will consider “switching” to the Mac
3. Increase their revenue from Safari’s integrated search

As for the rest of us, “Oh good one more browser to test in…” we all sigh. In fact that is the least controversial aspect of this release:

Naughty

Safari for Windows brazenly forces a Mac OS X style window and preference pane onto its users. This may not seem like a big deal to some, but there are many (especially Mac developers) who feel this is very shabby. It’s precisely the kind of activity that causes loud criticism when done in reverse. Firefox for Mac is often criticised for looking like a Windows app, a fact that Camino has cleverly exploited.

Media apps such as RealPlayer and iTunes usually have a non-standard interface so you accept it. Web browsers by and large do not. For Apple to show such disregard for design conventions is a disgrace. It’s especially poor when you consider the excellent job that Microsoft have done of making Office, Messenger and the late (but fondly remembered) Internet Explorer 5 feel right at home on the Mac.

I think this kind of behaviour is liable to put Windows users off Safari.

Not only this, but the Mac beta is a right old mess. It requires a install/restart, and overwrites the webkit framework so that some Dashboard widgets break! D’oh! Good luck removing it…

It’s not all doom and gloom though:

Nice

It claims to be the fastest browser available today, and while I can’t confirm that it does run very snappily on my Boot Camp XP Pro installation.

Truth be told, the improvements over Safari 2 are very modest. Autofill, inline find, pop-up blocking, tabbed browsing etc are all features that we take for granted nowadays whether we use Safari or not. I’ve never been interested by its RSS support, having recently moved from NetNewsWire to Google Reader.

Mercifully it renders consistently with the Mac version. Text quality is nice and even form elements are the same (whether that’s a good thing is your call). I’ve also noticed some minor rendering improvements – labels are now clickable for instance.

Time will tell whether Safari manages to take some of Firefox’s market share. I think the proportion of people who consider their web browser enough to download another is much smaller than the market itself. I still choose Firefox because of Google Browser Sync and Chris Pederick’s Web Developer Toolbar, but there may be some for whom it fits the bill nicely.

Joe Trotter, in post entitled “God I Hate WordPress”, writes:

I have a penchant for knowing - just, well, knowing - when a blog or website is powered by Wordpress. You know? Way too many links in the sidebar or header, usually styled the same way? Info all over the place? A candidly modified Kubrick theme? Referring to static pages as, omigod, Pages?

*Looks around my blog design. Hmm.*

WordPress sites tend to be a bit simple and standardised in layout, but I would have said the same of CSS-based sites in general a couple of years ago. At the time, I remembered the learning curve and put this down to designers getting to grips with new techniques.

WordPress, like Movable Type is just a database and a set of tools for content creation and presentation. It can’t be held accountable for the shortcomings of a site’s design. That would just be a poor workman blaming his tools.

Templates also have their place. They allow people who lack the design skills, or perhaps simply the time, to get a site up and running. I have valued my first few months using the standard Kubrick theme because it was a discovery phase. It removed the barrier to writing, and allowed the content of my site to develop organically.

When I released this design for my site, I made no bones about the fact that this is Version 1.0 and that I had been modest in my attempts to customise the standard layout. As I observe trends in what I choose to write about, future redesigns of this site will support that to greater degree.

If Trotter chooses to abandon WordPress as a backlash against its ubiquity, I think that’s a bizarre decision. If as he says, he seriously aspires to have a blog as highly regarded as John Gruber’s Daring Fireball, it will be the quality of his writing that achieves that. It will have nothing to do with his blogging platform of choice.

Admired web design studio Happy Cog have updated their website.

Home to author and web standards advocate Jeffrey Zeldman, as well as designers Jason Santa Maria, Greg Storey and Dan Cederholm, Happy Cog publish A List Apart, host events and somehow find the time to design websites for the likes of Amnesty International.

So a redesign of their own website is bound to cause a stir among the web design community, and it doesn’t disappoint.

Zeldman has a post describing the rationale for the design on his personal website. The crux of it is that it connects the diverse activities of the company by expressing them in a sentence and building the navigation upon that statement.

As usual, their design is simple and effective with a warm, friendly palette. I also note with interest that their blog is built on WordPress.

Have a look. While you’re at it, buy Zeldman’s book Designing with Web Standards. I’ve read the first edition, and it proved a solid starting point for learning XHTML/CSS based design.

I thought I’d kick off a new section. As I mentioned in a previous post, I’m going to keep a record of things I find interesting or inspiring. It might be anything - a website, movie, videogame or something further afield like an interesting art or design book, an exhibition, a piece of architecture or something from the natural world (there are some pretty wild designs there!).

It’s a Friday and I’m feeling unwell, so I’ll make my first post a brief one. It’s a website from my home town.

It’s the Manchester City Galleries website by Manchester agency Reading Room.

The graphic design is clean and simple, not really much to write home about (or indeed post about), so why am I drawing attention to this site?

Go to your browser options, and increase the text size. Notice how, instead of the usual effect (the text getting larger and the page layout breaking), the whole layout enlarges - images and all. In some cases you observe some wrapping as elements get too large, but it works well for the most part.

For the web designers among us, they’ve done this by setting body {font-size:62.5%;} in CSS, which makes 1 em = 10 pixels. They then specify the dimensions of everything with ems. So the image of the front entrance is sized as {width:16em; height:15.2em;} - in effect 160px x 152px. So because ems are a measurement that scales when you enlarge the text everything grows proportionately.

This is great for people who have poor eyesight who habitually enlarge text, or perhaps just those on fancy high resolution screens.

Very clever indeed.

I’m in the midst of poking around in code, so I thought I’d open the old browser testing can of worms. Here are the browsers I prioritise in order:

1. Firefox (Mac)
2. Safari (Mac)
3. Firefox (PC)
4. Internet Explorer 6 (PC)
5. Internet Explorer 7 (PC)

[EDIT] To clarify, the list is the order that I test in, not of importance. That order would go: IE6, IE7, Ff (PC), Safari (Mac), Ff (Mac).

The Mac browsers are higher up the list because I work on the Mac. It makes sense to use the tools at hand. I have two reasons for placing a higher priority on testing in IE6 than IE7, its majority market share and simply that IE7 is a marked improvement. If your web page renders acceptably up to the point of testing it in IE7 you’ll probably find no issues at all. Mercifully there are ways to run both IEs without needing two PCs.

Where it comes to minority browsers like Opera I take a more relaxed view. If the latest version of the browser renders the page in an acceptable manner, then it’s fine. Users of such applications are technically savvy enough to have actively chosen their browsers. It’s safe to assume that they maintain up to date software. It isn’t worth the time and effort it takes to hack your way around the quirks of obsolete software. For this reason I’ve (reluctantly) abandoned testing in IE5 for the Mac.

I use the word acceptable rather than identical. When testing a web page you should view it in isolation - the question isn’t “does it look the same?” because pixel-perfect reproduction from one browser to the next is an impossible goal. The subtly different text sizes, line spacing or even anti-aliasing alone will see to that. The question is “does it look right?”

In case you wondered which browser I prefer, let me spell it out

So, you web designers out there: what’s your take on this issue?