By Mathew Honan Email 08.24.09
Find the original post at – http://www.wired.com/entertainment/theweb/magazine/17-09/ff_craigslist_makeover

Why Craigslist Is Such a Mess
How Would You Redesign Craigslist? Suggest Your Own Makeover and Vote on Reader Contributions

The craigslist team isn’t interested in updating the site, so Wired asked leading designers to give it a user-interface lift.
Craigslist Today

Visitors arriving at craigslist are confronted by a confusing homepage cluttered with links most people will never click on. Overall, the user interface is in dire need of an organizing principle that guides you to the details you seek while filtering out extraneous information.

It’s hard to know even where to begin: Should you start your career search under Jobs or Gigs? The right side of the screen is devoted to an exhaustive list of cities and countries, although most users care about only the one they live in. Once you dive into a section, navigation requires more backtracking than a hedgerow maze. Locations aren’t sorted in sufficient detail, images aren’t available until you click through to a listing, and items can’t be flagged for side-by-side comparison. And that’s just the desktop version. On a mobile browser, craigslist is an interminable roll of links rendered in eye-crossingly minuscule text.

The NYTimes.com team retained craigslist’s basic look and feel while making the site work more like an app. Since search is the most important feature, design director Khoi Vinh and his colleagues gave this function more real estate and placed it at the top of the page. They moved the all-important Post to Classifieds link to the right side of the page and increased its visibility by bumping up the type size. They made room for white space and eliminated the gray backgrounds, which they thought weighed down the site. “It feels more open, more nimble,” Vinh says.

In the design created by Vinh and his team, the listings themselves don’t stand alone but are framed by navigational aids that let you jump immediately to other parts of the site. Buttons up top lead to the major sections (the current one always appears front and center in light gray). On the right side, the My Craigslist sidebar shows the ads you’ve viewed most recently and the sections you browse most often, transforming Craig’s list into your list. The calendar, fixed at the bottom right, is available on every page.

“Craigslist is working,” says SimpleScott, former design director of BarackObama.com—why fix what isn’t broken? Instead, he focused on making the site easier on the eyes. On the front page, he aligned rows and columns in a uniform grid so they’re clearer at a glance. Links you’ve already visited leap out in blue so you can retrace your steps easily. Displaying the site on a mobile browser, however, presents bigger challenges. SimpleScott met them by dividing the pages into a series of screens. A hierarchical menu makes it easy to navigate without accidentally clicking the wrong link. A map page lets you browse listings by location. Ads and photos each get their own screens. Buttons along the bottom make common functions available at all times.

“Craigslist is frustrating and claustrophobic,” Matt Willey says. His layout has a contemporary look, a Web 2.0 feel, and plenty of breathing room. He eliminated long lists in favor of two pulldown menus: one that lets you jump to various sections and another that sorts listings by price or date. His design displays images in the category pages, so you don’t have to click through to the individual listings to see them. Thumbnails load rapidly and blow up to full size with a mouseclick. A button called Add to Watchlist marks favorites, while the Share button emails listings to friends or posts them to social networks.

Think the current homepage lacks personality? “We decided to do something about the cult of Craig,” Lisa Strausfeld says. She and Luke Hayman highlighted the contradiction between Newmark’s interest in grassroots democracy and the reality that the site is, well, his list. The arrangement of words is essentially random; this design won’t win awards for ease of use. Numbers from the calendar outline Newmark’s head and glasses; longer text strings form facial features. Newmark is always in the background—this version brings him to the forefront.

Find the original post at – http://www.wired.com/entertainment/theweb/magazine/17-09/ff_craigslist_makeover

by Dmitry
Read full article at – http://www.usabilitypost.com/2009/04/15/8-characteristics-of-successful-user-interfaces/

There is a lot of information out there about various interface design techniques and patterns you can use when crafting your user interfaces and websites, solutions to common problems and general usability recommendations. Following guidelines from experts will likely lead you towards creating a good user interface — but what exactly is a good interface? What are the characteristics of an effective user interface?

Here are 8 things I consider a good user interface needs to be:

1. Clear
2. Concise
3. Familiar
4. Responsive
5. Consistent
6. Attractive
7. Efficient
8. Forgiving

Lets take a closer look at each.

1. Clear
Clarity is the most important element of user interface design. Indeed, the whole purpose of user interface design is to enable people to interact with your system by communicating meaning and function. If people can’t figure out how your application works or where to go on your website they’ll get confused and frustrated.

What does that do? Hover over buttons in WordPress and a tooltip will pop up explaining their functions.

2. Concise
Clarity in a user interface is great, however, you should be careful not to fall into the trap of over-clarifying. It is easy to add definitions and explanations, but every time you do that you add mass. Your interface grows. Add too many explanations and your users will have to spend too much time reading through them.

Keep things clear but also keep things concise. When you can explain a feature in one sentence instead of three, do it. When you can label an item with one word instead of two, do it. Save the valuable time of your users by keeping things concise. Keeping things clear and concise at the same time isn’t easy and takes time and effort to achieve, but the rewards are great.

The volume controls in OS X use little icons to show each side of the scale from low to high.

3. Familiar
Many designers strive to make their interfaces ‘intuitive’. But what does intuitive really mean? It means something that can be naturally and instinctively understood and comprehended. But how can you make something intuitive? You do it by making it ‘familiar’.

Familiar is just that: something which appears like something else you’ve encountered before. When you’re familiar with something, you know how it behaves — you know what to expect. Identify things that are familiar to your users and integrate them into your user interface.

GoPlan’s tabbed interface. Tabs are familiar because they mimic tabs on folders. You figure out that clicking on a tab will navigate you to that section and that the rest of the tabs will remain there for further navigation.

4. Responsive
Responsive means a couple of things. First of all, responsive means fast. The interface, if not the software behind it, should work fast. Waiting for things to load and using laggy and slow interfaces is frustrating. Seeing things load quickly, or at the very least, an interface that loads quickly (even if the content is yet to catch up) improves the user experience.

Responsive also means the interface provides some form of feedback. The interface should talk back to the user to inform them about what’s happening. Have you pressed that button successfully? How would you know? The button should display a ‘pressed’ state to give that feedback. Perhaps the button text could change to “Loading…” and it’s state disabled. Is the software stuck or is the content loading? Play a spinning wheel or show a progress bar to keep the user in the loop.

Instead of gradually loading the page, Gmail shows a progress bar when you first go to your inbox. This allows for the whole page to be shown instantly once everything is ready.

5. Consistent
Now, I’ve talked before about the importance of context and how it should guide your design decisions. I think that adapting to any given context is smart, however, there is still a level of consistency that an interface should maintain throughout.

Consistent interfaces allow users to develop usage patterns — they’ll learn what the different buttons, tabs, icons and other interface elements look like and will recognize them and realize what they do in different contexts. They’ll also learn how certain things work, and will be able to work out how to operate new features quicker, extrapolating from those previous experiences.

The Microsoft Office user interface is consistent for a reason.

6. Attractive
This one may be a little controversial but I believe a good interface should be attractive. Attractive in a sense that it makes the use of that interface enjoyable. Yes, you can make your UI simple, easy to use, efficient and responsive, and it will do its job well — but if you can go that extra step further and make it attractive, then you will make the experience of using that interface truly satisfying. When your software is pleasant to use, your customers or staff will not simply be using it — they’ll look forward to using it.

There are of course many different types of software and websites, all produced for different markets and audiences. What looks ‘good’ for any one particular audience will vary. This means that you should fashion the look and feel of your interface for your audience. Also, aesthetics should be used in moderation and to reinforce function. Adding a level of polish to the interface is different to loading it with superfluous eye-candy.

Google are known for their minimalist interfaces that focus on function over form, yet they clearly spent time polishing off the Chrome user interface elements like buttons and icons to make them look just right as evident by the subtle gradients and pixel thin highlights.

7. Efficient
A user interface is the vehicle that takes you places. Those places are the different functions of the software application or website. A good interface should allow you to perform those functions faster and with less effort. Now, ‘efficient’ sounds like a fairly vague attribute — if you combine all of the other things on this list, surely the interface will end up being efficient? Almost, but not quite.

What you really really need to do to make an interface efficient is to figure out what exactly the user is trying to achieve, and then let them do exactly that without any fuss. You have to identify how your application should ‘work’ — what functions does it need to have, what are the goals you’re trying to achieve? Implement an interface that lets people easily accomplish what they want instead of simply implementing access to a list of features.

Apple has identified three key things people want to do with photos on their iPhone, and provides buttons to accomplish each of them in the photo controls.

8. Forgiving
Nobody is perfect, and people are bound to make mistakes when using your software or website. How well you can handle those mistakes will be an important indicator of your software’s quality. Don’t punish the user — build a forgiving interface to remedy issues that come up.

A forgiving interface is one that can save your users from costly mistakes. For example, if someone deletes an important piece of information, can they easily retrieve it or undo this action? When someone navigates to a broken or nonexistent page on your website, what do they see? Are they greeted with a cryptic error or do they get a helpful list of alternative destinations?

Trashed the wrong email by mistake? Gmail lets you quickly undo your last action.
To conclude…

Working on achieving some of these characteristics may actually clash with working on others. For example, by trying make an interface clear, you may be adding too many descriptions and explanations, that end up making the whole thing big and bulky. Cutting stuff out in an effort to make things concise may have the opposite effect of making things ambiguous. Achieving a perfect balance takes skill and time, and each solution will depend on a case by case basis.

What do you think? Do you disagree with any of these characteristics or have any more to add? I’d love to read your comments.

Read full article and leave feedback at – http://www.usabilitypost.com/2009/04/15/8-characteristics-of-successful-user-interfaces/

April 10th, 2009 by Jacob Gube
See full Article here – http://sixrevisions.com/design-showcase-inspiration/50-stylish-navigation-menus-for-design-inspiration/

A site’s navigation menu is one of the most prominent things that users see when they first visit. There are many ways to design a navigation menu – and since almost all websites have some form of navigation – designers have to push their creative limits to build one that’s remarkable and outstanding.

In this article, you’ll find a showcase of beautiful, creative, and stylish navigation menus for your inspiration.

See full Article here – http://sixrevisions.com/design-showcase-inspiration/50-stylish-navigation-menus-for-design-inspiration/

Search Engine Optimization

Fundamentals of SEO & Rankings

BONUS!!! DVD Includes Links to Search Engine Websites
Let Us Show You How
IN THIS VIDEO YOU WILL LEARN

•How to check the search engines
•To properly submit your URL to the major search engines
•How to create site maps
•How to optimize your website
•To avoid common mistakes

•How to use meta data
•About headline tags
•How to use affiliate links
•The importance of text
•To use free sources to improve your rankings

Your Host: Stephen Showalter
Mr. Showalter walks you through step by step with actual screen capture learning sequences.
Learn as Steve takes you through proven procedures that will help improve your website rankings. See how to optimize your website rankings in an easy to understand format. You will learn proper techniques for search engine optimization that can greatly improve your rankings in Google, Yahoo, MSN, ASK and other search engines.
For the complete video visit www.showmehowvideos.com

See full article – http://www.webdesignerwall.com/trends/modern-sitemap-and-footer/

Back in the old days, almost every website had a sitemap where they listed out all the pages. The purpose of the sitemap is to help visitors and search engine spiders to find information on the site. Now, a lot of modern websites have dropped the sitemap page, instead they place the sitemap in the footer area. I’m going to review 20 websites (from big corporation to small portfolio sites) who organized their footer cleverly to enhance usability.
Benefits of Placing a Sitemap in the Footer

* Engage user click and visit duration:
As you may know, online readers don’t read everything on the page, they scroll and scan. Footer is probably the last place they look at before exiting. Placing a sitemap in the footer may attract readers’ attention and increase page clicks and views.
* Make sure your visitors are not missing out:
Sometimes your visitors might be too lazy to click on the sitemap link or miss it all together, having a sitemap in the footer can ensure your visitors are aware of every page.
* Use your footer to promote links:
You don’t really have to use the footer to list out everything, you can use it as an alternative location to promote important pages.
* Save readers’ time:
Having a sitemap in the footer allows users to quickly jump from page to page.
* You save the visitors a click:
By placing the sitemap in the footer rather than a separate page, you save the visitors a click.
* Enhance layout design:
Don’t know what to put in the footer? Perhaps a sitemap can fill up the page and make your site look bigger.

http://www.smashingmagazine.com/2009/02/04/50-beautiful-and-user-friendly-navigation-menus/

By Matt Cronin

Usability is an essential goal of any website, and usable navigation is something every website needs. It determines where users are led and how they interact with the website. Without usable navigation, content becomes all but useless. Menus need to be simple enough for the user to understand, but also contain the elements necessary to guide the user through the website — with some creativity and good design thrown in.