10 Important Web Design concepts you didn’t know

Web Design is not only about Photoshop or HTML 5 or CSS3, it also involves a large part of user experience design. If you are only, a pure web designer then most likely you’ll be used like an efficient tool by your client to convert their ideas into a website. Sadly most of web designers learn this via the hard way i.e with experience and time.

Interestingly, you’ll realize that how easy it is convince/convert a client if you have some knowledge of user experience. While the job of a user experience designer is one of the most toughest job, for a web designer UX concepts can play an essential role.

Below are some of the important UX concepts you as a web designer ought to know:

1. 7±2 Principle

   A User’s short term memory can only  retain 5-9 things at one time [George A. Miller]. Therefore keep your list items & navigation menus within 5-9 range. Any list beyond this may have a higher probability of user loosing focus on previous list items.

2. Pareto Principle [80/20 Rule]

   This principle states that 80% of effect is met by 20% of the cause. In short identify 20% of your visitors, which contribute to 80% of your sales/conversions and make improvements for them.

    

3. 3 Click rule

   3 Click rule states that no content/information on your website should be more than 3 clicks away.  The maximum depth of pages on your site should only be less than 3 and keep your navigation levels to less than 3 levels.

4. Banner blindness

   Visitors ignore what all looks like a banner to them. If you want to grab your visitors attention to a banner, try to make it clean with lesser content. Perfect example of this is the wix.com ad. A sleek 3-D button with a single line of text. Even if you’ve landed on a wrong page, you’ll get the message inside the ad.

5. Fitts law

   The law states that time required to reach a particular point is a function of distance and relative size of the target. Time required by a user to move mouse from Point A to Point B is a function of distance between point A and point B and size ratio of point B vs point A. So, attaract more clicks to point B, one should place B at a location which is close to Foveal view of the user and is bigger in size. Ever noticed why ads below main navigation menu attract more clicks?

6. Inverted Pyramid

   Now if you’ve ever noticed your behavior you’ll realize that most of the time when we’re looking for some information, we scan the pages and look for some relevant information. We read first few lines of the page then scroll down looking for some relevant keywords and then leave. Inverted pyramid is a content writing technique, wherein you present your user with your conclusions/most important information first and try to grab her attention. Same principle can be applied to design. You have to grab your user’s attention in the first fold of design i.e the top 600px of design holds the key whether the user will like the design or not.

7. 2 second rule

   A simple rule which states that all application responses/Ajax calls should not take more than 2 seconds. Since internet users are impatient, don’t make them wait for responses. The faster the website the lesser the bounce rate and higher conversions.

8. Don’t make me think

   Internet users do not like questions; they are impatient and greedy. They need quick answers to their questions or they’ll bounce off your site. All your design should focus on one thing, don’t make users think, even if it requires placing the menu twice [header/footer] or giving information icons / tooltips.

9. Gutenberg Diagram

   Users have a specific reading pattern, while its evident that they read from left to right and top to bottom; the behavior is not consistent throughout. They tend to give more attention to top left part while ignore the right bottom part. Guttenberg has divided reading area into four parts, primary optical area which grabs maximum attention and terminal area which grabs the least attention. Your design therefore should have most impact in the top left part of your page.

10. Shneiderman’s rules

    Basic principles which you should keep in mind while designing. Pretty much sums it all:

    1. Strive for consistency

    2. Enable frequent users to use shortcuts

    3. Offer informative feedback

    4. Design dialog to yield closure

    5. Offer simple error handling

    6. Permit easy reversal of actions

    7. Provide the sense of control

    8. Reduce short-term memory load

Design is evolutionary and trends do change therefore I would say above rules are more of guidelines than rules, so one should not hesitate to deviate away from these. So try out your own version, share with us and tell us what you think about above rules.