Social Media Magazine

The Importance of Website Architecture

Posted on the 11 January 2013 by Onlinere @onretailblog

The Importance of Website Architecture

Website architecture is an expansive and technical subject which can have a real effect on your websites’ usability as well as your search engine visibility and rankings.

In this post I will attempt to explain some of the more important elements of site architecture which when implemented can lead to real benefits for your business.

What Is Site Architecture?

At it’s heart website architecture is about making your website easier to navigate for your users as well as improving the accuracy and completeness of search engine crawling and therefore indexing of your site.

This can cover the structure of the pages of your website, their readability and content as well as the actual design of the navigational elements of a sites’ interface.

Site Taxonomy

Taxonomy is the science of grouping individual items into meaningful groups and hierarchies. The most obvious advantage of investing time in the hierarchy of pages in a website coupled with navigational interface elements is that it helps users to find the pages (or products) they want much more easily. A well thought out categorisation (or siloing) of pages will not only make the site more easily manageable but will make navigation more intuitive for your users.

With a good hierarchy in place, nav bars and breadcrumb design becomes much easier to implement and much more useful for users.

As a quick and dirty example, let’s compare a flat site structure Vs. a simple tiered structure, for a website which consists initially of the following pages:

  • A homepage
  • A page of yellow widgets
  • A standard yellow widget
  • An epic yellow widget
  • A blue widget

A flat structure would simply have every one of the pages listed in the root of a website like so:

  • www.example.com
  • www,example.com/yellow_widgets
  • www.example.com/standard_yellow_widget
  • www.example.com/epic_yellow_widget
  • www.example.com/blue_widget

A tiered structure might have all pages which can easily be grouped together siloed into a directory, so in this case we could end up with:

  • www.example.com/index
  • www,example.com/yellow_widgets/index
  • www.example.com/yellow_widgets/standard_yellow_widget
  • www.example.com/yellow_widgets/epic_yellow_widget
  • www.example.com/blue_widgets/index
  • www.example.com/blue_widgets/blue_widget

Note the addition of the extra page for listing blue widgets, you may only have one blue widget now but what would happen if more were to be added in the future? Forward thinking is essential, you need to consider the current catalog of products as well as potential additions in the future.

With the tiered structure in place the creation of nav bars and breadcrumbs will become a much simpler process, the directories in the example will lend themselves as categories (containing items and potentially sub-categories) which can be easily represented in simple or interactive menus, additionally each part of the address will hint at a natural setup of breadcrumbs, e.g.:

Home > Yellow Widgets > Standard Yellow Widget

My example is of course elementary, however the same simple techniques can be extended with recursion (sub-directories for sub-categories) and scale. A key component to good navigation is managing the number of clicks a user needs to make to reach each page on your site, with navigational elements built using a tiered structure above is will be easier to keep the number of required clicks to a minimum as discovery will be simplified. Try not to have to many tiers in your structure however as this can lead to pages lower down your site structure becoming seen as unimportant by search engines which could negatively effect long tail search rankings.

As an aside if you have a site with many products it is essential you implement a good site search facility as this should (if well implemented) allow users to dive straight to what they are looking for quickly further improving conversion.

Friendly URLs

Leading on from a good site structure, it is important to ensure that URLs are readable and understandable. How many times have you seen a product page with an address ending with something akin to “product.php?id=54737″? Not only does this mean nothing to the user, it also gives no semantic information to search engines when they crawl your site.

Ensuring that you have what are often termed “Friendly Urls” will have several benefits, they will look more professional, will be more memorable for users on site as well as when shared via other mediums. The real win here though is that you will be giving contextual information to clever search engine crawlers, for example if a product is in the folder for yellow widgets then it can be assumed to be a yellow widget.

If pages on your site are loaded using dynamic URLs and therefore simple naming of files on your server will not create the desired friendly URLs, then have a look into “URL rewriting” for your web server of choice.

If you are using WordPress or other commons CMS applications which use permalinks then make sure that your permalinks are in the form of friendly URLs.

Canonicals

A canonical web address is the definitive location of a webpage. With many complex and dynamic websites it can become possible to have many addresses which point to the same page. This is a common issue with some CMS systems and can be exacerbated by the endless number of dynamic data items appended to the end of an address (known as GET variables).

It is important to include a special Canonical link HTML element to inform search engines which of a set of addresses is in fact the definitive article, this will then help with ranking this page as all (or at least most) of the authority for the set of pages will in effect be attributed to the address you have specified, below is a simple example canonical tag:

<link rel=”canonical” href=”http://www.example.com/thisOne.html” />

Even if you think your site does not suffer from canonical issues you may in fact find that your home page is reachable from several addresses which classicly may include:

  • www.example.com
  • www.example.com/index.html
  • example.com
  • example.com/index.html

This common issue can cause series problems with search engine indexing of your site, make sure to specify a canonical or even better use 301 redirects to ensure only one address is in fact reachable.

Meta Data

Another aspect of site architecture is the use of unique and meaningful meta data in every page of your website. Most meta content is generally only used as a weak signal in search engine rankings nowadays, however elements of your metas will appear as snippets and link anchor texts in search engine result pages as well as when sharing links in social media, additionally duplicate meta data on different pages of your site can lead to a negative effect on rankings. A great tool for finding your missing and duplicate meta data is Google Webmaster Tools.

Ensure that every page on your site has meaningful and unique meta data which works as calls to action. For extra marks include microformats data in your pages to give even more semantic information to search engines, currently this is only used lightly however the trend is that this data is of increasing importance and particularly appropriate for eCommerce.

Another source of semantic information comes naturally though the use of HTML5 tags, with a plethora of new tags added in this latest specification which describe the content they are marking up.

Summary

Hopefully you should now have some actionable ideas for improving the architecture of your sites, I have included below a few links to point you in the right direction for implementing the technical aspects of the topics above.

Remember that if you are modifying the structure of an existing site, you must make sure to utilise 301 redirects from old addresses to new ones to ensure a minimum amount of disruption to search engine rankings.

Further Reading


Back to Featured Articles on Logo Paperblog