|
|
|
|
User Interface Design
Basic Interface Design
GUIs (graphic user interfaces) were designed to give users more control over their
personal computers. We suggest that you design your site to provide potential visitors
with the latest in web technology without requiring them to conform to an interface which
would turn them away.
Navigation
Use of clear-consistent icons and banners will allow users to easily navigate the site and
find what they need quickly. The number of times a user must click and wait for
downloads should be kept to minimum with 3 clicks as a standard. A text link to
each area is also placed at the bottom of each page. All groups must provide clear
links to their section on each page as well as a link back to the main Tufts University
Veterinary Home Page.
Tufts Web Standards: (provided by Webcentral)
- Always include a contact name or email alias for the person who maintains
the page or site. A separate "contact us" page with this information
is common practice. (learn more)
- Include the postal address, phone number, fax number, and email address
of the department or administrative unit at the bottom of each page
or in a "contact us" page. (learn
more)
- Be certain that the term "Tufts University", or at least "Tufts" is
prominently displayed somewhere on your page, identifying your department
or organization's relationship to the university. For example, "Tufts
University Center for Cross-University Initiatives".(learn
more)
- Always use the <title> tag. You MUST have Tufts University in
your title tag. We recommend that the order of your title tag look like
the following: "Specific page name - Department name - Tufts University."
On all secondary pages, it is recommended you put a dash (-) between
the units listed in the title tag. For example, "About Us - Department
of Basketweaving - Tufts University." Aim for consistency in title tags.(learn
more)
- Use the DESCRIPTION, KEYWORD, and DATE meta tags on all pages of your
site. You can learn more about using these meta tags in the FAQ
on META TAGS.
- Use the websafe color.(learn more)
- Always include height, width, and alt attributes
for all image tags. Be certain that the height and width values reflect
the actual image size. Use Photoshop, Fireworks, etc. instead of image
tag attributes to alter sizes. For example, a 100x100 pixel image should
have an image tag that looks something like this:
<IMG SRC="FLOWER.GIF" HEIGHT="100" WIDTH="100"
ALT="Image of blossoming tulip">
The alt attribute provides text equivalents for text-only
browsers and browsers used by the visually impaired.(learn
more)
- Keep pages under 600 pixels wide whenever possible.(learn
more)
- Always include a link back to the Tufts Home page: http://www.tufts.edu.(learn
more)
- Always include a copyright statement.(learn
more)
- Consider maintaining a text-only site if your main site is graphics-intensive.(learn
more)
- Optimize graphics to as small a file size as possible without sacrificing
quality.(learn more)
- If your pages rely on Javascript, include a <noscript> tag for
those with Javascript disabled.(learn
more)
- Use http://validator.w3.org/
and http://www.cast.org/bobby/
to validate your pages. Try to address as many of the reported problems
as possible.(learn more)
- If using a white background, use bgcolor="#ffffff" in the <body>
tag. Some browsers still default to grey.(learn more)
|
|
|
| Currently, each department or group wishing to publish information on the TCSVM web server must contact Margret Branschofsky.
|
|