Sunday, 8 May 2011

Principles of Good Webpage Design-Part 1

Principles of Good Webpage DesignSo let us start the out of box discussion.Now, we will examine some principles of web-design from the User-Interface (UI/UX) point of view which are based on common-sense and Feng Shui laws. In order to examine these principles , we will first list the design elements involved in a website. 

So let us focus on following design elements:


Domain Name
 
  1.   Never use hyphen, DOT or any special characters in the domain name.
  2.   It should be short,catchy,sweet and should easily stick to tongue.
  3.   If you are an established organization, ideally your brand name should be your domain name. 
  4.   Even  combination of your brand name and organization name will do.
  5.   If you are a new entrant, think about the keywords with which your products and services can  be co-related  and choose a domain name around those keywords.
      Rand Fiskin has written a very good article here:
      How to choose a Domain Name ? 

Content

Content is the king as far as marketing and promotional activities are concerned. The sole purpose of content should be to meet the eyeballs of audience. We will classify content into two broad categories:
  1. Text
      1. Less content is good, but this is not applicable to all kinds of websites. Especially websites which serve  news,blog articles,user-driven forums, etc. may have first home page full of text content.Websites which serve information about products and services should display summary of the organization with its products and services.   
  2.  Media ( Images and Audio/Video) 
     
      1.  Again less image and video is required on the home page. But websites which are news oriented and video sharing sites need not follow these principles. Make sure images and videos load quickly on all the available browsers and as far as possible should be in auto-display or auto-play mode.
If possible , text and media can be combined as one unit of content to communicate the idea. This method is becoming very popular now a days. It is called Infographic. Infographics are better way to communicate because a picture is worth thousand words and if combined with right text , it can convey idea in short and sweet manner. It is a great data visualization or content visualization technique.
Layout

The layout of website is like a floor plan of the room. Ask any interior designer, how much   importance they give before starting their job? Layout should bind all the design elements of the website in a harmoniums fashion. Layout should not clutter all the design elements at one location, but should evenly distribute it like a good spread of butter.

Also the layout should not distort when website is viewed on different shape and size of screens. Now a days , 60% web pages are accessed from tabs and smart phones which comes in varied width and height screen sizes.  Web page layout should be responsive design so that it will adjust to any type of screen display. Responsive design of web pages is key factor to make or break a web page.

Color Scheme

The color scheme of the website should ideally adopt following principles:
  • It should inherit colors from the brand logo colors of the organization.
  • As a general rule of thumb, two color combination should be used for designing web graphic elements like labels,text,buttons,images and other design elements. We can call it primary color and secondary color.
  • Since a website is treated as interface to the organization, there should be harmony of colors among all the promotional literature e.g. visiting cards,letter heads,product brochures,email newsletters etc. of the organization as well as website.

Brand Logo

Designing a brand logo is an art  as well as feng shui science. A logo can be a symbol, or it can be a combination of a text and symbol to which radiates energy in the universe. It radiates energy to pull eyeballs.

There are some rule of thumbs for designing superior brand logos :
  • KISS principle, Keep It Simple Stupid, logo geometry should be simple, unique and should adhere to feng shui laws.
  • Use positive symbols, never use negative symbols. Never use  personal images, photos, religious  symbols,negative symbols. Never use violent symbols.
  • Again it is advised to use primary color and secondary color combination to create brand logo.

Page Navigation Mechanism

Keep in mind following tips:

All content of the website should be accessible from the front-page of the website.There should not be hidden content giving surprises at the second or subsequent level of pages of the website which were not having reference at the front-page.

If the front-page can not accommodate all the content, display teaser or introduction of the content at the first page and provide a link along with so that more detailed content can be accessed at the second level of navigation. Do not forget to provide the back-link at the end of the content.


Never force user to use back-link button of the browser.

For textual information having many pages content, provide buttons/links to go to any page right from 1st to last.
  •      First Page
  •      Previous Page
  •      Next Page
  •      Last Page
  •      Page no. link to go to any page
Never embed video in the pages without providing control to start/stop video. If the video is auto-play enabled, stop player button should be visible to the user.

Never embed audio in the web-page which starts playing automatically at loading of the page. If there is requirement of this, stop button should be visible to the used for stopping audio. Everybody do not adhere to same taste of audio or music which you have.

Do not clutter the web-page with many page-links to influence judgment of the user. A common mistake done while providing social media link buttons, is all of the social media buttons are displayed as there are fairly large number of social media channels available. Use few which are most common and highly popular.

akhileshm@hotmail.com

2 comments:

  1. I really enjoyed reading this. Although I've used a hyphen in my domain, I probably should've looked into this first!

    Chelsea | www.chelsea-elizabeth.co.uk

    ReplyDelete
  2. Thank you Chelsea for liking some of the points. You are welcome to share your own experiences.

    ReplyDelete