| THE WEB STANDARDS GROUP VOTED the following as Best Practices examples of UCSB Web pages and sites that conform to WSG recommendations. More examples will be added as sites are reviewed. If you feel your site is a good example of UCSB Web Standards in action, please bring it to the attention of the WSG. |
| Graphic Identity Best Practices Example |
|
The WSG voted the sample HTML pages below "Best Practices" examples of Graphic Identity standards.
Imitating the layout of the Web Standards Guide, this sample page incorporates the following WSG recommendations:
|
- UC Santa Barbara and university unit clearly displayed at the top of the page.
- Use of sans-serif font.
- Inclusion of standardized footer.
- CSS-controlled layout, with linked style sheets, for liquid design and enhanced accessibility.
|
| View Best Practices examples: |
|
|
| Download the source code for these examples: |
|
| Download the .psd file to make your own UCSB header: |
|
| Web Accessibility Best Practices Example |
| The WSG voted the UCSB CNSI Computing site a "Best Practices" example of Web Accessibility recommendations. The site was evaluated for conformity with the following standards: WAVE 3.0, W3C CSS, XHTML 1.0 Transitional, Web Content Report (508 Accessibility). |
| The site includes form, table, and formatting practices specifically designed for enhanced accessibility. |
Form Best Practices
http://hpc.cnsi.ucsb.edu/forms/request-user-account |
- Use the <caption> tag to describe/identify the form.
- Use <label> tags to associate descriptions with fields.
- Use field sets to associate radio buttons or check boxes.
|
Table Best Practices
http://hpc.cnsi.ucsb.edu/clusters/ |
| While CSS is preferred for controlling layout, use tables to present data. This table adds a scope=”col” attribute to <th> tags to associate a column with a table header. |
Formatting Best Practices
http://hpc.cnsi.ucsb.edu/clusters |
This page uses <div> tags to control layout in a display of the current status of high performance computer clusters.
|
|
