What every “404 Error” Page should have

404 Error Pages are a necessary part of the web and you just have to accept they crop up from time to time. However we should be mindful of helping our site visitors gain the information they seek as efficiently and painlessly as possible.

1 – Brand Recognition?
Design the page so that it is recognisably the business/website the user is looking for and is consistant with the brand. Keep the Primary navigation in place – don’t hide it. This will aid those who clicked an expired URL in an email or referenced an outdated publication to navigate back to your home page, key product or services pages. The below page from www.thefwa.com represents a standard Windows IIS Server 404 Error page and realistically isn’t really useful to anyone – the second Apache Server page is even less useful. In both instances if you are navigating around a website and hit a snag, you have to hit the back button on your web browser – to many users this is very disorientating and many might not be even sure if they are on the correct website or not.

Standard Windows IIS Server 404 Error Page

2 – You were looking for?
The small step of actually displaying what the users typing efforts inputted into the URL address bar assists in the user being able to validate their typing – and desired destination. Representing the URL in the window can allow a second inspection to take place by the user, as it could reveal a typo in a link supplied in an email. Remember, not everyone has the address bar visible (Full screen F11 browsing) all the time.

3 – Key site areas:
People visit websites for specific reasons – you can identify key areas of interest by way of your site analytics package. Offering a breakdown of these key site sections into a neat array of alternatives on a 404 Error page is an excellent way of  guiding your users to their chosen area of interest. The www.apple.com website is very well setup in this regard.

Apple - 404 Error Page

4 – Search:
If your website has a search facility, placing this within the framework of your 404 Error page will allow users to start looking for what they are after within your site. Particularly if you have predictive search enabled, then this will further assist wayward site users in finding what they are after. Highlighting it like the www.dailymirror.co.uk is a nice and visually subtle way to draw attention to the facility.

5 – Offer Instructions, Tips & Guidance:
Don’t be shy – offer instructions about what a site visitor can do to improve their search, including use of operators like “and”, “or” and use of “quotations” to help put into context word groupings etc. On that, direct people to the search e.g. “Site search is located in the top right hand corner of this page” – it doesn’t hurt to state the obvious.

6 – Offer access to your Site Map::
A general layout, again as illustrated by the Judicial College of Victoria website below will prove useful in guiding your users to finding the appropriate area of the site they are interested in.

7 – Be open to Feedback:
The nature of modern web systems is that many people may be involved in the day to day maintenance and management of the environment. It is entirely feasible and plausible that those tasked with looking after the site might not even be aware of the error in missing content in the first place. Offering the immediate ability to offer feedback by way of a feedback/contact form is a great way to defer the responsibility of site content management. Many people  are quite conscientious about reporting small errors to site content.

8 – Most recently searched items:
If someone is visiting a website, chances are they actually are looking for something they have either heard the business does or they want to find out something they heard recently about the business. Offering the 5 top search items, generated by popularity is a helpful way to offer possible relevance to the site visitors.

9 – News/Cross Promotion:
Just 3 headlines will do. It won’t hurt search engine ranking and page update relevance. Based on the idea that someone is specifically looking for information in relation to your organisation, the fact that the latest news is presented, increases the likelihood of engaging users directly with what the business is currently communicating.

10 – Offer some light-hearted humour:
People can take things too seriously at the wrong times. Consider injecting some humour into your 404 messages. Obviously this approach needs to be treated with care and consideration to the end user audience and the representing website.

Information Architecture

I had reason recently to discuss the concept of Information Architecture with a client. In its broad context, as it applies to web, It was readily apparent that this client’s world view, the definition that they pursued was limited to the site navigation and page layout in context of a classic sitemap. Whilst I can understand that most IA’s are referred back to a site map diagram  – a trap of the industry -  it has occured to me that the definition as interpreted by my esteemed work colleagues who rank developers, project managers, digital strategists and designers (conceptual) is in an entirely different area of focus and emphasis. However, we’re often left with clients that need to understand just what in the world we are talking about. So where is the disconnect?

As is always the case when in doubt, I fall back on the Trusted Wikipedia definition of Information Architecture as a starting point:

“Information architecture (IA) is the art of expressing a model or concept of information used in activities that require explicit details of complex systems. Among these activities are library systems, Content Management Systems, web development, user interactions, database development, programming, technical writing, enterprise architecture, and critical system software design. Information architecture has somewhat different meanings in these different branches of IS or IT architecture. Most definitions have common qualities: a structural design of shared environments, methods of organizing and labeling websites, intranets, and online communities, and ways of bringing the principles of design and architecture to the digital landscape.”

Quite a formal definition that needs bearing in mind if we are to dessiminate the underlying definition in context of the Web world.

When building a website lots of people, including both clients and practitioners make the mistake thinking that it’s easy. It’s not. A well built website considers factors that are the summation of different areas of endeavour for the business or organisation in question. Everyone has a vested interest to ensure that this pesky website thing works – the sales force, corporate comms, IT & IS, HR, executive, products group etc. Ultimately, they are there to support the activities in communicating to the site’s end users, both actual and intended and the intended function of the site in turn supports the business goals being focussed upon.

What is overlooked on a regular basis by both clients and so called ‘expert’ practitioners is the need for us to have an understanding of those other audiences on the business side who have a vested interest as well as the same understanding as it relates to the user side. The often subscribed to view is that managing or eliciting such involvement from other stakeholders internally can uneccesarily stymie the progress of the project. And in contrast, assessing the audience both intended and actual is often just ‘too big a task’ by most peoples standards. Involvement in such activity extends to the IA and how it impacts on the User Experience (UX).  IA by our own industries definition is not just the site structure from a page relationship point of view, however the problem is that we often don’t communicate this terribly well to our clients, who are more focussed on the commercial outcome of  what the end result will be. And rightly so, as they are the ones ‘paying’ us to deliver results. Succinctly, IA involves not only the navigation and the hierarchical arrangement of the pages, but also encompasses the below aspects.

1. Who is the audience? Are they going to be myopically challenged (as mentioned below) or have the attention span of a butterfly
2. Content Layout – Priority and scaling of content in relation to context and intended purpose. The concept of a great tract of text 750 words long doesn’t faze most people – until I point out ‘Would you read that?’ Both clients and practitioners are guilty of not thinking in this area nor offering advice and alternatives. How to solve this? Heading 1, followed by heading 2 byline, followed by 30 word summary, followed by introduction paragraph, use of tabulated data to present data (not to break up data), dot points and cross referencing. If you can’t deal with all that in 250 – 300 words, breakout the massive slab into a PDF Whitepaper, with that as a specific topic.
3. Images – Either overused (way to large), underused (way to small) or cliched, out of context. How many product sites have I gone too where the images are tiny? Too many.
4. Use a breadcrumb! Highly underated. This trail and visual cue of where you are in the site gives relevence to the hierachical order of information.
5. Font Size – Again highly underated. How many sites have I found where the audience is 40+ male white collar workers…. who are probably wearing glasses. Have at the least a font size button which can scale the site up and down.
6. Information Hierarchy – specifications, instructional guides, price lists, high level description, sizing etc
7. Print version – like it or not, people still print pages. It’s gotta fit on the A4/Foolscap sheet and is useless if it gets cropped. Savvy website owners will also setup their print variants to have pre-formatted pages with company logo, contact information, the page location within the site, print date and possible cross linked information.

Good User Experience yields ease of access and allows people to fall into the natural rhythm of finding the information they are looking for and if it is done correctly, it is self feeding in that it yields data back giving you insights into your web audience. The key things is that good IA starts at the design stage and should be encompassed in the Wireframes and the Site layout. Excellent IA is the result of good consultant activity at the Pre-Sales / Client Definition / Discovery stage of the project and should take into account a site visit whereby you can ‘soak up’ the atmosphere of the client in question.

All the above needs to be determined before a good IA can be setup and they all impact on the overall User Experience of how site visitors will interact with your site. The current line of thought extends to the notion that interactivity with your site is a reflection of how a client interacts with your brand. Brand as a touch point is every single interactivity they have with your organisation – products, service, phone call centre, printed material, customer interaction, your staff, your sales force, the words being portayed in popular media…. and your website.