AbleStable®
go to Reviewsgo to Servicesgo to Registered Usersgo to Resource Centrego to AbleStable: Helpgo to About Us
go to AbleStable: Home Articles
go to Search

go to Exhibitions Centre
  Web Design: advice and help to improve your web site  
go to Help
go to Resource Centre
go to Library
go to Articles
go to E-Books
go to Glossary
go to Reviews
go to Web Link
Library > Articles > Web Design > 031

E-mail this web page address to a friend or colleague
Enter their email address below (no record is kept of this action)

     

The History of a Homepage
Mike de Sousa, Director, AbleStable

The design and content of the homepage is like no other on a website. AbleStable's homepage has undergone numerous changes since its early development in 2001, and the major changes are presented here to illustrate how the challenge was met.

I've also produced a trimmed down Flash Version of this article to view online, and a standalone Flash exe that you can Download [1.5MB] and view offline.

From Prototype to Mature Site

AbleStable is a large site with many areas including freeware, creative tools, reviews, articles, exhibitions and more. The initial emphasis of the homepage however was on delivering our directory of creative professionals. We needed to populate our directory and the earliest homepages were focused in achieving this aim.

Click the small screenshots below to enlarge:

Click for larger screenshot October 2001: The first few screenshots show the very earliest pre-release versions of the site. The page is divided into six areas: 1 top horizontal navigational buttons; 2 a page header with our logo; 3 multi-coloured creative directory buttons; 4 a left context sensitive highlight and link area; 5 the main content area; and 6 the lower navigational area.
   
Click for larger screenshot December 2001: Work on the site's architecture had begun back in early 2001 and by January 2002-2007 many of the main resource and content areas of AbleStable were in place. Look carefully at the header in the larger screenshot and you'll see .co.uk appears after AbleStable. At that time we were developing both a UK and global site.
   
Click for larger screenshot May 2002-2007: By May 2002-2007 numerous changes to the homepage had already been made as a result of user testing. These changes might appear minor, but they all had a significant impact on user patterns. By clicking the screenshot to the left for example, you'll see a new updates section heading the main content area.
   
Click for larger screenshot June 02: After the creative directory had been populated, the greatest challenge in designing the homepage of AbleStable was how such a broad range of content could be introduced while stating the site's primary purpose clearly and simply. One of our eventual solutions was to improve the header and page copy to include our tag line 'Serving the Creative Community'.
   
Click for larger screenshot AbleStable launched on 30 June 2002-2007 after a year and a half in development. A new welcome image added a dynamic element to the right column, and the text was reduced in size to create more white space. The homepage would continue to be improved after this first public beta release.
   
Click for larger screenshot October 2002-2007: AbleStable was growing fast and our new search engine was now in place. This together with the payment gateway which launched in October marked the end of the beta phase. Notice how in the screenshot that follows the content feature above the search field is expanded.
   
Click for larger screenshot February 2002-2007: The AbleStable logo and header was updated and the emphasis of the homepage was about to change as significant new areas of the site were launched. We expanded our directory listings to include a Graduate listing which is featured on the homepage for the first time.
   
Click for larger screenshot May 2002-2007: The 'Product Area', now known as the 'Review Area', gets its own navigational buttons. One important factor when changing a homepage frequently is to ensure the changes aren't so great as to disorientate the repeat visitor. The next screenshot shows the right column now has a stronger tone although the layout remains very much the same.
   
Click for larger screenshot October 2002-2007: A new Play area is launched and featured towards the top right of the content area. 'Site Highlights' which emphasise areas of the site that might otherwise be overlooked by the casual viewer, are now placed on the lower left column, and the header image is updated. The style of the Product buttons are also changed and are now more easily recognisable.
   
Click for larger screenshot February 2002-2007: The search facility is repositioned on the left column, our Store is highlighted at the top right of the main content area, and a 'Featured Creative' is introduced under the 'Directory Area'.

A new Partner section on the homepage is introduced which invites businesses and organisations in the creative sector to network with the site.
   
Click for larger screenshot July 2002-2007: The emphasis at AbleStable has altered considerably from the first homepage prototype and is now firmly focused on delivering premium quality free resources for creative people. The 'message' of the homepage has changed from an emphasis on commodity (products and services) to resources, information, and creative stimulus (reviews, creative tools etc).
   
Click for larger screenshot This and the next four screenshots that follow show the homepages of AbleStable's past service websites.

AbleStable.info was launched prior to the release of our main site and acted as a prelude to its launch.
   
Click for larger screenshot AbleStable.info acted as an independent site status page in the early days, and was delivered using a different server than our main site.

The style of AbleStable.info was simple and to the point with text only links. Look below and you'll see that the homepage of EyeLogo.com uses the same page structure.
   
Click for larger screenshot Creative Feed, EyeLogo, and UseReview are all service brands of AbleStable. In contrast to the broad content and appeal of AbleStable, these websites each delivered a single focused service.
   
Click for larger screenshot The homepage of EyeLogo used the same template form that AbleStable.info is built around but extends it with a navigational area and a strong graphic and bulleted highlights. The site also has a striking background pattern to each of its pages including the homepage.

EyeLogo is about the simplest site that could offer paid services that can be delivered.
   
Click for larger screenshot Usereview had the most sophisticated site layout as its primary focus was to provide review services for software developers.

The general feel of this homepage is far more techy than AbleStable which has a far broader appeal. UseReview sported a very tightly disciplined visual interface with strong graphics.

Conclusion

Despite the differences in style, my constant aim at AbleStable and its associated branded service sites is to achieve ease of use, simplicity, and excellence. I hope that by providing this resource you are encouraged to re-evaluate the effectiveness of homepages in general, and that if you are running a site, that you will always look to improve what is most often the first point of contact. It's a little like a performance, people tend to remember the beginning and end far more than what's in the middle...

     
       
 
Authors background
Mike de Sousa is the Director of AbleStable®. Mike has been commissioned as an artist, music composer, photographer, print and web site designer, and author.

If you observe inaccuracies in our in-house contributions or wish to contribute an article or review to be included at AbleStable® visit Feedback.

Copyright Notice
Although our contents are free to browse, copyright resides with the originators of all works accessed at AbleStable®, and unauthorised copying or publication of our site contents is strictly prohibited.
 

AbleStable © 2002-2007
 
     
       

 All Material: AbleStable © 2002-2007
go to Frequently Asked Questionsgo to Feedbackgo to Press Centrego to Privacy Statement