Make sure all of your pages have a unique title similar to the following:
SIUE Web Publishing - Building Accessible Web Pages
In Luminis this field can be edited by clicking the “i” icon next to the name of the document, and then editing the content within the title field.
This title should also include all of the content from the (one and only one) h1 element and preferably the first h2 tag on your page. The h1 element in luminis will always be the text in the gray bar just underneath your header. The more descriptive your title, the more likely you are to show up high on the list within search engines.
In the previous example, the h1 element would be “SIUE Web Publishing” and the h2 element would be “Building Accessible Web Pages”.
Ordered or unordered lists need some type of a navigation bar for users to find the list more easily if they aren’t using a mouse or are viewing the site in text-only. In the following example, you would select the text “Main Site Navigation” and choose the proper header element (almost always h2) from the text style drop down box. This is already done in your components and only applies if you have made changes to them.
If you would prefer not to show the header on the page, you can hide it using styles. This allows you to leave the appearance on your site you already have, while increasing your site's accessibility. This is usually only needed for components as you would most likely want the text to show up in the body of your page. The example below would need to be done in html view within the editor.
<h2 style="position: absolute; left: -200em; top:-20em;">Main Site Navigation</h2>
Make sure that when you use header elements, that they are properly structured or nested. Such as:
h1…h2, h3, h3… h2, h3, h3
h2…h1, h3, h3…h3, h1, h2
Make sure you have included alternate text for all of your images in luminis that accurately describes them. To add alternate text to an image, when you insert it into a document, simply enter text in the alt text field after you have selected the image. To add alternate text to an existing image, simply right click on the image, choose image properties, and enter the appropriate text into the alt text field.
If you insert a form into any of your pages, such as a contact form, make sure that any select controls (drop down box), radio buttons, check boxes, or a field that accepts text is properly labeled. The label “for” attribute should have the same value as the “id” attribute. The following examples should cover anything you will run into.
Text Box: These fields need to have a value attribute as well as an id attribute that matches the label. They also need a place holder value. This value can be set to disappear once clicked by using: onfocus="this.value=’’ "
<input type="text" id="realname" value="Enter your name here" onfocus="this.value=''"><label for="realname"> Name</label>
Select Controls: Select controls need one id attribute that matches the label as well as one of the options selected by default with selected=”selected”.
<label for="color">What is Your Favorite color?
<select name="color" id ="color" >
<option value="blue" selected="selected">Blue</option>
Radio Buttons/Check Boxes: Radio buttons and checkboxes need one id attribute that matches the label as well as one of the options selected by default with selected=”selected”.
<legend>What is your favorite color?</legend>
<li><label for=”blue”><input type="radio" name="color" id="blue" checked="checked" /> Blue</label></li>
<li><label for=”red”><input type="radio" name="color" id="red" /> Red</label></li>
Text Area: Text areas need a label corresponding to an id attribute as well as a place holder for the text which is within the textarea tags. In this example, the place holder is
“Please Enter Your Comments.”
<textarea name="comments" id="comments" rows="10" cols="40" onfocus="this.value=''">
Please Enter Your Comments.
Here's an example of a properly constructed form.
Anytime you want to put a document on your website it will need to be converted to a .pdf format so it can be accessible to everyone. If you only put Microsoft Word documents on your webpage, then anyone who does not have Microsoft Word can not view the files. Adobe Reader is a free download that most people already have installed on their computers and Adobe Reader is what people use to view .pdf files.
If you absolutely must put Microsoft Word documents on your site, you must also provide a .pdf version of that document.