Accessibility

Not all visitors to your site are able to see the content in a standard view. Some require larger text, some will be using screen-readers, and so on. The Disability Discrimination Act requires websites to be reasonably accessible so as not to exclude such visitors.

The GP-UK.net website templates have been designed to comply fully with these requirements. To ensure that your site remains compliant as you edit and develop it you need to pay attention to a few practical points. These may seem superflous since they do not make any difference to how the site appears to you, but they make a big difference to disabled visitors.

It is a good idea to check your pages, particularly if you are inserting images and tables (see below) with an accessibility check website such as Bobby.

Accesskeys

Accesskeys are keyboard shorcuts which are useful for visitors who are unable to use a mouse, and for those who find using a keyboard easier than navigating with a mouse.

There is a standard for UK Government websites, and by following that it will be easier for your visitors since they will not have to learn new shortcuts.

The first of these is implemented for you automatically by GP-UK.net, and some of the others (asterisked) were automatically attached to your pages when your website was first setup.

s - * Skip navigation
1 - * Home page
2 - * What's new
3 - * Site map
4 - Search
5 - Frequently Asked Questions (FAQ)
6 - Help
7 - Complaints procedure
8 - Terms and conditions
9 - Feedback form
0 - * Access key details

Your site may not have or need all the above pages, but where they exist it is good practice to enable the matching accesskey. This is very easy to do:

Go to 'Page' and locate the page for attaching an accesskey.
Select 'Edit Page Header'
Near the lower part of that page you will find a data entry box labelled 'Accesskey'
Enter the appropriate single digit or letter accesskey for that page, e.g. for Complaints page enter 7
Save and exit, and from now on the accesskey will be anabled automatically

Notes:

Depending on your menu style, it will probably be necessary to make the page a top-level page, so that it appears on the first level of your menu rather than being a subpage, or else the accesskey may not work.
Currently (to be rectified soon) accesskey implementation is only operational on the menu style 'foldout'

In addition GP-UK.net sites have two extra keys implemented automatically:

l - * Enlarge display font
m - * Medium size display font

How to use or test accesskeys depends on your browser.

Internet Explorer: Hold down Alt key and tap the accesskey, e.g. 3 for sitemap, then press enter
Opera: Activate accesskeys by holding Alt and tapping Esc, then press the rquired key e.g. 3 for sitemap
Firefox, Mozilla: Alt and accesskey, like Internet Explorer, but no need here to press Enter afterwards

Images

Images should have 'alt' tags attached, so that visitors browsing without displaying images know what are the images on the page. When inserting an image on your pages do the follwing:

In the Rich Text Editor view the content element containing the image
Near the bottom of the editor is a little box marked 'Source Code'. Tick that box and the html code for that section will be displayed.
Locate the code for your image, which will be something like: <img src = "filename.jpg" height = "34" width = "76">
Insert into that code the 'alt text' for your image, a short description of the image: <img src = "filename.jpg" height = "34" width = "76" alt = "a photo of our surgery just after it was newly built">

Tables

Tables are difficult to access by visitors using accessibility technology - for example, since their browser reads out the page to them, how can they take in the layout of a table at a glance and know whether to read acrss rows or down columns.

The general principles with tables are:

Try to avoid using them.
Definitely do not use them for layout alone, use them only for ordering data.
If you are using a table then you need to structure the code in certain ways so that the visitor using accessibility technology can make sense of them. After creating them in the editor you will need to view the source code (as for images above) and make some adjustments

Add a 'summary' to the table header, e.g. <table summary = "table showing the various telephone numbers for our surgery">
Use table headers and table date fields correctly - don't put <th> (header) just to make table data <td>appear in bold unless it really is a header row/column.
Don't omit headers just because to you the meaning might appear obvious from the context.
There are other guidelines regarding tables - refer to those on the Bobby site.

Page Names

Every page on the site should have a different name, even if they are for similar purposes in different sections of the site. This is so that visitors who cannot see the layout of your site are not confused by links with the same name taking them to different pages.

Design Principles

There are other points which warrant attention and this section will be extended in the future.