Tell me more ×
Answers OnStartups is a question and answer site for entrepreneurs looking to start or run a new business. It's 100% free, no registration required.

I am trying to summarize elements of a good web application and web site design. This question was asked earlier in various forms and my intent is get some must haves, good practices and definitely avoid kind of items.

I have come across a good document from adaptive path on Patterns for Signup and Rampup and I like it.

Welcome all input and references.

share|improve this question
I have come across this site patterntap.com that I find useful to find various design patterns. – AKA AK Jan 22 '10 at 3:04

6 Answers

up vote 4 down vote accepted

In general, I believe, a "good" design is one that supports the purpose of the web site. Thus, there's no general answer. It simply depends on the purpose.

However, there are some elements that every web page has or should have in one form or another:

Call To Action

The most importent element. You want your users to do something, so you must tell them what to do. What it is depends on your web site or product. There may be several calls-to-action, and a series of them is often called a (sales) funnel.

In general, the less steps necessary to complete an action, the better.

Interactive elements

Everything that enables the visitor to do something: Forms, buttons and other widgets. Their purpose should be obvious.

Copy

This is used to describe the benefit or utility of the product, establish a certain emotional mood, provide information about your product, and -- most importantly -- answer ANY objection visitors may have NOT to act on the call-of-action.

The most common objection is risk-awareness or uncertainty: Will following the call-to-action really provide the promised benefit? Typical solutions include guarantees, testimonials, free trials, etc.

Headlines

There are basically two camps with different ideas what headlines should do. The first ones assumes the purpose of headlines is to describe the product and/or its main selling point. The second camp assumes their purpose is to make the visitor read the first sentence of the copy. These are not mutually exclusive, so one may find a headline which does both, sort of.

Depending on the camp, sub-headlines are then either used to structure the copy or to provide additional entry points to read the copy, respectively.

Graphic design

Often over-emphasized, but sometimes useful. It includes logos, CSS design, images and video. Graphics is good to improve recall or recognition, to establish an emotional mood or atmosphere, and to add credibility.

Sometimes, it's also used to suggest additional benefits that are either hard to describe in the copy, or that you don't want to describe, at all. (Think, for example, the fetching girl in a car ad).

Graphic is also relevant when leading the visitor's attention, thus graphics should emphasize the important elements, usually the calls-to-action and the headlines.

On top of my head, that's it. Basically.

Hope this helps.

share|improve this answer
Well said. Weather web app or mktg site it is important to keep the call to action in mind at page and app/site level. Call to action and the graphic design is where majority of the newer sites (web 2.0 sites) seem to fare well compared to older sites. There are certain things that small businesses like drop.io, helpspot.com, getharvest.com are doing very well with their value proposition. Certainly some business are doing excellent with their marketing site and web applicaitons. – AKA AK Dec 16 '09 at 18:59

One of my favorite books on this subject is called Don't Make Me Think, by Steve Krug. I highly recommend it. It's full of practical examples of little things that can make a big difference in your site's usability.

share|improve this answer
When designing or updating a site, I ALWAYS refer to "Don't Make Me Think" to ensure I have not induced any UI blunders. It is an amazing, colorful, simple, and effective book. I too, highly recommend it. – Clint Dec 16 '09 at 16:31
+1, Steve Krug is genius, especially the in-house usability tests. Also he just came out with a new book (though I haven't seen that one myself). – Jason Dec 16 '09 at 17:49
++ for Steve Krug. Startups, especially, need to be good at the UI and UX. – AKA AK Dec 16 '09 at 19:01
One of my favorite books on site design too! – Gary E Mar 4 '10 at 6:22

One thing that I can think of is: don't force users to register until the last possible moment.

Also, you might be interested in common UI design patterns.

share|improve this answer
1  
This is a great resource. Thanks. It is amazing to see that the whole site is managed by one person. – AKA AK Dec 16 '09 at 19:13

37signals book Getting Real is a good read. Free online or you can buy a hard copy.

share|improve this answer

A good website and a pretty website are 2 completely different things. I am going to assume want to talk about a good website because ultimately looks aren't the deciding factor when someone uses a website (craigslist for example).

KISS principle - Keep it simple stupid. I live by that.

If you make me think about how to do something, you have failed in producing a good user experience. I should just know where to find things the first time I use your site without you having to give me a tutorial. You must also provide me the shortest amount of steps to complete a task. The fewer amount of clicks I need to finish a task the better.

Also, don't bombard me with tonnes of information at the same time. I am not going to look at 98% of that information. A good example to WAY to much information is the NYTimes website - http://www.nytimes.com/. It scares the user because they don't know what to do next. Don't provide to many options, tell them you want to do A, B or C and not A - Z. The more options you give the user the more you reduce each options (as Claus said) "call to action". They might even end up leaving.

Good luck! Matt

share|improve this answer
Good and pretty are definitely two different things. But, they do not have to be mutually exclusive. Imo, the distinction between good and pretty can be put this way: good - relates to UX and simplicity; pretty - relates to UI, graphic design to make the good work for the audience. I did not quite get your example of NYT website. When it comes to NYT I am little biased as I think that they do the best in their domain/industry. – AKA AK Dec 17 '09 at 2:47
I cant really explain it easily through typing, but basically theres to much going on on their home page. Just did a count on their home pages html source code and there are 323 clickable links. If a person does not know what they are looking for, this certainly doesn't help. People usually don't handle information overload to kindly. – espinet Dec 17 '09 at 5:09

The site should offer good user experience, good search function, easy to navigate, easy to find what you want, has a site map, simple forms, good error message displays, loads fast, has good SEO practices, easy on the eye, text can be resized, color do not clash and burn your eyes, call to action clearly visible on the home page, easy to find contact information, always up, validate on the client, good use of Ajax to make experience like a desktop app, terms of service and privacy clauses, doesn't ask for unnecessary information from user, still works when Javascript is disabled, displays and functions properly in all popular browsers, html/css validate properly, ... etc.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.