Website Design Tips

Design Tips to build an Effective Website

Listed below are some important and useful tips for designing an effective and high quality web site. If you are a beginner-to-intermediate level designer we suggest that you read our articles on How to build an Effective Website and Design Ideas (includes guidelines, myths busted and inspiration) first.

1. Give Priority to the Website User's Needs: A web designer must be focused on the user's need at all times - usability, accessibility, user experience and user interaction considerations are all part of this. Learn to see things from a visitor's perspective while designing.
   1. Use Clear, Maintainable and Easy Navigation: Navigation links placement on your website plays a big role in determining the stickiness factor of your site (how long your visitor stays and explores your site). Your navigational structure should be neat, consistent and easily accessible for an optimal undistracted user experience. The navigation should be flexible enough to accommodate any amount of additional links as required. Read our Website Navigation Tips before you start designing your site.
   2. Clean and Consistent Layout Design: A clean layout that uses a lot of white space enhances a site's look and readability. The layout should also keep the focus on your content. Use fonts that will be available on all computers to prevent your site looking messed up. We recommend the use of dreamweaver templates for website design consistency.
   3. Design for all Screen Resolutions: A site that is easy-to-use always encourages visitors to stay and read your content. For site with long pages of content this is very crucial as the amount of scrolling required is reduced. Suppose your site doesn't look good for a particular resolution it is very probable that the visitor will close the browser window feeling that the web page is not for their viewing. Designing stretch layouts that fit any screen resolution ensures that you know all your visitors see a visually appealing and professional site.
   4. Make sure the website is Cross Browser Compatible: Make sure you check your website in the most used versions of all top browsers Google Chrome, Internet Explorer, Mozilla Firefox, Opera, Safari and Netscape as they constitute 95% of the world's browsers.
      
2. Program using pure CSS: The world has moved away from table based websites to pure CSS websites because it offers accessibility, reusability and considerably reduces file size apart from giving greater control over the look of your website. The single most important skill you can learn today to become a quality web designer is CSS programming! Even if you are not an expert at CSS you can learn to use the following simple CSS Styles Effects to enhance your website:
   1. Cool Text Effects using CSS Styles: Text Links Rollover, Text Case Setting, Text Spacing and Line-through Effect
   2. Bullets in HTML or Dreamweaver: Using CSS Styles with bullets (shapes, decimal, roman-numerals, images, etc.)
   3. Links without Underline: Use CSS Styles to display links without the appearance of the underline.
3. Optimize Load Time: Make sure your load time is low and test for your website's performance often. For this you must:
   1. Minimize Graphics, Flash and scripts: They hugely increase your file size.
   2. Optimize your HTML & script code: Make sure that your site doesn't have any unwanted tags or unused scripts.
   3. Use Server Side Include (SSI) files wherever possible. Includes once called from the web server reside in its cache so on subsequent requests they load faster.
   4. Use Server and Client caching of your web page static content (Images, JS, CSS and HTML files).
   5. Set Expires Header - The optimal expiry time for your static content is 'more than 7 days'.
   6. Minify CSS and JS code - remove all spaces, comments and line breaks from your CSS and javascript files.
   Related article >> Tips for a Fast Loading Site
   
4. Ensure a Scalable and Reliable Website: As technology advances and configuration of computers & their monitors keep increasing and varying, it is impossible to test your site in all screen sizes, platforms and user scenarios. Make sure your design, code and hosting is scalable by being error free and able to withstand increased user loads smoothly. You would have designed a reliable website if you know that it would look good and perform well under most user circumstances.