| |
"Before" |
"After" |
| Page title |
In "before.htm":
<TITLE> tags are not used.
|
In "after.htm":
<TITLE> tags used.
|
Color scheme
|
In "before.htm":
Colors are set using attributes in the <BODY> tag and applicable
<TD> tags.
|
In "after.htm":
Colors are set using a style sheet.
|
Top navigation bar and page heading
|
In "before.htm":
- Navigation bar and heading are combined into one image.
- No text alternative used to identify the image.
- No text alternative for image map's links.
|
In "after.htm":
- Navigation bar, heading and envelope icon are separate images, aligned
using a table.
- Images given text alternatives, using the ALT=" " attribute
in the <IMG ...> tags.
- Text alternatives added to the image map's links, using the ALT="
" attribute in the <AREA ...> tags.
|
Form
|
In "before.htm":
- Captions for several text boxes are placed after the box.
- Captions and boxes for the user's name are aligned using a table,
further separating the caption from where the user must enter information.
|
In "after.htm":
- Captions have been placed immediately before the related text box.
- <LABEL FOR=" "> tags and ID=" " attributes
have been added to the form element tags to further connect the captions
and boxes.
- Default values have been added to the text boxes as an additional
way to tell users what information to enter where.
- Added TABINDEX=" " attributes to form elements to specify
the navigation order for people using the Tab key instead of a mouse.
|
Table(s)
|
In "before.htm":
- Row headings marked visually, using <B> tags, rather than structurally,
using the <TH> tag
- Nested table used to align some text boxes and their captions.
|
In "after.htm":
- Row headings are marked structurally, using the <TH> tag.
- Nested table replaced by simpler vertical format.
- SUMMARY=" " attribute added to the opening <TABLE>
tag to clarify the purpose of the table
|
Bottom navigation buttons and PUNY
logo
|
In "before.htm":
No text alternatives for the images.
|
In "after.htm":
Images given text alternatives, using the ALT=" " attribute
in the <IMG ...> tags.
|