Pemaquid Communications

A lot has changed over the last several years in the world of Web. In fact, I’ve been around so long I can remember when people used to complain about Netscape Navigator 4 the way they complain about Internet Explorer 6 (and they welcomed IE6 at the time).

One encouraging thing I’ve noticed over time is that even the most popular – yet horrendous – design techniques have been extinguished by demands for a good user experience. If you don’t provide a good user experience on your site, you are doomed, regardless of how much market share you have or how much you throw into your online marketing. Just ask MySpace, formerly the top social network and which finally cleaned up its act – and templates – in hopes of regaining its once-lofty positioning.

Here’s a list of five of the worst design techniques which – thankfully – you rarely see anymore:

Flash Web sites. These were created by designers who didn’t understand the mechanics of the Web, and how to design for different browsers and different conditions. Their solution was to create a design they could completely control. This often had unintended consequences, like forcing site visitors to do something that was inconsistent with the way they did things on other sites. Flash sites also don’t allow you to bookmark specific sets of content (they exist at one URL), and their content isn’t accessible to search engines (or the assistive devices used by many visually impaired people).

Splash pages. There’s a reason why everyone put a “skip intro” link on these Flash-rendered devices – people skipped them! Usability testing showed this over and over. It’s like forcing people to watch your TV commercial before they can enter your department store. Fortunately, this annoyance seems to be nearly extinct.

“this site is best viewed with…”. A few years ago, that sentence most often ended with “…Internet Explorer, version 7 at a screen resolution of 1024 x 768“. What it really said was “Our Web designers were too lazy to figure out how to design a site that worked in all browsers. Web Standards? What are they?” Now, with Internet Explorer’s market share dipping below 50% - and falling – virtually no one takes this approach any longer.

Back buttons that don’t go back. Usually deployed by incompetent, or lazy, developers who placed a javascript or redirect on one page to automatically forward a visitor to a second page upon taking some action. When hitting the back button, the redirect was triggered, sending the viewer right back where they were. What these insensitive programmers failed to realize is that roughly 40% of all clicks on the Web are on a browser’s back button, so they were triggering a tidal wave of annoyance. Good riddance.

spacer.gif. Untold terabytes of bandwidth was sacrificed earlier this decade so that less practiced designers could shim up their table-based layouts with cells that contained nothing but but a transparent graphic, often called “spacer.gif”. Table-based layouts, however, made design upgrades more time-consuming and more costly. Now, CSS-based designs and themes are the order of the day and all those spacers are no longer needed.

These, and many others like them, have gone the way of the dinosaur, rubbed out by the incontrovertible need to provide a good user experience to those who visit your Web site.

Is your favorite design quirk not listed? Let ‘er rip in the comments.

The iPad, and other ebook-readers that are fully capable of browsing the Web, will slowly but surely (OK, maybe not so slowly) change the way Web sites are designed. That’s because they offer a new user experience when it comes to consuming online content.

It’s not too surprising when you stop and think about it. The iPad and its ilk create a new kind of user experience. With the iPad, it’s easier than ever to casually kick back on the couch and flick through Web pages, as you would a magazine. Imagine casually doing anything with a laptop.

As a result, Web design will change to make this type of “casual browsing” (is that redundant?) a more interesting and pleasurable experience. I predict Web layouts will become more magazine-like, with home pages that have large, lush photography and large headline fonts that tease you deeper into a site.

Other advances in CSS, HTML5 and browser technology will also play into making this new user experience more lively and engaging.

At Pemaquid we’ve already begun moving in that direction and are taking the iPad and similar devices into account. A perfect example is the new Web site of the Midcoast Symphony Orchestra, launched last month. The bold, expansive imagery dominates the home page on a laptop or desktop monitor with a landscape layout, but it displays a quite a different – yet still successful – composition on the iPad’s narrower, taller screen.

The shape of things to come.

After building Web sites for more than a decade now, I can say that when you boil it down there are basically four types of people who build most Web sites. And three of them are not the people you want monkeying with your pixels and data, not because they’re incompetent, but because their professional interests and motivations are at odds with what makes for a great Web site.

I submit for your consideration:

Susie Sunshine (The Graphic Designer) . Susie got into design because she likes to work with colors, fonts, layouts and patterns. Designers like Susie get involved in Web design because all her Clients, for whom she already does brochures, logos, letterhead and other collateral, ask her about Web all the time (this is also how a lot of so-called “full-service” ad agencies fall into Web design work as well).

But Susie and her ilk aren’t usually great coders – in fact, they often have an aversion to it – and let’s face it, that’s not what floats their boats. So she ends up building “Supermodel sites”: they look pretty, but they break a nail or break a heel when asked to do anything athletic (interactive).

For a full-featured interactive Web site, equipped with even a simple content management system, Susie’s not your gal.

Sir Codesalot (The Programmer). Sir Codesalot can write a script to do just about anything. He’ll make your Web site sit up, beg and fetch your slippers in the morning. Content management system? Check. Chron job synchronizing online and offline databases via XML export/import schema? No problem.

But programmers far too often create systems that only other programmers could love. They’re often too complex for most people to use easily, and ignore common workflows. To make matters worse, programmers are not trained as communicators, so you often get cryptic error messages or help text that’s unhelpful because it’s chock full o’ jargon.

Sir Codealot will not slay it when it comes to your site.

P.T. Bar-Nunn (The Search Marketer). Search marketers are really good at convincing their Clients to spend money on all sorts of voodoo that may or may not bring people to a Web site (my 80-20 rule of search marketing is that 80% of the practice is drop-dead simple; but that’s a blog post for another day). Then, P.T.’s Clients pay for a monthly report filled with all kinds of statistical metrics on how well – or poorly – they are performing… and justifying more search marketing.

When it comes to actually architecting a Web site however, many search marketers are mediocre – because their focus is on the marketing, not the build. And the problem with that is that even if your search marketing campaign is successful, you could end up bringing people to A Really Bad Web Site, and that’s kinda like being The Boy Who Cried Wolf. People will come to your site based on the search marketing, but they’ll leave once they get there – and they’ll never return. At that point, your entire search marketing budget will be wasted.

Search marketing should be considered when redesigning your Web site, but don’t treat it the marketing as more important than the site itself.

Mr. Clean (The Interaction Designer). An interaction designer takes the psychology of how people browse the Web into account when building a site. He’ll first try to understand who will be using the site and what task patterns they’ll follow when navigating through it. Then he’ll use the appropriate graphic design and programming to support the needs of people visiting the site. Other architectural issues, like the types of content (news, events, job postings, resource libraries, member directories, meeting minutes, products for sale) will be taken into account to fashion a content management system that’s best for the people visiting the site.

If you want a site that gives people a great user experience (and a great user experience sells products, by the way) then look for an interaction designer like Mr. Clean.

This year Pemaquid redesigned the site of the Maine HR Convention for long-time Client Law Publishers of Northern New England. The 15th annual event, held May 11-14, 2010 at the Samoset Resort in Rockport, Maine, had over 700 attendees and more than 150 HR Expo participants, making it one of the largest of its kind nationwide.

The Convention offers high quality education, creative events, and special camaraderie for Maine’s HR professionals. This year’s high-powered keynote speakers included former Maine governor Angus King and employee engagement expert Ryan Estis.

Over the years the Convention staff has relied more and more on Web-based information management to keep things organized as the event has grown. With the 2010 redesign Pemaquid developed or adjusted a number of custom content management solutions specifically designed to help keep things organized. Here are some of the site’s key features:

Custom e-commerce. The Convention uses a custom e-commerce app designed by Pemaquid. It allows an organization to register up to six people at a time and calculates their fee based on the number of days each registrant will attend, whether they are participating in the Convention Golf Tournament, and whether they are subscribers of other materials produced by Law Publishers. Registrants can elect to pay via credit card or be invoiced.

Custom event scheduling. With the new content management system we’ve rolled out, based on the Django framework, Pemaquid created a way for Convention staff to designate some of the items on the Events calendar as workshops. This in turn allowed us to offer additional services to registrants regarding their workshop selections.

Registrant profies. Each registrant was entered into the Content Manager, along with the dates they would be attending the conference. That enabled us to customize their user experience in a few important ways and gave Convention staff the ability to better manage registrants.

Workshop selection. Registrants were each given a username and password (which they could change) as part of their profile. This allowed them to log into a members-only workshop selection section of the site where they could choose the breakout sessions they wanted to attend. Registrants had the ability to change their selections at any time, and they could print out descriptions of each workshop they had selected for a “grab-and-go” itinerary.

Headcounts. Convention staff had access to a special page that tallied up the number of registrants who had selected each workshop, allowing them to plan room assignments based on the level of interest.

Resource library. Pemaquid designed a custom resource library which allowed Convention staff to upload Powerpoint presentations, PDFs and other materials to a password-protected section of the site where registrants can log in and download them. Resources are organized by category.

Powered by Django. With this year’s redesign, Pemaquid developed a powerful custom Content Manager built atop the Django framework. In addition to the special features outlined above, Convention staff can update the copy on any page of the site, and they can create new ones, assigning the URL for search engine optimization (“www.mainehr.com/convention/my-human-resources-page”). The Django framework, which is Open Source, enabled Pemaquid to very quickly adjust and create new content management tools for the Convention site tailored to their specific needs.

Last night I gave an overview of content management systems (CMS) in a presentation organized by the Maine chapter of AIGA and held at Wycwah, the coworking space we share at 28 Maple Street. Many thanks to Programs Director Sean Wilkinson for helping with all the arrangements.

The idea was to give designers with limited experience coding a look at some of the many, many different CMS options available, and to touch on a few ways that dynamic content management can affect design decisions.

Plenty of Web design shops have even created their own CMS (Pemaquid has built one that we use both for “standard” as well as e-commerce projects). We’ve recently built one using the Django framework. The bottom line is to understand what’s available and choose the best tool for the job.

Below is a rundown of some of the content management systems that we discussed, as well as a few others worth highlighting.

Get Simple

Lowdown: As the name implies, it’s very simple to set up; no database required (it uses an XML file to store data). A basic template structure (you can alter the HTML/CSS to create new ones). You can only create one kind of page. Open Source.
Good for: Basic sites with limited navigational, content and layout needs.
Sites: Get Simple

WordPress

Lowdown: Easy setup (the “5-minute install” is a claim to fame), plenty of themes that are easy to customize, strong community. Clean admin user interface. Open Source. Perhaps not ideal for custom content needs or interaction design/layout, communities or e-commerce.
Good for: Blogging, subject matter experts, search engine optimization around a topic
Sites: TechCrunch, Scobelizer, Zeldman.com

Concrete 5

Lowdown: A little tougher to install than WordPress; it has a WYSIWIG interface for editing pages; chunks of content can easily be dragged from one column to another. Small developer community; many add-ons must be purchased.
Good for: Simple editing interface is great for non-technical administrators; a good option for lightweight content management needs on sites that may have high page counts.
Sites: Bigelow Laboratory, Kodiak Staff

Joomla

Lowdown: Easy setup (some hosts have a one-click install for it), lots of easy-to-customize themes, more available modules (“extensions”) for managing different types of content. Can be somewhat challenging to create custom extensions for a specific user experience. Admin interface not completely intuitive to novice or non-technical users. Open Source.
Good for: Projects with modest budgets and that don’t require a lot of customization or have specific content needs.
Sites: Maine Marketing Association, Guggenheim

Expression Engine

Lowdown:Feature-rich. Allows page-by-page customization of templates and layout. Core is free, but to obtain many extensions you must pay a $99 licensing fee, and a license for commercial projects is $249. Clean admin interface but unusual lingo (“Weblog”)
Good for: Personal sites for Web design professionals and those with heavy weight on visual design.
Sites: Stuff and Nonsense, Jason Santa Maria

Drupal

Lowdown: Strong developer community. Extensive collection of modules for most content management needs. Supports members-only communities. Plenty of themes, or make your own. WYSIWYG admin user interface for managing pages can be complex and challenging for non-technical or occasional admins to master; admin workflow can be difficult to learn. Interaction design can be time-consuming to customize for a specific user experience.
Good for: High-traffic sites, membership management, online publishing
Sites: Technology Association of Maine, Healthcare IT News,

Django

Lowdown: All right, technically Django is a framework, not a CMS. What’s that mean? A framework is something you use to build a CMS. Django’s framework provides the best performance of all (faster than Ruby on Rails) and it’s code is very modular and flexible: developers can create new modules easily in one section while designers create templates in another, and modules can be “plugged in”. It’s what we currently use at Pemaquid to quickly build custom content management solutions that don’t compromise the look and feel. Open Source.
Good for: high-traffic/high-content sites, online publishing, Web applications, social networks, rapid development of custom content management solutions.
Sites: The Washington Post, Flyfi, Lawrence Journal-World & News (they created it).

Have Clients asked you about the Usual Suspects yet? You know, WordPress, Drupal and Joomla. If not, they will. When it comes to choosing a content management system, most people have heard of these options. They are backed by large, devoted developer communities.

But when it comes to managing the content on your site, there are a lot of options out there.

Tonight from 6-8pm at Wycwah, our coworking space at 28 Maple Street in Portland, I’ll be giving a presentation on a variety of “CMS’s”, geared towards visual designers with an eye towards how a CMS affects the visual design of a Web site interface?

In addition to the Usual Suspects, we’ll take ExpressionEngine, Concrete 5, GetSimple and Squarespace for a spin.

We’ll also take a look at a CMS Pemaquid has built on the Django platform.

This event is brought to you by the AIGA Maine.

Register in advance for $5 or bring $10 to the door. Free gourmet pizza provided graciously by Portland Pie.

There’s no question that Internet Explorer 6 has replaced Netscape 4 as the most reviled browser known to Web development. Just do a quick real-time search to see how Web designers feel.

There’s a lot not to like. To name just a few short-comings:

• It doesn’t render the transparency of Portable Network Graphics (*.PNG files) properly, requiring a browser-specific filter
• It doesn’t render a lot of the latest CSS declarations

(I could go on and on, but why relive the agony?)

This means that Web designers need to invest extra time making sure IE6 renders their creations properly, and that makes us, um… cranky, and rightly so.

Some designers actually seem to be personally offended by people who use IE6, and want to force them to switch browsers by denying them access to their Web sites if they use IE6.

This approach is miguided and does not take into account the fact that many people cannot upgrade because they access the Web from corporate IT environments that only support IE6.

Other designers are bewildered that some people would continue to use IE6 when other options exist. The reason has to do with usability, and is best characterized by the phrase “if-it-ain’t-broke-don’t-fix-it”. In other words, people who use IE6, many of whom are non-technical, get along just fine, thank you, sending email and surfing and purchasing with adequate security. These folks have no incentive to switch.

It’s hard to get angry with people for that.

Designer Andy Clarke recently considered the options regarding the IE6 question and proposed a Universal Internet Explorer 6 CSS file as a solution. Basically, Clarke, says, serve up a plain jane style sheet that allows folks with IE6 to view a Web page’s content, but conveys the message that their browser is not up to par in terms of rendering its layout.

Some top flight designers have adopted this approach, as Jina Bolton did recently when she redesigned her personal site, Sushi and Robots. UIE6 has popped up on a couple of sites here in the Portland area as well.

So, has the time come to employ the Universal Internet Explorer 6 CSS more routinely? The answer depends on the audience for your site as well as its content.

A quick spot check of W3Schools browser stats suggests that roughly 10% of all Internet users view it through IE6 (about 4% of the visitors to this site use IE6).

If your site caters to the general public and traffic analytics show one in ten visitors are using IE6, I’d say the time has not yet come for you to switch. You’re still better off employing progressive enhancement techniques in your CSS to serve up a design that still looks sharp, if not a pixel-perfect clone of what’s seen in other browsers.

If 4% or less are using IE6, and you’re not conducting any e-commerce, I’d say you’re safe giving UIE6 CSS a spin.

But if you do use UIE6 CSS, make sure you check to see that things are rendering properly. Sometimes goodies like jQuery, bereft of the CSS used in other browsers, leave the interface looking a little messy and content unreadable. Yep, I’ve seen that on at least one local site-that-shall-remain-nameless.

Remember, IE6 users are people too. They deserve a great (if not pixel-perfect) user experience like everybody else.

Next week we’ll be talking about Pemaquid’s current approach to handling CSS for IE6.

Have any of you out there used UIE6 CSS? Let us know how in the comments.

We’ve been looking for ways to make use of our coworking space at 28 Maple that will advance the cause of digital creatives in our fair city, and tonight, from 6 – 8pm, we’ll host our first-ever evening mixer.

The event will feature a presentation by Kevin Silver on interaction design and agile development. Silver is a UX Designer at Tyler Technologies in Falmouth, Maine and he’s on the Interaction Design Association (IxDA) board of directors.

The gathering was organized by Benjamin Ho and Susan Doran, who have reorganized the local MaineUX interaction design group as the Portland, Maine chapter of IxDA (@maineixda).

Vittles will be provided free of charge by Portland Pie – and you’ll be able to wet your whistle with beer or wine. So slowly… slowly back away from the Facebook and the Twitter and come do some real life social networking with other like-minded creative types.

About Kevin Silver

Kevin is an empathetic champion of the end user and has been involved in designing the behavior of digital products since 1995. He has worked on a diverse range of projects for the government, software companies and many nationally recognized brands providing strategic direction and interaction design goodness. As a passionate advocate for Interaction Design, Kevin led the charge in forming an IxDA local group in New Mexico and is currently on the IxDA Global Board of Directors. In his role on the IxDA Board, Kevin oversees more than 80 IxDA local groups from around the world. Currently he is UX Designer at Tyler Technologies working to deliver the next generation of financial software for local governments and municipalities.

About IxDA

The IxDA Manifesto: We believe that the human condition is increasingly challenged by poor experiences. IxDA intends to improve the human condition by advancing the discipline of Interaction Design. To do this, we foster a community of people that choose to come together to support this intention. IxDA relies on individual initiative, contribution, sharing and self-organization as the primary means for us to achieve our goals.

Rob says: I’ve been giving Jordan some required reading during her internship. Here’s a book report.

The Design of Everyday Things sounds like a subject we shouldn’t need to read a book about. Especially the people who are trying to do the designing.

The Design of Everyday Things by Donald A. Norman (also known as The Psychology of Everyday Things) talks about how poorly some things are designed.

Have you ever had trouble figuring out how to open a door? Or do you constantly turn on the wrong light switch even though you use it every day? Do you have a coffee maker, or stereo, or alarm clock that has so many buttons you don’t even know where to start? Maybe you’ve even… had trouble finding something on a Web site?

These are all failed attempts at usability.

The kicker: People usually blame themselves when they can’t figure out how to use somehting, but when things like this happen, it’s not because you’re stupid; it’s because the device or object was poorly designed.

In The Design of Everyday Things, Norman talks about all the things about human nature that aid or detract from the ability to come up with the perfect design. Everything from the user’s “conceptual map” in their head doesn’t match the physical layout, or the designer’s conceptual map, to the subtle signals we have become used to, such as, a door with a vertical handle is to be pulled out and a door with a horizontal handle is to be pushed.

As long as designers don’t ignore what people already know, and the amount they are capable of remembering they won’t have a problem. As the book goes on he goes on to explain how new technology is making some design problems, like buttons with too many functions, obsolete. He describes the various issues with everyday designs with real examples that he has come across, making it an interesting and funny read.

To anyone who is interested in learning more about Usability and Design in a book that isn’t painful to read, like a lot of the informational books out there, pick up a copy.

Yesterday, as the first cases of swine flu were reported in Maine, one of our Clients, Parkview Adventist Medical Center, contacted us to put a special notice about the outbreak on their Web site, as the number of phone inquiries started to skyrocket.

We handled it by putting a “pushdown” on their home page, which linked to a page with more information on swine flu in Maine. This is a common Web design technique employed by media sites such as CNN and MaineToday.com, in which you push down the normal content/layout and insert a call out on your breaking news.

Our goals in designing our swine flu notice for Parkview were to make it:

• easily noticeable, without wrecking the layout or conveying an undue sense of alarm
• easily updatable
• accessible to visually challenged site visitors

I decided to take a tour of other hospital Web sites in Maine to see how they were handling things. Here are screenshots, taken at 4pm today, of five Maine hospital home pages:

Parkview Adventist Medical Center

Maine Medical Center

Mercy Hospital

Central Maine Medical Center

Midcoast Hospital

What I found provided what I think are teachable moments on two subjects: Web site usability and content management.

Usability

When people search Web sites for information on “swine flu”, they are scanning for text links that say, um, “swine flu”. That’s the reason we used text in the Parkview notice and made the words “swine flu” the link to the page with additional information. As of this writing, Maine Medical Center and Mercy Hospital use text. At Central Maine Medical Center and Midcoast Hospital, they use graphics containing text.

Text in a graphic is not the same as HTML text. A proven characteristic of human behavior, banner blindness, demonstrates that people see HTML text more quickly than text in graphics. People tend to ignore graphics, in part because they are reading/scanning and in part because graphics are commonly used to display advertisements (that are usually irrelevant to the information they seek).

It’s interesting to note that both CMMC and Midcoast used a picture of someone blowing their nose. While well-intentioned, IMHO this creates mental static because such a picture could mean “common cold”, “runny nose” or even “handkerchief” and not necessarily “swine flu”.

Granted, in this case the difference is subtle, but think about your own user experience on these sites (we’d be interested in your comments).

Takeaway: If you want someone to read something, make it text.

Content Management

The layout of each of the swine flu notices give us clues as to how each hospital manages content.

Maine Medical Center – I’m almost certain they use a dynamic CMS to post News updates to the center column of the home page. I’m guessing they may have wanted to feature a swine flu notice in the Flash “marquee” (“Maine Medical Center: Centered Around You”) – and they may still do this, but the Flash is probably not part of the site’s CMS, is probably not easily updateable (and incidentally would not likely be accessible to the visually challenged).

Mercy Hospital - Again, I’m almost certain they use a CMS to update the “What’s Happening” section in the center column of the home page. I’m also fairly sure this CMS limits how prominently staff can display special notices. “Swine Flu” heading has the same color and visual weight as other sub headings in this section.

Central Maine Medical Center and Midcoast Hospital – both very likely use either a staff Web designer or contractor to create banner graphics as needed.

As we’ve mentioned, for Parkview our staff manually creates HTML pushdowns for special notices like this. At some point – for Parkview and for other Clients – it would be nice to add this feature to our custom CMS, the Pemaquid Content Manager. In the meantime, our manual updates are quick and inexpensive.

Takeaway – Content Management Systems should not impede your ability to make appropriate layout decisions. CMS’s do only what they are designed to do. If they are not designed to effectively communicate things like special notices, make sure you have access to a Web designer who can get the job done (that statement is not a back-handed criticism of the designers at other hospitals).

What do you think?

When designing all these way-cool, bubblicious Web 2.0 apps, and when working with frameworks like jQuery, it’s easy to get caught up in the ajax-y goodness of it all and forget about accessibility requirements.

One reason many Web sites don’t have a higher degree of accessibility built in is that accessible design is seen as hard work. It’s one more set of best practices to wrap one’s brain around.

Often, for designers, it can seem to take the fun out of things (though it doesn’t have to be that way).

Drew McClellan has a recent blog post on the subject that illustrates the point. He talks about the Cappucino framework, developed by 280 North and billed as a way to build “desktop-caliber applications that run in a web browser”. The 280 guys are even working on a drop-and-drop IDE, called Atlas, for creating Cappucino apps.

I haven’t tried Cappucino first hand, but the word on the street is that this system is incredibly stunning, and the folks at 280 North should be congratulated for the accomplishment.

Cappucino’s javascript-laden framework, however, still has a ways to go to address accessibility issues. Hopefully, the 280 guys – and others developing similar systems – will take the time and do the hard work necessary to make sure their creations have a high degree of accessibility built in.

We can do it without losing the Coolness Factor. Focus on simple elegance in your design, make it your business to understand best practices for accessible design, and you’ll be able to build sites that work with assistive devices and are also fun to use.

Tonight I somehow ended up watching Merlin Mann‘s presentation on his Inbox Zero email management system. It’s based on the Getting Things Done method of personal productivity.

The entire video, which has been around awhile, is great in and of itself, but the thing that I want to point out here is that, about 40 minutes in, Mann discusses the various GTD apps out and about and says the ones that don’t work so well are the ones that try to do too much and are loaded with features.

Once again – simple elegance FTW.

Below is an example of a javascript that lets you easily sort columns in a table. It’s called sortable.js. It’s been around for awhile, but I thought it worth a mention.

At Pemaquid we use it for table sorting in our Content Manager (our home-grown but spunky little CMS). The nice thing about it is that it degrades gracefully. In other words, the table works just fine even if the javascript doesn’t.

More on the whole bit here.

Editor’s note: Yep, the table below is not the prettiest, and I can’t properly show code snippets at the moment. We’ll be upgrading to WP 2.7 shortly and will bang the CSS around a bit to give a cleaner display.

Technological solutions need to be simple – drop-dead simple – to be successful. If we want to make our apps accessibile to everybody, then we need to eliminate the learning curve.

Let’s pick on content management systems. There’s Drupal, Expression Engine, SilverStripe, Django, TextPattern… the list goes on and on.

They are all great tools for managing content. On the other hand, you need to have a bit of savvy to use them. Take Drupal, for example. It’s a powerful and flexible framework, but I wouldn’t turn it over to the marketing guy and walk away (I know, I used to be the Marketing Guy).

For decent interaction design for Everyman we can look to social networking sites. Facebook and Twitter are easy to use. In the case of Twitter, there is a very simple core feature set that’s fine for most folks, but just below the surface there are a ton of other goodies that experts can put to use when tweeting. That’s the hallmark of a killer app.

So when creating successful interaction design, start with simple – and keep it that way.

Cuil is a new search engine that launched today and that claims to have a search index that’s larger than Google’s (120 million pages for Cuil vs. 40 million for Google). It also sports a magazine-style interface, w/its results laid out as blocks of text in a two or three-column layout.

It segments the results in navigable categories laid out across the top of the page as well as an Ajax-y category box in the right-hand column.

I kicked the tires on Google’s new competitor this morning and Cuil has a ways to go if it wants to supplant the King of Search. To succeed, you have to be relevant, and in that regard, Cuil has a little work ahead.

For example, a search for Pemaquid Communications returned this Web site (what else?) as the first result on Google, but was listed 7th (or 6th? it’s hard to tell w/t/layout) on Cuil. Granted, they’re brand new, whereas Google has had 10 years to perfect their search algorithm.

Search results for Pemaquid Communications:
Cuil
Google

Google also pulls in more results than Cuil, at least for now (1.4 billion vs. 1.3 billion for “car” being just one example).

More importantly, as someone who deals in Web site usability, one interesting thing to watch is whether Cuil’s layout will be a limiting factor in its success. I say this for two reasons:

First, the blocks of text are harder to compare than are Google’s simple, compact line item listings (Then again, maybe the categorization features will help bring more relevant results to the top of the search).

Second, it may be difficult to build in advertiser results that will generate enough click-throughs. They could put them in the third column, I suppose, or – purely a guess – add them as a category in the results navigation bar (but I’m guessing people might not bother to click over to that tab).

Time will tell. In the meantime, it’s good for Google to have a little healthy competition.

One important rule we try to follow @ Pemaquid is to always have 3-4 Sharpies and tall stacks of blank paper when meeting w/a Client to review design comps.

It’s the easiest way to sketch out your design thoughts visually. It’s faster than using a whiteboard, and it’s much easier to sketch out ajax or design interactions with Clients – especially those who aren’t particularly Web-savvy – than it is to try to explain it to them verbally.

Pemaquid Communications has scored three nominations for techMaine‘s annual Best of the Web Awards. Pemaquid tied for the most nominations of any Maine Web design studio. The nominees are…

annie|catherine.com
Best e-Commerce Site

The site features exquisite stationery for any occasion, along with fine art prints, calendars and something racy called Go-Go Wrap! The company manages over 200 product listings in more than a dozen categories, along with order tracking and fulfillment, through a custom version of Pemaquid’s Commerce Manager.

More about annie|catherine »

MidcoastMaine.com
(Southern Midcoast Maine Chamber)
Best Non-Profit Site

This site draws out the visually appealing nature of this part of the Maine Coast. For many Internet searchers, the site is a tourist gateway to the region and it was very important to the Chamber that the site, through its look and feel, compare favorably to similar sites for more well-known Downeast destinations.

More about MidcoastMaine.com »

The Big Easy – www.bigeasyportland.com
Best Arts & Entertainment Site

The Big Easy is Portland, Maine’s premier night spot. The club wanted a new Web site that rocks as loud as they do. The Content Manager allows easy-self-publishing of upcoming events as well as multiple Photo Galleries of local bands in action on its stage. The design really makes you want to be there!

More about The Big Easy »

Best of the Web award winners will be announced at techMaine’s Gala, taking place May 20th @ the Eastland Park Hotel Ballroom.

WordPress 2.5 was released about a week ago. It sports an administrative interface that was redesigned by Happy Cog. I’ve kicked the tires on it and it’s a lean, clean machine. You may want to upgrade.

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!