Web Publishing Guidelines for the School of Public Health
Background
The UM School of Public Health (SPH) web site promotes the School
of Public Health and all of its programs and departments. The maintenance of the SPH web site is a collaborative effort by
the Web Administrator (Patty Bradley-Diehl, Informatics & Computing Services Web Services), the Content Specialist
(Mary Beth Lewis, SPH Office of Communications), and the Web Content
Managers from each academic department). This web group holds monthly
meetings to ensure that the various parts of the web site remain
consistent, dynamic, and adhere to established guidelines to facilitate a consistent and satisfying user experience for site visitors.
The Web Administrator is responsible for resolving technical issues,
updating and creating new web pages as required and providing web
services to the general SPH community. The Content Specialist contributes content
for the site, advises on the site's architecture, and assures that the
site's content is consistent with the web publishing guidelines so that the user experience is consistent and positive. Each Web Content
Manager (WCM) is responsible for maintaining their academic department's
portion of the site in compliance with these guidelines. All major new site work and design is
contracted to outside sources. Both the Web Administrator and the
Content Specialist assist the WCMs as needed.
Requests for web work
Requests for the following may be e-mailed to sph.web@umich.edu.
You can also use our online form .
- Requests for web work (mainly updates and corrections) that
do not fall under the umbrella of a specific academic department.
- Any SPH faculty, staff, or student who wants a link to an independently
created site added to a SPH web page. The Content Specialist and
Web Administrator will review the request to ensure that the content
of the page is suitable for external audiences and that the web site
adheres to the requirements contained in these
guidelines.
- Requests for changes to the home page, including suggestions
for headlines. The Office of Communications maintains the SPH
home page (www.sph.umich.edu), including headlines, features,
and links. Headlines are changed several times a week to reflect
current events and news at the school; features are changed approximately monthly; other parts of the home
page are not frequently changed.
Requests for UM SPH SiteMaker Sites
SPH faculty, staff and students may also request a UM SiteMaker
site that contains the look and feel of the SPH site at http://sitemaker.umich.edu/.
Once their request for a site is granted, they can create the site
themselves, or ask for help from the Web Administrator. Knowledge
of HTML is not required. SPH will periodically review all SiteMaker
sites with the SPH look and feel to ensure they to not deviate from
university and school policies.
Hosting Your Group's web site at SPH
School of Public Health Computing Services provides free web hosting for groups or centers clearly affiliated with the School of Public Health. These groups are responsible for developing and maintaining their own web sites. A list of such groups is provided on our Research Centers & Initiatives page. We also host several student groups.
If the person designated responsible for developing and maintaining the web site does not know how to create web sites using HTML, we recommend that they use the Adobe Dreamweaver web page editing program. Dreamweaver is available on all UM Computing Sites computers as well as the computers in the Public Health Library's Multimedia Lab.
Dreamweaver may be purchased at a discount from the following sources:
Web Services provides free hands-on Dreamweaver training workshops during Fall and Winter semesters. If needed, SPH Web Services can provide them with a list of vendors that groups have worked with before. Mary Beth Lewis, the school’s Web Editor, will be happy to look over web site content and suggest changes that will make it more consistent with the content on the SPH web site. Patty Bradley-Diehl, the Web Administrator, will be happy to assist with the uploading of initial files, and provide technical expertise.
Group web sites do not need to match the look and feel of the SPH web site. However, the Web Administrator will be happy to provide the group with templates if they wish to have their site look like the rest of the SPH web site. These templates are created to be used with the software Dreamweaver.
Once a group has their web site files ready to be published, they should follow the following steps:
- Familiarize themselves with our Web Publishing Guidelines before proceeding.
- Decide what the URL of the web site will be on the SPH web server. All URLs on the SPH web server start with http://www.sph.umich.edu/. The group needs to choose one short word, with all lower case letters and no spaces or special characters. This word will become the name of the folder that all their web site files are kept in on the SPH web server. For example, the Michigan Center for Genomics and Public Health’s URL is http://www.sph.umich.edu/genomics/. All of the web site files for this web site are in a folder called genomics.
- The SPH staff member who will be updating the web site needs to get an SPH UNIX account, if they do not have one already. There is no fee. There is a form for requesting this account
. When the staff member fills out the form, they can tell SPH Computing Services that they need their space on the web server set up, and what their folder will be called.
- Once SPH Computing Services has completed the request, the group’s space on the web server will be ready to have files uploaded to it. Files can be uploaded via Dreamweaver or SSH.
- Ask the Office of Communications if it is appropriate to put a link to the new web site among the major centers and initiatives (mostly multidisciplinary) listed on the Research Center & Initiatives page. This request can be initiated through an e-mail to sph.web@umich.edu, which is monitored by the Web Editor from the Office of Communications
If you need to hire an outside vendor to design or create your web site, please contact SPH Web Services to obtain a list of our recommended vendors.
Please feel free to contact sph.web@umich.edu for more information.
Guideline Contents
Tools for Updating
The SPH web site was designed using Adobe
Dreamweaver. SPH web pages may be updated using Dreamweaver or by hand-coding HTML. Please do not use Microsoft
FrontPage or Adobe GoLive to update your SPH web pages.
Web Services offers Dreamweaver workshops during
Fall and Winter semesters. ITCS offers
HTML workshops, as well.
Dreamweaver may be purchased at a discount from the following sources:
Files must be transferred to and from the SPH web server using
SSH (a secure protocol) instead of FTP. Contact the Web Administrator
for more information.
File Formats
Please observe the following guidelines regarding file formats:
- Web pages should be text files and have the extension
.htm or .html.
- Photographs should be .jpg or .jpeg files and should not exceed
100K in size.
- Web graphics should be .gif files and should not exceed
100K in size.
- PDF (Adobe Acrobat) files should be used only for pages that
will be printed.
- Microsoft Word, PowerPoint and Excel files are not formatted
for the web, and should not be used.
Additionally, no programs (executable files) may be installed
on or uploaded to the web server. Use of CGI applications is limited
to those already installed on the web server, such as HTMail, which
is used to send form data via e-mail. To use HTMail, please read the Using Form Mail at SPH page.
File Naming Conventions
The following conventions shoule be observed
when naming files and folders for the web.
- Web pages should end in either .html or .htm
- Your default home page should be named index.htm or index.html
- Use only lower case letters, numbers, dashes and underscores
- Do not use upper case letters, spaces or special characters
Names and Acronyms used at SPH
All names should be spelled out at first usage on a page, with
the acronym following in parentheses. After first usage, the acronym
can be used (although note that audio site readers will likely not be able to pronounce these acronyms as they would be spoken by humans. Below is a list of commonly used acronyms:
- AAA (or Allies): Allies Against Asthma
- ASPH: Association of Schools of Public Health
- BIOSTAT: Biostatistics
- CBPH: Community-Based Public Health
- CPP: Center for Population Planning
- CRECH: Center for Research on Ethnicity, Culture, and Health
- DRDA: UM Division of Research Development and Administration
- Dr.P.H.(note that we prefer degrees to include periods)
- EHS: Environmental Health Sciences
- EPID: Epidemiology
- ERIU : Economic Research Initiative on the Uninsured
- FAFSA: Free Application for Federal Student Aid
- HBHE: Health Behavior and Health Education
- HIPAA: Health Insurance Portability and Accountability Act
- HMP: Health Management and Policy
- IC: Interdepartmental Concentration
- LSS: Life Sciences and Society
- MAC-EPID: Center for Molecular and Clinical Epidemiology of
Infectious Diseases
- MCECH: Michigan Center for the Environment & Children's
Health
- MI-CPHP: Michigan Center for Public Health Preparedness
- M.P.H. (note that we prefer degrees to include periods)
- OAA: Office of Academic Affairs
- OFA: UM Office of Financial Aid
- OJ/OC: On Job/On Campus
- PHLI: Public Health Library & Informatics
- PHSA: Public Health Students Association
- PRC: Prevention Research Center
- SPH: School of Public Health (SPH I and SPH II for the different
buildings)
- UM: University of Michigan
- UM CP&P: UM Career Planning and Placement
- UM SPH: UM School of Public Health
- URC: Detroit Community-Academic Urban Research Center
Top
Requirements for All SPH Web Pages
SPH web pages should contain the following elements, all of which are a part of the Dreamweaver templates provided upon request from Web Services (sph.web@umich.edu):
- Blue UM SPH banner at the top of the page.
- Global Site navigation section at the bottom of the page.
- Navigational "breadcrumbs" bar just beneath the blue UM SPH banner, showing the user where he or she is relative to the other pages in our site. For example, "UM SPH > Careers."
- Working links to the external cascading style sheet(s) created for the site.
- Left-side navigation section that links to subsections of the site.
- Site Menu anchor link to bottom navigation section.
- Page title at the top of the page.
- Use of alt tags on images whenever possible,. This helps disabled users who view the web with screen reading software to see what our images are about. This is especially important for text graphics.
- No regular use of font tags, as they override cascading style sheet styles.
- Any link from the standard SPH website to off-site pages should open a new browser window (target blank).
Non-SPH Pages
Other sections of the SPH web site such as faculty member web sites and research project web sites are free to use their own unique design. They should adhere to the general principles described in these guidelines. Any link from the standard SPH website to off-site pages should open a new browser window (target blank).
Faculty Profiles
Faculty profiles must be created using the Administration Tool in order for them to be entered into our faculty profile database. This enables us to keep the page layout consistent, and make design changes to all pages at once.
Individual HTML and image files for faculty profiles reside in the /faculty/ directory. Index pages for each department's faculty are also generated automatically, and reside in the /faculty/ directory. Academic department pages should link to them as follows:
Top
SPH Banner, Footer and Cascading Style Sheets
The SPH banner, footer and cascading style sheets are
vital to maintaining a consistent look and feel throughout the site.
SPH Banner
The SPH banner that appears on all SPH pages is automatically generated via a link
to a server-side include. The code for the link is as follows:
<!--#include virtual="/inc/header.inc" -->
This code should reside just after the <body> tag. Please
do not change it.
SPH Footer
The SPH footer, which contains the site's global navigation, is also automatically generated via a link
to a server-side include. The following code must be placed just before the closing </body> tag:
<!--#include virtual="/inc/footer.html" -->
SPH Style Sheets
External cascading style sheets are used to achieve consistent
font faces, colors and sizes on all SPH pages. There is one cascading style sheet (css) file for the whole
site, and one for each directory within the site. The code for these
links is as follows:
<link rel="stylesheet" href="/css/sph.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="/css/print.css" media="print" />
<link rel="stylesheet" type="text/css" href="/css/mobile.css" media="handheld" />
<link rel="stylesheet" href="/foldername/css/stylesheet.css" type="text/css" /> replacing foldername with the actual folder name for the subsite
This code must reside in the <head> portion
of all pages. All Dreamweaver Templates include this code in the
proper place. Please do not change it.
File Permissions
In order for these elements to work, file permissions must be
set to 755 on the SPH web server. If you cannot set these permissions
yourself, please ask the Web Administrator to do so.
If any of these elements are not working correctly, please contact
the Web Administrator.
Navigational Elements
Department Pages
SPH web pages use text-based links for navigation. These links are contained in a single file that is incorporated into each page via a server-side include. The code for this include is as follows for each department:
- Biostatistics: <!--#include virtual="/biostat/nav.html" -->
- EHS: <!--#include virtual="/ehs/nav.html" -->
- EPID: <!--#include virtual="/epid/nav.html" -->
- HBHE: <!--#include virtual="/hbhe/nav.html" -->
- HMP: <!--#include virtual="/hmp/nav.html" -->
Non-Departmental web pages use similar links to navigation include files, for example:
- About SPH: <!--#include virtual="/about/nav.html" -->
- Alumni & Friends: <!--#include virtual="/alumni/nav.html" -->
Top
Obtaining Multimedia Elements for the web
The Public Health Library has the following resources for obtaining and optimizing
images, video, and PDF files for web pages:
- Scanners
- Adobe PhotoShop software (for editing and optimizing images)
- Video editing software
- Adobe Acrobat software (for creating PDF files)
- Microsoft PowerPoint (for creating slide shows)
- University Library Resources
Most of these are available in the Public Health Library Multimedia Lab, located
inside the SPH Library; digital cameras, video cameras, and video
editing software are available upon request.
In addition, the Office of Communications has a collection of stock
photographs, and can help you hire a photographer if needed. The Centers for Disease Control has a Public
Health Image Library (PHIL). Many images of these images are
copyright-free at the time of this writing.
NOTE: Every person publishing electronically is responsible for obtaining permissions for photos and videos used; a signed release is recommended.
Style Guide
In general, web writing needs to be more crisp and concise than
other types of writing. People browse more than they read on the
web, so use of subhead and bulleted lists is recommended. Linking and drill-down structure should
be used to expand upon topics, so information rarely needs to be
presented in full at first mention. Some people don't like to scroll
down web pages, so keeping text brief is highly recommended, especially
on the top levels of any site or sub-site.
Capitalization
- The school: the School of Public Health.
- The university: the University of Michigan.
- Capitalize "Professor," "Dean," etc. when
used before a proper name (e.g. Dean Warner, Professor of Epidemiology
George Kaplan), but not when following a name (e.g. Kenneth Warner,
dean of the school; George Kaplan, professor of epidemiology).
- Don't capitalize job titles such as "director" or
"vice president," e.g. Catherine McLaughlin, director of the
Economic Research Initiative on the Uninsured
; Joe Smith,
vice president of the Amoco Foundation.
- Capitalize SPH programs, centers, initiatives, interdepartmental
concentrations when a full and official title is used, e.g. Interdepartmental Concentration in Public
Health Genetics; Center for Statistical Genetics; Program in Human
Nutrition.
- Do not capitalize "master's degree" or "doctoral
degree."
- Do not capitalize course titles unless in a formal listing (e.g.
"Smith teaches human epidemiology," but "EPID 201
Human Epidemiology").
- Avoid unnecessary capitalization whenever possible. Examples
are:
- seasons (winter, spring, summer, fall)
- headlines
- program descriptions (panel discussion, forum, brownbag,
etc.)
Top
Numbers
- 1-10: write out number.
- 11-up: use numerals.
- Phone numbers: 734-994-3786 (do not use UM 5-digit abbreviations).
- Do not add "st" or "th" suffixes in dates
(e.g., June 1 and March 12).
- Punctuation
- " Use a series comma after the next-to-last item and before
the conjunction (e.g. "Drs. Thomas, Francis, and Rice met").
- Hyphenate "community-based" when using phrase as adjective
- Use standard style to put commas and periods inside quotation
marks; semi-colons and colons go outside the quotes; question
marks may go in or out depending on whether they are part of the
quoted material or are part of the sentence as a whole.
Spelling
- health care (two words)
- workplace (one word)
- master's degree (not masters degree)
- web site (one word, web not capitalized)
- e-mail (hyphenate)
Titles
In general, use "Dr." when focusing on a faculty member's
research; use "Professor" when focusing on teaching.
Top
Archiving Old Web Pages and Redirecting Users
The World Wide web is a dynamic medium. Information changes constantly,
as should our web pages. Old versions of web pages that have undergone
minor changes can be saved if desired, but it is not required. However,
when an entire site is redesigned
the old versions of web pages should be archived to a department
computers hard drive as well as to a back up medium such as a CD
or zip disk.
Old obsolete pages should stay live on the web server for a short
time after the new pages have gone live for two reasons:
- Web visitors may have bookmarked a page that is now obsolete,
and might return to it.
- External pages may contain links to our obsolete pages.
Our server logs data on all visitors to the SPH site, including
what pages are requested. The Web Administrator can track requests
for obsolete pages, and help in the decision when it is time to
remove them from the server. Staff members can also track these
requests themselves. Please see Web Site
Usage Statistics for
more information.
Occasionally, a redirect from an old (now nonexistent) page to
a new page with a different URL is necessary. Such requests should
be made to the Web Administrator.
Web Site Usage Statistics
UM SPH Web Services provides web site Usage Statistics Reports for
all sections of the SPH web site. These reports provide a wealth
of information about site usage. SPH Faculty and Staff can access
these reports via the SPH Intranet. Please contact the Web Administrator
for more information.
What to Avoid
- Wait until there is useful information on a page before linking
to it. Pages that have nothing on them besides our banner, navigational
elements, or text saying "under construction" should
not be linked.
- Avoid dead and inappropriate links. Check each of the links
on all of your pages every few months to make sure they are still
viable and appropriate.
- Minimize the use of Adobe Acrobat (pdf) files. pdf files are
to be used only for documents that will often be printed by users,
such as applications to be filled out and mailed. pdf files are
typically much larger than HTML files and are more difficult to
update.
- Avoid the phrases "click on" and "click here"
when establishing links. Links can be embedded in descriptive
words. If it is likely that the page will be printed for reference,
spell out the link as a hot URL.
- Avoid long text, breaking it into separate pages when possible.
- Avoid blinking text and animated images or flashing graphics. These
elements can cause seizures in epileptic users.
- Avoid using code that is not understood by both Netscape and
Internet Explorer. This means that Microsoft FrontPage should
not be used to edit web pages, as it inserts code that only Internet
Explorer will understand.
- Avoid using code that does not work in older versions of Netscape
and Internet Explorer. Viewing your pages in Netscape 4x prior
to launch will expose such problems. Feel free to contact the
Web Administrator for more information.
- Avoid using navigational elements that become inert if JavaScript
is turned off. Test web pages with JavaScript turned off in your
browser prior to launch.
- Avoid mailto links and @ signs in e-mail addresses: Collectors
of e-mail addresses for SPAM databanks systematically search web
pages for mailto links and @ signs.
- Following is an example of HTML mailto code: <a href="mailto:sph.web@umich.edu">sph.web@umich.edu</a>.
E-mail addresses that use this code are clickable, and if
the user's web browser and e-mail program are set up correctly,
will cause a new e-mail message to open with that address
in the To: field when clicked.
- Instead of typing an e-mail addresses as sph.web@umich.edu,
use the HTML code sph.web@umich.edu. It will show
up as sph.web@umich.edu.
- Avoid using black and white photos anywhere but historical sections
or designed back screens.
Accessibility Guidelines
Section 508 (added to the Rehabilitation Act (1973) in 1998) requires that Federal agencies' electronic and information technology be accessible to people with disabilities. If your web site is Federally funded, you are required to meet Section 508 criteria, which are as follows:
- 1194.22(a): A text equivalent for every
non-text element shall be provided (e.g., via
"alt", "longdesc", or in element content).
- 1194.22(b): Equivalent alternatives for any
multimedia presentation shall be
synchronized with the presentation.
- 1194.22(c): Web pages shall be designed
so that all information conveyed with color is
also available without color, for example
from context or markup.
- 1194.22(d): Documents shall be organized
so they are readable without requiring an
associated style sheet.
- 1194.22(e): Redundant text links shall be
provided for each active region of a serverside
image map.
- 1194.22(f): Client-side image maps shall
be provided instead of server-side image
maps except where the regions cannot be
defined with an available geometric shape.
- 1194.22(g): Row and column headers shall
be identified for data tables.
- 1194.22(h): Markup shall be used to
associate data cells and header cells for data
tables that have two or more logical levels of
row or column headers.
- 1194.22(i): Frames shall be titled with text
that facilitates frame identification and
navigation.
- 1194.22(j): Pages shall be designed to
avoid causing the screen to flicker with a
frequency greater than 2 Hz and lower than
55 Hz.
- 1194.22(k): A text-only page, with
equivalent information or functionality, shall
be provided to make a web site comply with
the provisions of this part, when compliance
cannot be accomplished in any other way.
The content of the text-only page shall be
updated whenever the primary page
changes.
- 1194.22(l): When pages utilize scripting
languages to display content, or to create
interface elements, the information provided
by the script shall be identified with
functional text that can be read by Assistive
Technology.
- 1194.22(m): When a web page requires
that an applet, plug-in or other application
be present on the client system to interpret
page content, the page must provide a link
to a plug-in or applet that complies with
1194.21(a) through (l).
- 1194.22(n): When electronic forms are
designed to be completed on-line, the form
shall allow people using Assistive Technology
to access the information, field elements,
and functionality required for completion and
submission of the form, including all
directions and cues.
- 1194.22(o): A method shall be provided
that permits users to skip repetitive
navigation links.
- 1194.22(p): When a timed response is
required, the user shall be alerted and given
sufficient time to indicate more time is
required.
For more information on making your web site accessible to the disabled, see the Web Accessibility Resources section of the Web Development Resources page.
Legal and Copyright Issues
- When using photos of people on a web page, obtain a signed
release granting permission to use their image on the Internet from all
people who appear identifiably.
- Observe copyright laws. Assume material is copyrighted unless
otherwise indicated, and obtain permission before using it.
- More information regarding copyright laws is available at:
Top
|