Inclusive design is where innovation and imagination flourish. Meeting the needs of the widest variety of people does not inhibit creativity. It opens our minds and inspires excellence.

In her article in .net magazine, Sandi Wassmer of Copious explains the ten principles for inclusive web design an overview of which is listed below:

1. Equitable – Be welcoming, don’t discriminate and engage with people. Create different user experiences and make certain they have equally valuable outcomes. Aesthetics matter.
2. Flexible – Provide options. Think who, how, why, what, where and when people will be using your website. Make sure there is choice for diverse users and maintain device independence.
3. Straightforward – Be obvious and not ambiguous. Make sure your website’s features add value, not complexity. Remember, good design is as little design as possible.
4. Perceptible – Don’t assume anything. Make sure your website’s purpose is clear, its content, structure and sequence are meaningful and convey information to all of the senses.
5. Informative – Make sure people know where they are on your website and provide ways for them to find what they’re looking for. Be timely, predictable, uncomplicated and precise.
6. Preventative – Provide easy to follow instructions and gently guide users in interacting with your website. Help them to minimise errors when submitting data, through well considered form design.
7. Tolerant – Handle errors respectfully and indicate precisely what the error is, where it is and how to fix it. Remember to let people know the outcome.
8. Effortless – Don’t make demands or place restrictions on your users. People should not have to work or think hard to find what they want on your website. Ensure it can be used efficiently and effectively.
9. Accommodating – Be approachable, uncluttered and give people room to manoeuvre. Make sure that your website is unobtrusive and can be accessed by different devices of all shapes and sizes.
10. Consistent – Follow standards, guidelines, conventions and best practices. Provide a familiar environment with memorable functionality.

With different devices, configurations, browsers, personal settings and assistive technologies, and no agreement on how to achieve interoperability, web builders must do their best to accommodate the diverse ways people access the internet. Building with this in mind will ensure your visitors have a quality experience.

Inclusive design enables us to create great, meaningful, on-brand internet experiences for the widest audience possible. However, inclusive design is also a new way of thinking, and its overarching aims may not mirror those of your organisation or clients. Change takes time, so you may not be able to do everything at once. If you just start thinking about accessibility and plan your projects with users in mind, you’ll be on the right path. There will be trade-offs and tough decisions, but this is where inclusive design really comes to the fore. It challenges us to hone our craft and fosters real creativity and innovation.

But what makes up a web community; what makes them successful? Below I discuss the four C’s of community: Content, Context, Connectivity and Community.

Content

A current meme when organising or building a website is the catchphrase Content is King. A big shift in the web in recent years has been the way websites are constructed. Today it’s a necessity, and indeed best practice, to separate form from content. In one hand you have the compelling content, whilst in the other you have the presentation, be it in the form of HTML and CSS, Flash or RSS, amongst others.

Quality content is one way in which you can make your website stand out. It is also a great way to attract the people who are needed to form the elusive community that your brand is hoping build. When considering community initiatives, there are three questions to ask: Where will the content come from; for example community driven or syndication? Does it provide indisputable value; does it have a unique selling point (USP)? Can a regular flow of quality content be maintained? Even pre-Web 2.0 initiatives have to focus on keeping the content itself fresh and relevant.

Web accessibility and search engine optimisation are also vital, so having content completely separated from presentation means a number of assistive technologies can make better use of the content, whilst the web robots can also readily consume the information.

Context

Context means understanding how people use your website, where they are in the user-journey and serving them the right experience at the right time. Well-designed applications and functionality have great opportunities to deliver on context.

For example, FriendFeed‘s iPhone version, which is simply a re-worked web interface, is perfectly designed for contextual usage on the go. Similarly, Remember The Milk updates the interface explicitly for mobile and iPhone users, whilst also syndicating the content to applications such as Google Calendar. (It is questionable whether user-agent switching is good practice, but that is a whole new blog post.) Conversely, Delicious makes no attempt at changing the user interface for iPhone or Nokia N95 users since the iPhone and N95 have full web-capabilities through their respective web browsers.

In some instances the context in which the content is displayed will require reduced functionality. For example, the Last.fm mobile site does not allow you to play music, but simply search music listings, view recommendations, events and friend listings, and edit settings. However, through its API, Last.fm is able to offer its data and platform to third party developers to aid the building of new applications and communities, thus changing its context.

Connectivity

Connectivity is the ability of a system, whether that is a web-based community or a device like the iPhone, to connect with little or no modification. In the realm of communities, the ability to easily connect to your peers is the Holy Grail of the application.

Successful communities thrive on fluid, hard-to-measure activities that are, in the purest sense, relationship-based. It’s not all about mass communications — although Twitter and YouTube are both bucking this trend — but more about the micro-interactions. Designing experiences that support thousands of micro-interactions means that the community is able to function, unhindered, almost indefinitely. Facebook lends itself expertly to micro-interactions through the user’s ‘wall’.

Companies are turning to communities as the new customer relationship management (CRM), but this requires people to mind them. Organisations such as 37Signals and WildBit very effectively use Twitter to broadcast service updates and sometimes apologies, whilst the BBC and The Guardian online use it to broadcast links to new content.

Continuity

People often don’t like change, but communities that thrive often do so though evolution to meet the needs of users. Communities need to be flexible to evolve while still providing a valuable and consistent user experience which can be sustained. Too much of a radical change will almost certainly have a detrimental impact upon visits, at least initially.

Building communities is the new marketing for a brand, whether that is through wholely-owned properties or 3rd party social media services such as Twitter, WordPress or Ning. The starting point to any community is finding a niche that is currently underserved and serving that community better than anyone else. But Brands need to know a few things before they head down the community path. The web is saturated with communities. Some are thriving, while others have come and gone. Creating a community is not like your average marketing campaign that you can ditch it is a failure. If the community is successful the four C’s of content, contect, connectivity and continuity will have to be maintained and indeed, developed.

Under the Disability Discrimination Act 1995 (DDA), a disability is defined as:

A physical or mental impairment that has a long-term or substantial effect on a person’s ability to carry out day to day tasks.

This ranges from people with physical and sensory impairments to people with diabetes, disfigurements, heart disease and epilepsy.

Accessibility, therefore, can be viewed as the “ability to access” the functionality of a system or entity. Furthermore, accessibility is a somewhat general term used to describe the degree to which a product (e.g. device, service and environment) is accessible to as many people as possible. Accessibility is often used to focus on people with disabilities and their right of access to entities, often through use of assistive technology.

A dimension of accessibility is web accessibility. Web accessibility refers to the practice of making websites usable by people of all abilities and disabilities. When sites are correctly designed, developed and edited, all users can have equal access to information and functionality. In many countries this has led to initiatives, laws and regulations that aim toward providing universal access to the internet.

Digital Web Magazine has a great article on whether accessibility statements are useful, which is well worth a read.

The main points of consideration that can be garnered from the article are as follows:

1. Make the accessibility link prominent and provide it in a consistent location so that website visitors can find it easily.
2. Provide rich content that explains how to use the accessibility features provided, rather than just listing the features themselves.
3. Separate the content into sections and provide headings for each section.
4. Provide contact information in various formats so that website visitors can directly contact the team responsible for accessibility queries.
5. Actively promote feedback from website visitors. Use comments to continually improve the website.
6. Provide a known barriers section which details inaccessible areas of the website along with alternative ways of obtaining the information or services.
7. List technical and conformance information at the end of the accessibility statement. This will allow the information to be readily available, whilst not being placed in a prominent position.

Your accessibility statement will be organic — you may only start with a few lines but as your site develops in terms of accessibility, and your understanding of the accessibility of the site develops, so will your statement. As it can often be created and then forgotten about, it is worthwhile taking time every so often to check through the statement to ensure that it is up-to-date and reflects the work done to enhance the site’s accessibility.

Websites are increasingly the key communication vehicle for a company, its brand and products. Despite this, research from Magus shows that many of the world’s leading organisations don’t have formal brand and technical standards defined to govern their websites. Even those that do are failing to effectively implement or enforce them, achieving full compliance with less than 20% of their own web standards. The websites of these organisations significantly under-perform or damage the brand as a result.

PAS 124 will help to protect the significant investment organisations are making in their web presence and online brands, by establishing best practice for “defining, implementing and managing organisational web standards”. It will provide a clear framework to help organisations apply standards effectively to significantly improve online performance and protect the integrity of their brands.

More detail can be found on the BSI’s press release.

This article was inspired by a great blog post at Aviva Directory, entitled Grade Your Website: 31 Free Online Tests.

Below is a compendium of tools I use on a regular basis to test website I work on, based on Aviva Directory’s headings (incidentally they list the same tools I use regularly).:

Code Validation

The WDG HTML Validator is an excellent tool for identifying syntax errors on pages driven by markup languages. There is also an option to recursively check for errors on every page in the website directory, which is invaluable when checking large, dynamic websites.

The W3C Link Checker searches for and identifies broken links for a given URL. The tool specifically checks that all the links are de-referenceable, no links and anchors are defined twice and warns about invalid http and directory redirects.

Accessibility

Watchfire’s WebXACT is a must use tool for all serious designers and developers. The tool lets you test single pages and generates a very detailed report on the quality, accessibility and privacy of a website.

Speed

Web Page Analyzer from Website Optimization is an excellent tool that calculates page size, composition, and download time. The script calculates the size of individual elements and sums up each type of web page component (objects, CSS, images etc). Based on these page characteristics the script then offers advice on how to improve page load time. The script incorporates best practices web site optimisation techniques into its recommendations.

Browser Simulator

Browsershots is a tool, created by Johann C. Rocholl, which takes screenshots of your website in various browsers and platforms including Firefox and Internet Explorer on Windows, Firefox and Safari on Mac OS X and Iceweasal and Konqueror on Linux. When the user submits a URL it is added to a job queue. Unfortunately the queue requires you to wait up to three hours before retrieving your screenshots, but the results provide a clear indication of how the website will be received by different user setups.

Search Engine Optimisation (SEO)

SEO Workers SEO Analysis Tool is an extremely useful tool that analyses an assortment of page features including meta tags, keyword density and load time. A user simply submits a URL for testing and the report is returned.

The toolbar can be downloaded via the following link: http://www.snapfiles.com/get/AccessibilityToolbar.html

The Web Accessibility Toolbar has been developed to aid manual examination of web pages for a variety of aspects of accessibility. It consists of a range of functions that:

• Identify components of a web page
• Facilitate the use of 3rd party online applications
• Simulate user experiences
• Provide links to references and additional resources

Much like Chris Pederic’s Web Developer Toolbar, which was popularised through Firefox, this toolbar can be used as an aid for manual checking of many of the Web Content Accessibility Guideline’s Checkpoints (WCAG) 1.0. None of the toolbar functions listed will tell you whether a page conforms to a particular checkpoint, but they will help you in assessing conformance.