Wednesday, 9 April 2008

High Accessibility is High Visibility

As I've mentioned before, designing for accessibility has benefits far beyond disabilities. One benefit is how an accessible website could actually help your SEO (Search Engine Optimisation). A website designed with semantic markup and accessibility in mind not only increases your potential market but can also place you at a higher position in search engines giving you a higher chance of a higher number of people finding your business – that’s one extremely valuable benefit! So here's one quick tip for creating high accessibility and high visibility on your website.

Quick Tip – Create a Clear Hierarchy Using Headings

Think of your website as a book which is broken down into chapters, and arranged under headings, sub headings and paragraphs. Break your page content into reasonable 'chunks' for readability and use the predefined HTML heading and paragraph tags to arrange your content.

Structure example – always start with an ‹h1› tag and move through the other levels sequentially:

‹h1›Topic of the page‹/h1›
‹p›Paragraph overview of the page‹/p›
‹h2›Major topic 1‹/h2›
‹p›Paragraph about the major topic‹/p›
‹h3›Sub Topic 1‹/h3›
‹p›Paragraph about the sub topic‹/p›
‹h3›Sub Topic 2‹/h3›
‹p›Paragraph about the sub topic‹/p›
‹h2›Major topic 2‹/h2›
‹p›Paragraph about the major topic‹/p›

Using heading tags help structure your documents and make them easier to read and if you use these tags properly, web browsers, search engines and assistive technology will use these tags to gain a quick breakdown of your web page. Many assistive technologies use heading tags as anchors to quickly jump to different parts of a page.

Make sure your headings contain relevant, useful information – search engines will give more weight to the text inside the headings so they should also include some of your keywords or key phrases for your site.

Finally, don’t use headings purely to style your text. If you want something to be bold for example, you should use ‹strong› which will add emphasis using the correct method.

Headings should reflect the logical structure of the document; they should not be used simply to add emphasis, or to change the font size

- W3C

Tuesday, 1 April 2008

Validation - Just an Exercise in Checking Boxes?

The simple answer is no.

Every good product should be checked for quality against a set of formal standards – I wouldn’t buy a car which hadn’t passed quality checks, I wouldn’t give my boss a report which I hadn’t spell checked and I wouldn’t put a site online without validating it first.

HTML has rules of how it’s elements can be used and browsers are created to understand these rules and render your page accordingly. If you don’t adhere to these rules you run a risk of your site looking drastically different in different browsers and platforms.

Using an automated tool called a validator can highlight small but fundamental errors which are difficult to pinpoint by hand, such as forgetting to close tags.

The only real downside to validating, is it can be a lengthy process if you’re not used to producing semantic markup by hand, or use a WYSIWYG (What You See Is What You Get) editor to create your pages – the errors the validator displays can sometimes be difficult to understand and, if your page has hundreds of errors, finding the main problem can be like trying to find a needle in a haystack.

However, the benefits to validating hugely outweigh the downside; outlined below in brief, they really speak for themselves:

Validation and SEO
If you want search engines to list your site, your HTML should be correct. Search engine spiders have difficulties indexing pages with HTML errors. Using a validator to ensure your pages contain valid, standards compliant code will make sure the search engine spiders can actually access your pages and include your site in their listings.

Validation and Forward-Compatibility
Valid, standards compliant HTML will render better, on more browsers and faster than HTML with errors. As browsers become more standards compliant, validating your markup will also ensure your site is more likely to work on future browser releases.

Validation and Accessibility
An incorrect assumption is that if you make your pages valid, they will also be accessible – it’s entirely possible to have a fully valid page which is totally inaccessible. Whilst validation doesn’t guarantee accessibility, it is an extremely useful aid; and if the code validates, it makes it much easier to ensure accessibility and usability. CSS validation can also be extremely important to accessibility: using a CSS validator is essential for tracking down errors such as the same background and foreground colours which would cause serious problems for users with custom style sheets.


Some validators:
http://validator.w3.org/
http://valet.webthing.com/page/

Validation - Just an Exercise in Checking Boxes?