The Web Guidelines will address recommended page layout and placement of
some elements such as the UCSD logo. Page layout and placement will be developed
in coordination with a graphic designer who is working with the Web Guidelines
committee on the redesign of InfoPath, UCSD's official web site, and the External
Relations page. Changes to this document will be made as appropriate. Elements
may include buttons, navigation bars, backgrounds, etc. These elements will
be made available for web page authors to use if they wish.
1.2
Use of the University Name
1.3
UC and UCSD Seals and Logos
1.3.1
UC
Seal
1.3.2
UCSD Seal
1.3.3
UCSD Logo
1.3.4
Other UCSD logos and
symbols
1.3.5
Official UCSD web page
seals
(see section 2.1.2)
1.4
Page
layout and page templates
The Web Guidelines committee will be developing page templates that web authors
can use to easily put their site together. Templates will be developed in
coordination with a graphic designer and will be easy to adapt to the needs
of various departments. Use of these templates is voluntary. Departments with
more complex web needs may wish to design their own web site using the Identity
Guidelines
1.6
Resources
1.6.1
Step
by Step checklist
The checklist will be made after the Graphical Identity guidelines
have been agreed upon.
1.6.2
Consulting services
There are a few departments that provide free and for-hire
WWW consulting services.
1.6.2.1 Free Services
1.6.2.1.1 The
Software Engineering Department of the UCSD
Libraries provides free consulting to campus units.
For more information, contact Janet Tait, Director, Software Engineering
Department at 858-534-6482 or webmaster@ucsd.edu
1.6.2.1.2
Academic
Computing Services' Instructional WWW Development Center (IWDC) provides
free training and assistance to faculty for help with their course web pages.
They provide free advice to anyone, though other services are outlined
in 1.6.2.2.1. The IWDC also exists to consult on the best
methods for WWW-course delivery at UCSD, specifically in ACS-managed labs. They can be reached at iwdc@ucsd.edu or 858-822-3315.
1.6.2.1.3
Academic
Computing Services offers free web site hosting to all students, staff
and faculty that have a Personal (e-mail) or OCE account. In addition,
ACS offers free hosting to student organizations registered with SOLO. Academic
Affairs Faculty (as well as those who have dual appointments and teach undergraduate
courses) may also obtain free hosting for course web sites. For more
information, see http://www-acs.ucsd.edu or contact ACS at
acs-consult@ucsd.edu or 858-534-4060.
1.6.2.2 For-hire consulting services.
Recharge units begin and discontinue services too often to make including
a comprehensive list possible. Currently,
the following groups have been identified as providing web publishing consultation,
development and/or hosting.
1.6.2.2.1
Academic Computing Services' Instructional
WWW Development Center (IWDC), http://iwdc.ucsd.edu, offers web development
and hosting. They can be reached at iwdc@ucsd.edu
or 858-822-3315.
1.6.2.2.2
The Publications Office offers web design services. They can be reached at 858-534-4754 or e-mail publications@ucsd.edu.
1.6.2.2.3
The School of Medicine’s Office
of Learning Resources provides web design services. They can be reached at 858-534-4139. More information is available at http://medschool.ucsd.edu/olr/comp/graphics.html.
1.6.3 Webdev
listserv
The Webdev listserv was established as a shared resource for
UCSD web developers, allowing them to easily ask questions of and provide
answers to their colleagues. To subscribe
to the list send e-mail to listserv@ucsd.edu
with body text that reads:
"add e-mail address webdev"
an example might be: add jdoe@ucsd.edu
webdev
2. Policy Requirements
2.1
Office of the President
web policy
The Office of the President is currently developing systemwide guidelines
called the Electronic Communications Policy. This policy is not yet final.
The policies noted in this document are in agreement with the most recent
posted version of the OP policy. Changes to this document will be made if
necessary after the OP policy is enacted. The current version of the policy
is posted at http://www.ucop.edu/ucophome/policies/ec/
2.2
Campus web policy
The Electronic Information Task Force has been appointed by the Chancellor
to develop a web policy for UCSD. This policy is currently in development
and is not yet final. Changes to this document will be made if necessary after
the UCSD Web policy is enacted. Here are some of the policy issues covered
in the UCSD Web Policy:
2.2.1
Logos and seals
Use of the University’s name is regulated by the State of California
Education Code 92000, as implemented by University policy, UCSD Identity Guidelines
and UCSD Policies and Procedures Applying to Student Activities 15.12.10.
2.2.2
Official UCSD Web Sites
An Official
UCSD Web Site is the primary UCSD Web Site for a unit of UCSD, representing
the unit on the World Wide Web. Every Official Web Site is registered with
the UCSD Software Engineering department of the UCSD Libraries and shall display
the UCSD Seal for Official Web Pages.
2.2.3
Copyright notice
The contents of all electronic publications must follow University policies
and procedures regarding copyright.
2.2.4
Contact person's name and address.
Each UCSD Web Site must display information disclosing its ownership, including
a contact name with email address.
3.
Organization/Style
3.1 Target Audience and
Mission
3.1.1
Before
beginning to design your site, first establish the goals of the site and your
primary and secondary audiences.
Does your site serve faculty, staff, students, prospective students, the public
or a combination?
3.1.2
Then
determine what organizational structure will best meet the needs of your audiences
and allow them to find information quickly.
3.1.3
Assemble
the site content that already exists (such as information in existing print
publications) and determine what needs to be added and/or what needs to be
excluded.
3.1.4
Organize
your site based on audience needs rather than on how your office is organized.
Make sure to have a rough sketch of how your site will be organized before
you begin development.
3.1.5
Make the
most important information immediately available to your users at the top
levels of your site – don’t bury it somewhere so that people have to go searching
for it.
3.1.6
If your site
is of interest to non-UCSD affiliates, remember to use full names of departments,
committees, etc. For example, if listing
IR/PS on a prospective students page, you should spell it out the first time
you use it, Graduate School of International Relations and Pacific Studies
(IR/PS).
3.1.7
Remember that even
if your target audience is a select group of people such as a small research
lab, people from around the world may find and peruse your site. Do not include any information on your public
web site that you do not want publicly disclosed. Assuming that others will have no interest
in your site is not enough.
3.2
Navigation
3.2.1
Use a consistent
method of navigation throughout all levels of your site. Never strand people
on “orphan” pages where they have to use the back button in order to return
to the home page.
3.2.2
Offer navigation
within long pages to avoid the need for cumbersome scrolling.
3.2.3
Be sure that
critical information and navigation tools are located at the top of the page.
3.2.4
An increasing number of Web pages feature the
main navigation buttons on the left-hand side of the page, so this is where
most users will look first.
3.2.5
Label buttons
clearly and do not make something look like a button if it is not.
3.2.6
Offer a site map or table of contents.
3.2.7
If your site
is complex, include a search engine so that people can quickly find what they
are looking for.
3.2.8
Use frames
appropriately if you use them at all. Also refrain from needlessly opening
new browser windows – this is confusing and disables the back button. (see
section 4.6 for more information on these topics).
3.3 Graphics/Images
3.3.1
The careful
use of images and graphics can go a long way to making your pages more inviting
and interesting, but be sure to use images that are clear, quick loading and
relevant to the text. If necessary, use thumbnail sketches of images and provide
links to high-resolution images that can be downloaded. This will prevent
the use of graphics from significantly slowing your download time.
3.3.2
Avoid the
gratuitous use of the latest technology fads. Most people will visit your
site in search of information, not to see a cool, spinning logo.
3.3.3
Avoid the
use of continuously running animations, scrolling headlines or flashing text.
Most users find these distracting and annoying.
3.3.4
Use icons
only when necessary and make sure their design matches the overall tone of
the site.
3.4
Responsiveness
and Download Time
3.4.1
Remember
that many people visiting your site may be using a relatively slow modems
(28.8 or 33.6) to access the Internet from home, so keep your download times
as short as possible. Users will be less frustrated if they can begin working
on at least part of the page while waiting for images etc. to download.
3.4.2
Always provide
ALT HTML tags for images so visitors know what images to expect. These are
also useful for those who are relying exclusively on text.
3.4.3
Avoid the
use of complex tables as these take a long time to download. Instead, divide
information into multiple, simpler tables.
3.5 Text
3.5.1
Keep your
text lively and succinct with the most important information provided first.
3.5.2
Avoid using
UCSD jargon and acronyms that would be unfamiliar to people outside of the
university or your field.
3.5.3
Provide URLs
within your text to links that will provide more detailed or related information.
3.5.4
Consider
breaking text into shorter, integrated pieces that are easier for readers
to digest over the Web.
3.6 URLs
3.6.1
Keep
URLs as short and simple as possible and try to make them have an obvious
relationship to the content. This will make them much easier for people to
remember.
3.7 Usability
Studies
The best
way to determine if your site is correctly designed to meet the needs of your
audience is to conduct usability studies. This involves asking people to navigate
through your site, watching what pathways they take, and noting any problems.
You can find information on usability testing in the Help section of InfoPath.
3.8 List of Links to Other
Tip Sheets and Style Guide
Here are some links to other useful style guides and tip sheets:
4.
Technology Issues
4.1
HTML 4.0 specification
Because of the variation of individual web browsers, it is a good idea
to use the HTML 4.0 specification
from the W3 Consortium and associated W3
Consortium approved technologies (such as HTML and Cascading Style Sheets)
when designing your web pages. Many non-W3C formats (e.g., PDF, Shockwave,
etc.) require viewing with either plug-ins or stand-alone applications. Often,
these formats cannot be viewed or navigated with standard user agents (including
assistive technologies). Avoiding non-W3C and non-standard features (proprietary
elements, attributes, properties, and extensions, for example , <BLINK>)
will tend to make pages more accessible to more people using a wider variety
of hardware and software.
Take special care when using vendor-specific HTML editors such as Microsoft
Front Page or Netscape Composer. It is a good idea to cross check your pages
on several different browsers including a text-only browser.
4.2
Get your site listed in Internet search engines
Your Official UCSD Web site will be automatically added to UCSD’s search engine when you register
it with the Software Engineering Department. It is your responsibility to
register your site with other search engines including commercial search engines
such as Yahoo and Alta
Vista. Some search engines may find your site automatically, but many
do not. Most search engines have information on how to get your site listed
with their search engine on their main page. There are also commercial services
that exist that will register your site for you.
You can find a list of prominent search engines on the Searching the Internet page of
InfoPath.
4.3
Use META tags to improve results in the UCSD search engine
You can use META tags on your web page to improve the results of your
page coming up in appropriate searches in the UCSD search engine and many
commercial search engines. The META tags “keywords” and “description” are
most often used for this purpose. “Keyword” allows you to list keywords that
describe the content of your site. These words will be weighed more heavily
when your page is searched, resulting in your page coming up sooner in a search
for these terms. The syntax for keyword is:
<META name=”keywords” content=”word, word, word, word, word phrase, word,
word”>,
for example:
<META name="keywords" content="oceanography, ocean, marine
biology, climatology, global change & the ocean, physical oceanography">
“Description” is also useful. It is used in place of the first
few lines of text when a search engine returns a description of the sites
it found. It describes your site better for people who are searching for it.
The syntax for description is:
<META name="description" content="text
about your site">
for example:
<META name="description" content="Scripps Institution
of Oceanography Library web site.">
You can find out more about META tags at Meta Tagging for Search Engines
from the Web Developer’s Virtual Library.
4.4
Organize
your content in a clear directory structure
4.4.1
Try to
organize your content in a simple directory structure. Put like items (such
as images) in one directory. Try to use shallow directory structures so that
URLs do not become long and unwieldy.
Examples of such directories might
include:
/images – all graphic files, including .jpeg and .gif files
/cgi-bin – a common placement for script and program files, including .pl
and .cgi files
4.4.2
Other
directories should be named based on your content. For example, a group of articles on Alumni might be grouped in an
/alumni directory.
4.4.3
Don’t
use spaces in your directory names, and do not mix upper and lower case if
possible.
4.5
Domain
names and URLs
4.5.1
There
are no regulations or standards for naming web sites. Most web sites fall
within the domain of ucsd.edu.
4.5.1.1
The most
common naming conventions for web sites are “department.ucsd.edu”, such as
“parking.ucsd.edu” and “www-department.ucsd.edu”, such as “www-chancellor.ucsd.edu”.
4.5.2
When
choosing a URL for one’s web site, keep in mind that it should be short and
memorable.
4.6
Use frames
and new browser windows sparingly
Carefully consider your use of frames and new windows and use them where
they are
most effective.
4.6.1
While
it is sometime appropriate to create a frames-based site, remember that this
structure makes it difficult for users to link to specific sections of your
site.
4.6.2.
Use frames for encapsulated presentations of information where it is
Frames are good for carrying a common presentation forward throughout a site
visit and typically are faster in the perceived download and display of information.
Frames don't allow bookmarking of pages within the frame site, and inadvertent
nesting of frames creates problems with navigation and site display.
4.6.3
If frames
are employed, think about using the <NOFRAMES>
option and name each frame to facilitate non-visual navigation.
4.6.4
New windows can be somewhat deceiving to the end user if they fully overlay
the other open windows. Typically, new windows are good for interrupting
an activity to present adjunct information,
such as help, instructions, capturing feedback, exploring an option, etc,
and then closing to return to previous work.
5. Accessibility
5.1
Policy
All electronic publications, to the extent feasible, must be accessible
to people with disabilities. These policies apply to all Web Sites intended
to accomplish the academic and administrative tasks of the University. (UCSD
Web Policy, Section 6.2)
5.2
Tips on accessibility
based on W3 Consortium guidelines
Web site creators should follow the recommendations in the W3 Consortium’s
Web Content Accessibility Guidelines (http://www.w3.org/TR/WAI-WEBCONTENT/)
as much as possible so that their pages are accessible to users who use assistive
technologies. See the Help page of InfoPath for resources on accessibility
issues.
5.3
Accessibility
tips
5.3.1
Design
for any browser. Avoid browser-specific technology. Adhere to the HTML 4.0
standard for best results for the most browsers.
5.3.2
Try
to employ browser built-in supported technology for vital content (html text,
gif images, etc) rather than proprietary formats such as Shockwave and PDF.
If you do use proprietary formats, try to provide alternative methods to get
the same content.
5.3.3
Avoid
using visual representation exclusively. Some of your users may not be able
to view visual material. Consider providing a text-based alternative, such
as a text description of the content.
Provide alternatives to all materials, such
as text alternatives for all images (use ALT tag), appropriate alternatives
for all video, audio or multimedia. Provide alternatives for anything requiring
a plug-in. Have text navigation alternative for all image maps.
5.3.5
Design
for any access speed. Avoid excessively large (file size) pages. Use placeholders
for large images (define height and width).
5.3.6
Content should be clear and legible. Use mark-up
appropriately, such as the <acronym> and <lang> tags.
5.3.7
Check your pages using a validator for HTML 4.0
and accessibility standards such as Bobby.
6. Copyright
6.1
Copyrighted
material must include explicit permission from the original author.
6.2
Do not
assume you can use pictures/copy without asking, even if the content originated
at UCSD and is currently posted on a web page. Publication on the web does
not imply that the material is not copyrighted.
6.3
If you
are unsure if something is copyrighted, check.
6.4
Identify the University of California on all
pages (or at least the main page) for copyright purposes. Example: Copyright © 1999 by the Regents of the University of California.See the
copyright notice on the main
page of InfoPath for an example of a longer and more complete statement.
6.5
Additional copyright resources on campus:
6.5.1
Technology
Transfers and Intellectual Property Services (TTIPS) can provide information
on copyright law, especially protecting your creations. They can be reached at invent@ucsd.edu
or 858-534-5815. More information
is available at http://invent.ucsd.edu
6.5.2
The
Copyright Task Force is a committee comprised of UCSD librarians with
an interest in copyright. Susan Jurist, Librarian, is Chair of the committee.
She can be reached at sjurist@ucsd.edu or at 858-534-7193. Their site is at http://gort.ucsd.edu/sj/copyright/
6.5.3
The
Digital Millennium Copyright Act Designated Agent is Tony Wood, Director of
Academic Computing Services. He should
be contacted at twood@ucsd.edu or 858-534-4050
if you would like to report a copyright abuse.
6.6
Web
resources on copyright:
The Copyright
Crash Course from University of Texas
7.
Housekeeping
Nothing is more frustrating than visiting a neglected website. Outdated
information or missing links on one page can make all other information on
the site suspect. To help mitigate problems:
7.1
Include a "last updated" date on each page
7.2
Encourage
error reporting by providing contact information and/or a feedback form (further
encourage it by promptly acknowledging any feedback you receive).
7.3
Assign
departmental "information stewards" to review pages on a regular
schedule.
7.4
Develop
processes and schedules for updating your site with new information and archiving
or deleting information that is no longer timely or useful.
7.5
Check your links frequently to identify bad URLs
and email addresses. A number of "link checking" programs are available
to help you with this task.
7.6
Routinely retest your site for user-friendliness.
Make sure it is easy to navigate for all users and that the processes employed
function properly and efficiently.
7.7
Backup your site. Maintain an organized and handy
back-up of all pages and related files on your site.
7.8
Keep your site current. Expect
to re-design your site every one to two years.
7.9
When "remodeling"
your site, try not to rename or move pages or directories. If you must move
one, provide a "redirection" page in the original location. Be sure to notify InfoPath and any other linked
sites of your new address.
