Foundations of a Well-Designed Website

Foundations of a Well-Designed Website

Foundations of a Well-Designed Website

I was asked by a coworker to come and speak to a class she teaches at a local university about what makes a good website. Like most students, I waited until the night before, and typed this up – my quick talking points for what I see as the building blocks for a successful website.

1. Content Management System

Primary functions of a CMS are to 1) Separate the content from the design. 2) Allow non-technical users to update website. Popular CMS platforms include WordPress, Drupal, and DotNetNuke. Most offer ‚”Plugins‚” or ‚”Add-ons‚” which extend functionality of the site (Calendars, Forms, Calculators)
cmscritic.com/dir/

2. Information Architecture

A properly designed page hierarchy makes the site easier to navigate. Poorly structured sites will cause users to give up when looking for something. Visually, imagine a tree structure, with the home page at the top, landing pages below, and further levels of content below each primary landing page.

webstyleguide.com/wsg3/3-information-architecture/3-site-structure.html

3. Visual Design

Poor visual design is easy to spot. Good visual designs should be things that you don’t even notice. Large, clear typography. Proper line spacing. Good contrast. Plenty of white space and padding between block elements all play into a solid design.

heydesigner.com

4. Interface Design

Parts can be subjective, but there are plenty of best practices that everyone can agree upon. Logo at the top left corner, Navigation menus typically horizontally across the top. Content in the middle with sidebars either on the left or right. Usually the content column is 2/3 the width of the page, and the sidebars are 1/3

designshack.net/articles/layouts/10-rock-solid-website-layout-examples/

5. Responsive Design

Separate Mobile Site vs Responsive Design. – The site detects the device, more specifically it’s ‚”viewport‚” and switches between different sets of CSS code to display the site differently for different size devices. Much more complex than traditional designs, easier to purchase an existing theme.

themeforest.net

6. On-Site Search

On a typical website, less than 5% of visitors to most sites will use search. It’s a good backup plan if our navigation proves to be less than useful. Often seen as a last resort if a user can’t find what they’re looking for. The built-in site search capabilities of most CMS platforms is typically poor.

google.com/cse

7. Google Analytics

Powerful tracking and reporting software. Great for testing the effectiveness of a campaign. Free. Stores a multitude of data points focused into three areas – data about your visitors, where they came from, and what they looked at.

google.com/analytics

8. Google Webmaster Tools

A suite of tools that help improve your site. See what google sees when it crawls. See who is linking to you. Submit a sitemap etc. Some features are already found in Analytics.

google.com/webmasters

9. Search Engine Optimization

Techniques used to improve ranking. White hat and Black Hat. Many of the popular CMS platforms have SEO modules or plugins that can be added. At a company that participates in e-commerce, there may be one or more people dedicated to SEO. In other cases, it may be a duty assigned to a web designer.

searchengineland.com

10. Social Media Presence

The most important part of having Social Media Presence is staying active. You also must decide how you want to interact with your followers and have plans to deal with negative interactions – turn them into a positive. Hootsuite is a great tool for managing posts across several networks.

hootsuite.com

11. Social Sharing

Facebook and Twitter both provide a range of tools designed to make sharing easier from your website. AddThis and ShareThis make the process even easier.

developers.facebook.com/docs/plugins/

dev.twitter.com

addthis.com

sharethis.com

12. The User Experience

Doing as many of the above things correct as possible is the start of creating a positive user experience. These things must be constantly checked and rechecked, and changed as needed. Providing a ‚”Feedback‚” form or survey is a great way to gather real data on how well your site is working.

mashable.com/2011/03/06/user-feedback-apps

 

Other Useful Tools

Google Alerts

Sign up to get notifications when a new page or article is indexed by google matching your keywords.

google.com/alerts

W3C Validator Service

Free service checks the validity of the html code on your site, which can affect SEO and even the way the page looks or works in some browsers.

validator.w3.org

About the Author

Leave a Reply