Pemaquid Communications

Today turned out to be an interesting study in usability, the power of Habit, and backwards compatibility. A colleague - she’s an über-geek - casually asked if I was running Firefox 3, the latest (beta) version of the popular open source browser put out by the Mozilla Project and released into the wild last Tuesday. Nope, I said, but I can fix that soon enough (it sounded like something worth doing). I downloaded it.

Alas! My productivity took a detour.

Don’t get me wrong, I’m not about to knock FF3, and it’s got lots of worthy improvements, especially in the area of security. It easily updated my bookmarks and reconfigured my plug-ins. New plug-ins were easier to install and pop ups were easier to deal with. But, as they say, it is the little things that count.

For me, that was things like the browser chrome. Whoever designed FF3 must have loved Netscape 6+ and Safari, because the chrome looks very similar to those browsers. Not a big deal, but it was a “little” detail. It took a split-second longer for me to find my bookmarks and links in the chrome (which were not _quite_ where they used to be), and all those microseconds added up to a usability issue. It reminded me of a basic tenet of usability - Don’t Make Me Think!.

In other words, the more a person has to think about how to complete a task, the less they are thinking about the task itself - and that makes it tough to concentrate. Apps that make you think will ultimately be less successful than those that don’t.

I could have lived w/that. But the clincher for me was the download error I got when I tried to install Firebug 1.1 (the version that is supposed to run on FF3). That did it - I need my Firebug! Back to Firefox 2 - at least for now.

Editor’s Note: Eureka! I found Firebug 1.2, which does in fact work on FF3. So… with that, I can bounce back up to version 3.

Before launching a new site, it’s always a good idea to run a check on its accessibility to folks with visual or other physical disabilities.

One of our favorite tools for checking Web site accessibility is no longer available. The WebXact service from Watchfire had a very comprehensive free assessment tool that not only checked accessibility but also other important components of the Web page to make sure it was well-formed. Alas! IBM, which owns Watchfire, decided in February that the tool would no longer be offered for free - it now costs a very steep $1,580 for a 12-month license.

Not surprisingly, according to one metric I use, the site’s traffic plummeted in March to half of its previous levels. I expect April’s traffic numbers will be down even further. Perhaps a better idea would have been for IBM to continue offering WebXact for free while posting ads for content relevant to those using the service.

No matter. Other excellent free tools are available. Here are a few we use at Pemaquid:

• Cynthia Says Portal (contentquality.com) - from HiSoftware, a company that develops accessible software. Just enter the URL of a page in question on your site, and the service will run a report to show how it measures up against the Web Content Accessibility Guidelines and Section 508 guidelines. The report is thorough and runs very fast. It’s become the spot-checker-of-choice for many top-flight Web design firms.
• WAVE - runs a similar report when you enter the URL of a page. Offers a visual view of the page as well as some other features, including a text-only view. Not as comprehensive as Cynthia Says. Here’s a report on Pemaquid’s home page

No accessibility tool is perfect, but these two can help you avoid making obvious mistakes.

Finally, I should add Web designers shouldn’t rely on any tool to tell them whether their work is accessible. You need to do your homework. Required reading: the Web Accessibility Initiative guidelines for accessible Web design.

Seems like everybody is Twittering these days (or at least everyone in the wonderful world of Web).

For the uninitiated (unindoctrinatred?) Twitter is a service that let’s you tell your buds where you are and what you’re doing in up-to-the-minute detail (emphasis on “minute” as in ‘my-NOOT’). You can post to your Twitter via a cellphone text message and your pals subscribe to be notified when you “twitter” (verb). You can “follow” the tweets of others, having the site alert you by cellphone when friends update their accounts.

It’s this “text-message-broadcasting” that makes Twitter unique.

I’d always been of the opinion that all this twittering is not especially useful, and that instead of making life easier it adds an unnecessary layer of complexity. I recently had the perfect opportunity to test that assumption: the 2008 SXSW conference in Austin, Texas. I knew some folks who were going to attend and Twitter seemed like the perfect way to stay in immediate contact as we fanned out across the cavernous conference facilities.

At that it worked reasonably well. “Panel in Ballroom A rocks! - u should b here” or “I’m coming down from the second floor - meet me at the 4th Street entrance and we’ll go to lunch” were typical posts. On the other hand, I concluded that I could have easily survived - as I have for many years - without the tweeting.

There’s a certain tyranny about using Twitter. Ostensibly, one of the biggest reasons to use Twitter is to let your pals know where you are or what you’re thinking in up-to-the-minute fashion. So you can easily fall into a post-early-post-often-vortex in order to keep friends informed (otherwise, after all, they might think you’re dead, and come to look for you at your last-twittered location).

Many technological tools are like this. There’s a tantalizing enticement to do something you’ve never been able to do before (”Cool, I can send a single text message to a Web site and it can alert all my friends? Dude!”). We spend a lot of time in front of our computers… because we can (I’m guilty as charged). We use devices that save us time - but if we then fill up that newly-found free time with activities that aren’t very meaningful, our quality of life goes down, not up.

There’s a usability message here: before adopting a new technological device or app we should take a serious look at whether these tools truly help make our lives easier and better - or merely different.

I surfed over to a certain Maine Web site the other day and found that it had been redesigned. Here is the site navigational structure:

Can anyone tell me with 100% certainty what those items represent?

Therein lies the problem. You can’t tell what you’re going to get when you click (you can’t even tell that you can click). The only hint that this is the site navigation is that it is positioned in the spot where, if you’ve surfed for any length of time, you know that navigation is usually found.

Here’s the site, btw, if you’d now like to see that nav positioned within the overall layout.

(I don’t mean to pick on Downeast. They’re a great company and their Web site is far better than the previous version. I’m just using their site to show how you can improve the user experience on sites you design.)

Navigation is best as text. Text that is unambiguous. “About” is more effective than “Who We Are“.

Lo and behold, when you mouseover the nav on this site in question, you see a… word.

There are two big reasons why you should use text in you site navigation.

Usability. There’s an excellent book on Web design by Steve Krug called Don’t Make Me Think. In it, Krug points out usability studies show that people usually don’t read Web sites - until they’ve found that article they were searching for - they scan them. Navigational text that is simple and clear supports this scanning activity. With graphics, you have to stop and think (”hmmm… what could a camera mean?…”) This is why icons, unless they are universally understood, are also poor choices for navigational labels on Web sites.

Accessibility. In the example above, if you were visually impaired and came upon this site, there would be no way for you to understand that the images represented the site navigation. It would be much better to place navigational items towards the top of your HTML as a list of text links and to then use CSS to style the list to match your overall design concept.

Web site designs like the one in question point to a larger issue in Web design, which I call The Tyranny of Graphic Design. That’s a topic for another day, but briefly, Web design is not graphic design. It’s interaction design (of which graphic design is certainly a part). In creating Web sites, designers should take care that the graphical design concepts they produce make it easier for people to find what they’re looking for on a site, not harder.

Don’t make me think…

It’s that time of year again, when people take a look back at what they’ve done and take a look ahead. Some, including Yours Truly, still even make New Year’s Resolutions.

Seth Godin has a great post on his blog today that fits right in with that theme. He says people should think about what they’re doing right now and ask themselves if they will be proud of themselves 15 years hence. Do we think these are crazy days? Godin says that’s nothing new:

So stop thinking about how crazy the times are, and start thinking about what the crazy times demand. There has never been a worse time for business as usual. Business as usual is sure to fail, sure to disappoint, sure to numb our dreams. That’s why there has never been a better time for the new. Your competitors are too afraid to spend money on new productivity tools. Your bankers have no idea where they can safely invest. Your potential employees are desperately looking for something exciting, something they feel passionate about, something they can genuinely engage in and engage with.

If times are going to be crazy no matter how you slice it, says Godin, Why Not Be Great?

Sounds like a good Resolution to me.

Leo Burnett, the great ad man, had the same idea, which he put this way:

When you reach for the stars, you may not quite get them, but you won’t come up with a handful of mud either.

And Donald Trump said:

As long as you’re going to think anyway, think big.

To paraphrase The Donald, if you, like me, are going to build Web sites anyway, think big. Stretch a little bit this year:

• If you’re still coding layouts w/table structures, learn some CSS (Your Clients will thank you because their sites will be easier to update and maintain)
• If you’re still creating design concepts that depend on embedding a lot of images into each Web page, again, learn some CSS (Clients will appreciate that their pages are dramatically smaller, load more quickly and use much less bandwidth - bandwidth costs money)
• If you’re not yet writing valid code based on Web Standards, start (Clients will thank you when it becomes easier to maintain the look and feel of their sites across different browsers and operating systems
• If you haven’t learned about Web site accessibility, start reading up on it, and apply to your sites (your Clients, and their Web site visitors with visual and physical disabilities, will thank you for being mindful of their special needs)
• If you think it’s more important to bring people to your site - (search engine marketing) - than it is to keep them there - (Web site design and usability) - please think again (if you don’t, your Clients’ competitors will thank you for sending customers their way as they flee a hard-to-use site)

Here’s wishing you a happy, productive - and Great! - New Year!

Is it just me or did the Internet (not) seem a little sluggish today from all the excess traffic?

Today is Cyber Monday, the Monday immediately following Black Friday and supposedly the day when e-tailers’ online sales surge like the rush for a Blue Light Special.

Only trouble is, The Legend of Cyber Monday is just that - a myth, concocted by marketing consultants to spur their Clients into Web site upgrades to prepare for a virtual tsunami.

Cyber Monday historically has not been the most popular online shopping day. In fact, according to Business Week, it’s only the 12th biggest sales day online.

That’s not to say your Maine Web site shouldn’t be ready for business today. It’s just important to remember that your site should be ready for business every day.

Naturally, good Web design should be the most important part of your Web strategy, this Monday and every Monday. That’s right, even more important than your search engine marketing plan. Because today - or any day - it’s not going to matter if you’re the #1 result in Google if people click on over and find that your site is hard to use.

See you on Cyber Tuesday….

From today’s Dilbert:

View larger

Au contraire, mon ami! Usability is the most important piece of your Web strategy. Without it, the money spent on design, programming and especially search engine optimization will be wasted.

I’d like to thank Shirley Helfrich, Thomas Bennett and the folks at the Prince Memorial Library and everyone at the Southern Maine Library District for inviting me to speak the other day about Web site usability at their annual conference. Thanks for the opportunity, the thoughtful questions - and for not throwing tomatoes!

Here are some of the tips I mentioned (and some I did not), as well as some links to resources you might find useful.

Usability

• people don’t read Web pages, they scan them support that scanning activity by “chunkifying” the content on your pages (use headings, subheadings, lists, meaningful link text)
• don’t use “click here” in your link text. It’s wastes space. Use either an action word (”shop”, “review”) or a descriptive word (”apples”, “oranges”) that describes what the person will see when clicking
• if you want someone to click on something, make it look like a button
• if you want someone to read something, make it a text link (not a graphic; see banner blindness
• if it’s a link, underline it; if it’s not, don’t underline
• when linking to PDFs, spreadsheets and other files, put the filetype and the size of the file in the link text (big pdf file (PDF - 1.7MB)
• avoid uploading/linking files that are more than, say, 4MB in size (see Attack of the Giant PDF)
• don’t use “What’s New” (it gets old fast)
• review your traffic stats to see what how people are moving through your site and which sections of your site are generating the most traffic

Accessibility

• provide “alt text” for all images on your Web pages
• use relative sizing for fonts (%, rather than pixels)
• ideally, use CSS to layout your site (less code, easier for assistive devices to interpret properly)
• in forms - remember to use labels and associate labels with the proper form field - learn more
• don’t use color as the only way to represent information (as in: red = “bad”; red=”required”)

Resources

• Watchfire’s Webexact accessibility checker - great for spot-checking your work
• Web developer Toolbar for Firefox - a ton of useful tools for accessibility/usability built right into the browser
• World Wide Web Consortium’s Web Accessibility Initiative - the standards for accessible Web site design, from the folks who brought you HTML
• Section 508 - federal standards for software accessibility
• Sim Daltonism - tool for viewing Web pages as a colorblind person might see them
• W3C Markup validation service - essential tool for making sure your Web pages are coded properly
• Dreamweaver - easy to use Web editor; the latest version has excellent support for CSS
• Coda - great little Web editor; helps you work faster. For advanced users comfortable hand-coding (Mac only)
• Accessible Photo Gallery - this gallery meets the criteria for accessible display of photos, uses progressive enhancement to meet needs of viewers
• CSS1 reference guide and CSS2 reference guide - from CSS guru Eric Meyer

Books

• Don’t Make Me Think (Steve Krug) - easy read; reveals how people really interact w/Web pages, and how you can take advantage in your design
• Bulletproof Web Design (Dan Cederholm) - shows how you can use CSS to tackle common design challenges
• Designing with Web Standards (Jeffrey Zeldman) - Zeldman explains why Web standard design techniques are the way to go

Walt Mossberg reviews Leopard, the latest version of Apple’s OS X, in today’s Wall Street Journal. he says it’s easier to use than Microsoft’s Vista. His review illustrates once again that in the digital world, designing for usability will lead to success in the long run. As many as 20% of non-corporate computer sales go to Apple now, up from low single digits recently.

Why? Here’s what Mossberg says of OS X:

…It has proved to be as powerful and versatile for mainstream consumers as Windows, yet easier to use(emphasis mine) and more secure…

It works the same way for Web sites. In the long run, if your site is easier to use than a competitor’s - think Facebook (easy) vs. MySpace (cluttered and clunky) - you’ll win in the long run, even if your competitor has the #1 spot on Google.

Catching up on my required reading, I came across another useful post from Jeffrey Zeldman’s blog (as I often do) on tools to help designers predict how people with color-blindness will see their designs.

• Sim Daltonism
• Colorblind Web Page Filter

Details on each @ Zeldman’s site.

Adding to delicious….

At Pemaquid, we’ve never won any awards for our Web design (we have come close) and we don’t care if we never do.

Often, the criteria for winning a design award and the criteria for making something useful are completely different.

Donald A. Norman, of the Nielsen-Norman group, in his book The Design of Everyday Things illustrates this point wonderfully in telling how two office buildings were designed:

There really were two designs: one in Seattle, with heavy participation by the users, and one in Los Angeles, designed in the conventional manner by architects. Which design do the users prefer? Why the Seattle one, of course. Which one got the award? Why the Los Angeles one, of course.

Aesthetics are important, for sure. But in designing Web sites for our Clients, we’ll pick useful over award-winning every time.

If you’re a Web designer, 2007 is the year that Internet Explorer 6 became “the new Netscape 4″. Actually, no, things could never be that bad again, but when you’re designing Web sites using CSS and Web standards, IE6 is the one that now throws up the most humdingers.

A question I often hear from other designers is why, with IE7 and Firefox offering better support for Web standards, aren’t more people upgrading from IE6? (The latest browser statistics show IE6 use falling from about 42% to 36% during the past 8 months.)

The reason has to do with usability and cost-benefit analysis.

While most Web designers wouldn’t dream of using IE6 as their primary browser these days, especially with add-ons like the Web developer toolbar and Firebug available for Firefox, it works just fine for what most people want to do online. Checking email, reading up on sports scores and stock prices, buying shirts from LL Bean and using social network sites like LinkedIn, Flickr, Facebook and MySpace all can be done just fine w/IE6. There’s no compelling reason to switch.

Kevin Hale of Particle Tree has written an interesting article on the subject.

The upshot for Web designers? Remember to focus on usability when working with Clients to design features for an interactive Web site. Think about how customers, employees and other groups will do on your site before investing a lot of development time in creating a cool Web site feature that won’t get used all that much.

And it looks like IE6 will be with us for some time to come.

I saw a real “whopper” the other day (pun intended). I called up a Web page, and after a momentary lag as a Flash file loaded, a giant bass jumped onto my screen.

Boy, talk about a “splash page”.

An audio soundtrack of a babbling brook lingered in the background as I browsed the page.

I guess to some Web designer, somewhere, it must have seemed like a good idea at the time.

The owner of the Web site, however, was not amused. The fish had leaped into his eyeballs dozens of times and what started out as a nifty little dash of motion and sound had turned into an annoying intrusion onto the user experience.

Remember the last time you heard a good joke? It was a real belly-shaker when you first heard it, right? Now imagine hearing the same joke, at the same time, every day for an entire month. On the 31st telling, would it still be as fun to hear as it was the first time?

When designing a Web site, creativity is always a good thing, but designers need to make sure that the visual design and the interactivity don’t get in the way of what the site visitor is looking to do. Otherwise, no one will come to swim in your pond.

Web designers are often tempted to try the latest flashy technique. After all, that’s what makes Web design fun. Before you upload that snazzy whizbang, however, think of the impact your flying fish will have on potential visitors… potential customers… and especially your brand.

And as for the proud owner of the Web site w/t/giant jumping bass? He’ll be throwing that one back.

There’s an interesting article in today’s Wall Street Journal on Apple CEO Steve Job’s drive to minimize buttons. As most people in the known universe understand by now, Apple’s new iPhone lacks buttons found on other cell phones and, well, almost every other handheld device.

It’s part of Job’s overall design aesthetic - which you could sum up as Less is More.

I was reminded of Less is More a few days ago when a friend sent me a link to a new online ad campaign being run by Volvo. Shortly thereafter, I bumped into the ad campaign’s message again as part of a larger post on the topic on 37 Signals’ blog.

Less is More is certainly a good mantra for Web interface designers. Avoid “Nascar Syndrome” (the tendency to load up an interface w/links and features regardless of how often they’ll be used - hmm, there’s another post in there somewhere…) and focus on a simple, clean design that’s easy to understand.

For those of you who still may be wondering if, instead, More really is More, I submit this for your consideration:

MaineToday.com launched a new look last Wednesday - kudos to designer Wendy Clark and company! Very Web 2.0-y (gradients…speech bubbles rollovers…fades…signature mid-blue color for link text…)

There’s a lot of information there w/o getting too busy. Five good-sized images rotate through the marquee space and I especially like the calendar layout (”next seven days”) that will take you to that day’s events w/just one click (rollover gives you a speech bubble w/a featured event w/zero clicks).

One thing that threw me for a bit: it’s not obvious where you click to go to the Portland Press Herald or other newspaper sites in their group. For some reason my eye wasn’t immediately drawn to the “Hey, this look is different!” heading and the newspaper logos there (a little banner-blindness?). I finally did notice the links in the footer of the page.

All in all a great look as MaineToday positions itself as more of a social network user experience.

As everyone in North America knows, today’s the day Apple launches its new smart phone, the iPhone. Apparently no one is working today b/c they’re all standing in line to get one.

• iLine - People standing in line to get their iPhone
• iLike - New York Times says iPhone’s revolutionary interface design mainly lives up to the hype
• iDon’t - In case you were wondering, there are some people who don’t want an iPhone

What can the iPhone do? Play clip below.

Hello… Houston… we have a tech bubble. TechCrunch reports that one of the latest startups to gain funding is MizPee, a site for your mobile devices that lets you know where the nearest loo is located.

Consensus on the new site is “Huh?!?” (Read the comments). It seems most people just look for a Mickey D’s or an Irving station when they’ve got to go, instead of whipping out that cellphone and scrolling through search results.

Which brings us back to Web site usability, interestingly. Moral: think about whether people will use that Web interface before you sink millions into a Web site (oh, wait - it’s not their money they’re spending, it’s venture capital - forgot)

Looks like the whole Web 2.0 thing is bottoming out (remember companies that wanted you to buy pet food online and had sock puppet mascots?) The canary’s coughing. Deja vu, baby.

It’s official: we’re a Clicktale beta tester. We’ve set it up on a Client Web site that gets a lot of visitors to quickly gather data.

It records movies of a person’s visit to your Web site - you can see where the mouse goes onscreen, what links they click. Looks like it’ll be a useful tool for improving the user experience.

Marc Andreessen muses on his blog about switching to Mac after using a PC for the last 13 years. What does Andreessen, creator of the first browser - Mosaic - and a co-founder of Netscape, like best?

The most wonderful thing about the Mac in 2007 is that it has what Bill Joy refers to as the “it works” feature.

I’ve followed a similar path. After many years of using Windows, I finally got a Mac PowerBook Pro in February. Like Andreessen, who wanted ‘…to experience what most of the rest of the world was using…’ I felt pretty strongly about having a user experience that was similar to most Clients when surfing the Web.

Things finally came to a head for me, though, when: it took too long for my Windows XP machine to start up in the morning (10 minutes would be generous) ; it’s memory ran low (it happens to the best); and I realized I could run Windows apps on my Mac (that was the kicker - I use Parallels).

Not to mention the fact that I was planning on attending South By Southwest Interactive and would look like a total dweeb if I was the only one with a Dell (My fears were well-founded; I could count on one hand the number of PC laptops at the entire SXSW convention).

After a few months, it’s the little things about my Mac that mean a lot. I can’t explain it b/c I’ve never had the time to thoroughly investigate, but it seems like it’s easier/faster to do things like check my email. I’m betting that one fewer click for this or that activity is the reason, and after a while all those clicks I don’t have to make add up to a significant increase in productive time.

I’m trying really hard not to be a Mac snob, but that’s just it - I find myself trying really hard.

Can’t wait to see more of Clicktale, a new service in beta right now that could prove useful in improving Web site usability. It’s a service that records every mouse movement, every scrolling action and every click as people navigate your site.

Can’t wait to try it. Please let me be a beta-tester!