I learned about the Paste Magazine web site while in the car listening to Here and Now.  The print edition of Paste Magazine ended for financial reasons in spite of winning national awards.  The online edition continues but will switch from free to subscription this September.  I was intrigued from a business perspective.  Will an online subscription based magazine of this type fly?  Its subject is popular music, not a big money making proposition these days, and its target audience is generic youth.

I checked out the site and loved it for the following reasons:

The quality of the content.

The mPlayer – the simple, clear  user interface of their audio player.

Artist and song presentation:  the layout presents a large high- quality photograph and an easy to read scrolling text box next to it.

I also like the hybrid use of fixed and liquid layout that works and is attractive.  If you’re not a web designer you’re probably thinking “so what” but to me this is a big deal because of the horrible results I see for 99% of liquid layouts.

Here’s an example of a liquid layout that displays fine on a small screen, such as a lap top:

Now look at what happens on a large screen, such as my NEC 2690:

Tracking the text across this wide expanse hurts my eyes.  I have to resize the window to be able to read it, which is annoying.

The Paste Magazine site is a sign that web developers are getting better and better at creating a site that’s both attractive and highly usable.

Analysis by Smart Alice Web Design, smart web design for people who want a unique and effective presence on the internet.

Copyright 2011, Alice Gebura, All Rights Reserved.

Another argument emerges for simple web design (see my previous post  Creating Your Web-Scape)  in Drake Bennett’s article on cognitive fluency, Easy=True. Cognitive fluency is  the psychological precept that “people prefer things that are easy to think about to those that are hard…In any situation where we weigh information, fluency is implicated in our decisions about everything.”

In a nutshell, when information is easier to mentally process, people feel attraction and belief.  The opposite,  disfluency – making things difficult to grasp,  creates a cognitive roadblock that makes people wary and uncomfortable.

While this might seem intuitively obvious, evidence abounds that plenty of businesses (and web designers) don’t get it.

Bennett’s article is a terrific resource for more information on fluency and disfluency and the supporting research.

For the purpose of this blog let’s take a look at the practical implications of fluency and  disfluency in terms of web design.  Keep in mind this is all based on research, not my own preferences.

Disfluency:the art of making things difficult -

Web Design that Loses Business

Here are some characteristics of a disfluent web site that will leave web site visitors with a negative impression.

Inaccessibility

• Unfamiliar words (for example, technical jargon and acronyms)
• Names and words that are difficult to pronounce
• Complex syntax
• Illegible text (see my previous post The Dog and the Lotus)
• Missing information or convoluted instructions
• Functions that don’t quite work

Sensory Overload

• Overcrowding the page
• Visual distractions
• Multiple columns of disparate text
• Little or no white space
• Flickering animation

Inconsistency

• Confusing navigation
• Poor organization

Fluency:the art of making things easy to understand -
Web Design that Encourages Business

Here are some characteristics of a fluent web site that subliminally suggest to visitors that your business is reputable and trustworthy.

Repetition

• Consistent navigation and page layout across the web site
• Artful repetition of key ideas(note: repetition is good, redundancy is bad – know the difference)

Clarity

• Legible fonts and color coordination
• Plenty of white space
• Language and syntax that everyone can understand

Simplicity

• Message boiled down to its essence
• Graphic design and content that are easy to assimilate (accessible) both visually and conceptually

Web Site Analysis: The Glass House

Let’s take a look at the web site for The Glass House and see how well it does fluency wise.

Repetition: The grey box is repeated throughout as the background to the title (I like the opacity that reminds us of the see through quality of glass), the background in the drop down menus, and the background for other important pieces of information.

Clarity: The site contains a lot of information,  notice how it’s been logically organized and categorized.

Simplicity: One column layout, plenty of white space.

Verdict: Fluency.  I’m convinced this is a reputable organization dedicated to professionalism on all levels.

Analysis by Smart Alice Web Design, smart web design for businesses who want a unique and effective presence on the internet.