(Decided by the President on April 1, 2004)
Partially revised on April 1, 2005
Partially revised on August 1, 2011
Purpose of the Guidelines
These Guidelines are established as a separate document in relation to the Hiroshima University Official Website Management and Operation Guidelines , for the purpose of improving the web accessibility with regard to all webpages published on Hiroshima University’s WWW server.
Consideration to Readability
1. Attach a brief explanation with the “alt” attribute (alternative text) to images posted on a website.
Some people with difficulty reading text displayed on the screen may browse a website using a software program that reads aloud text information in a synthetic voice (hereinafter “voice browser”). This program reads aloud an “alt” explanation attached as an alternative to an image.
- In order to enable voice browser users to understand the content of images, attach brief explanations with the “alt” attribute (alternative text) to the images, e.g. alt=“A photo of the main lecture hall”.
- In the case of an image that serves as a link button, attach an “alt” explanation to specify the linked page, e.g. alt=“A link to Hiroshima University”.
- To avoid confusion, do not attach an alt explanation to decorative images with no particular meaning used simply for making the page look good, e.g. alt=“”.
2. Make it possible for each user to change the font size as they like.
Some users make text readable to them by changing the font size setting in the OS or browser. This is impossible if the font size is fixed by font points or number of pixels.
- When using a style sheet, designate the font size with a relative value, e.g. “font-size: 150%”.
- Do not designate the font size by font points or number of pixels.
3．Provide high contrast between the foreground and background colors. Use a color combination that is easy to distinguish.
Some users find it difficult to identify the content on a webpage where the contrast between the foreground and background colors is insufficient. It may also be difficult to read text written on patterns or photos.
- Provide sufficient contrast between the text and background colors to make webpages readable.
- Some users may find it difficult to distinguish color combinations such as red and green, red and brown, blue and black, blue and pink, white and yellow, and the like. Choose color combinations for the text and the background that are easy to distinguish.
4. Ensure that information conveyed with color can also be expressed without using color.
Some users find it difficult to distinguish colors. When using different colors for text, charts and graphs, keep in mind to make the content comprehensible without distinguishing colors.
- When emphasizing or categorizing content by color, add supplementary information (e.g. a text explanation, hatching, shading).
- When using different colors for text or categorization, make sure that information of the same content can be conveyed on black-and-white printouts.
- Some users are unable to perceive text decorations such as strike-through and boldface. Keep in mind to make the content of information comprehensible without such text decorations.
5. Do not use device-dependent characters such as encircled numbers.
Device-dependent characters (e.g. encircled numbers, single-byte katakana characters, double-byte Greek numbers, and special symbols) may not be displayed correctly depending on the OS used. Do not use these device-dependent characters.
6. Add a text explanation or caption as an alternative to audio or video information.
This is a measure that gives consideration mainly to people with a hearing impairment, but it is also beneficial to users who do not understand the Japanese language or who access the website using a computer without audio function. Prepare and add a text explanation or caption as an alternative to audio or video information.
7. Prepare HTML pages as alternatives to PDF files or non-HTML objects (Java, Flash, etc.)
It is often impossible for users who browse websites using a voice browser or who access websites only using keyboards to browse PDF files or non-HTML pages (Java, Flash, etc.) Prepare and provide alternative means or information so that the same information can be accessed without using these technologies other than HTML.
Consideration to Comprehension
8. Give an appropriate title to each page.
A voice browser reads aloud items of information on a webpage from top to bottom. Giving an appropriate title to each page helps in understanding the structure of the website and makes it easier to search for information.
- Give a title specific to each page that is easy to understand and associated with the page content, to the “TITLE” section of <HEAD>.
- Give different titles to pages which are on the same website.
9. Give a link title to a link button to clearly represent the content of the linked page.
- Give a link title to a link button to make it easy for users to imagine the page content that will be displayed when they click the button.
- If a linked page is on an external website, give a note to that effect.
- If a linked page is a PDF file or file in any other format, indicate the file format and file size.
10. Add an appropriate navigation aid to make it easier to locate each page within the website.
In order to make it easier to locate each page within the website and to move from one page to another within the same website, keep in mind to add an appropriate navigation aid. Make sure that it is easy to locate each page within the website and to move from one page to another within the same website by adding a breadcrumb list (a list of links to upper pages) or menu to each page.
11. When using a table, give consideration to the order in which a voice browser will read the table content aloud (from left to right, from top to bottom).
- Generally, a voice browser will read the table content aloud from left to right, from top to bottom.
- When using a table, keep in mind to structure the table to make the table content comprehensible to voice browser users.
Consideration to Operability
12. Make sure that users can skip a navigation aid or menu and jump to the main text.
Where a navigation aid or menu is placed prior to the main text on a webpage (in an upper section or left-side section of the page), voice browser users have to go through the navigation aid or menu from the beginning of the page to the main text. If the navigation aid or menu is extensive with a large amount of information, make sure that users can skip the navigation aid or menu and read the main text directly, by adding a link button to the main text in the upper left section of the page or placing the main text prior to (or on the left of) the navigation aid or menu.
13. Avoid using too many frames and arrange items in order.
A voice browser identifies and reads aloud frames as different pages. Therefore, frames are sometimes difficult to use for voice browser users. Also, if items are arranged at random, the frame for selection goes hither and thither, and users who access the webpage using a keyboard (without using a mouse) might lose sight of the item that they are selecting. To avoid this, use frames to the minimum, and when using frames, arrange items in order.
14. Make it possible to select all items, including links, buttons and menus, by using a keyboard alone.
Some users find it difficult to use a mouse due to a motor or visual impairment. Make sure that such users can access the webpage by selecting items using a keyboard alone.
- Make sure that the movement from item to item and selection of items can be performed using the “TAB” key or “ENTER” key.
- Make sure that all items in a menu or list can be selected by using the arrow keys in combination with the “TAB” key or “ENTER” key.
- If any of the items on the page cannot be accessed using a keyboard alone, think of an alternative method for providing information without using such inaccessible item.
15. Use buttons or other items of a large size for selection and insert an appropriate space between items so as to make it easier to select items using a mouse.
Other users may not be able to use a keyboard but operate a computer only by using a mouse. Also, it may be difficult to operate a mouse correctly due to trembling or under strain.
- Use large items for selection or add a link to text to make it easier to click items.
- Make sure to provide sufficient space between items for selection so as to avoid misclicks.
16. Prevent the website from creating motions without users’ choice.
A website that creates motions against users’ intention may interfere with its use.
- Prevent the website from reproducing sound automatically without users’ choice.
- Prevent the movement from one page to another from occurring automatically without users’ choice.
- Prevent the display screen from flickering at short intervals (twice or more per second).
Verification of Accessibility
17. Verify the accessibility on old computers and browsers and hear opinions from many users.
Some users may access a website using a computer with a small screen (800×600 pixels) or a browser not equipped with the latest functions, so it is necessary to confirm that the website is displayed properly on such old machines. It is also helpful to ask people with disabilities to use the website and hear their opinions on its accessibility.
18. Verify the accessibility of webpages.
Verify the accessibility of webpages by using a check tool (Japanese page), confirming the page content on black-and-white printouts, or confirming whether the website’s compatibility with a voice browser is assured when it displays text.
These Guidelines come into effect as of April 1, 2004.
These Guidelines come into effect as of April 1, 2005.
These Guidelines come into effect as of August 1, 2011.