![](media/image1.png){width="1.1305555555555555in"
height="1.1305555555555555in"}

**Use Dark Text on Plain, High-Contrast Backgrounds**

**Standard:**

HHS must use black (preferable) or other dark text on a white or
off-white background when presenting text information---including
headers, captions, and prose text---on Web pages.

**Rationale:**

Research studies consistently show that dark text on a plain background
elicits reliably faster scanning and reading performance than on a
medium-textured background. When compared to scanning or reading light
text on a dark background, people read black text on a white background
up to thirty-two percent faster. In general, the greater the contrast
between the text and background, the easier the information is to scan
or read.

![](media/image2.png){width="3.745833333333333in" height="2.15625in"}

![](media/image3.png){width="3.698611111111111in"
height="1.7291666666666667in"}

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Boyntoin and Bush, 1956; Bruce and Green, 1990; Cole and Jenkins, 1984;
Evans, 1998; Goldsmith, 1987; Gould, et al., 1987a; Gould, et al.,
1987b; Jenkins and Cole, 1982; Kosslyn, 1994; Muter and Maurutto, 1991;
Muter, 1996; Scharff, Ahumada and Hill, 1999; Snyder, et al., 1990;
Spencer, Reynolds and Coe, 1977a; Spencer, Reynolds and Coe, 1977b;
Treisman, 1990; Williams, 2000.

**Use Dark Text on Plain, High-Contrast Backgrounds (Continued)**

**Exemptions:**

Background shades of color may be used in text boxes, panels, tabs, and
other elements of a Web page. There must be high contrast, however,
between the text (foreground) and the background. You must select color
combinations that can be discriminated by users with color
deficiencies/color blindness. You may be exempt from this requirement in
sites targeted to children, youth, and other groups with demonstrated
specific needs and requirements. In using colored backgrounds, though,
readability must be maintained, especially for individuals with low
vision, via contrast between text and background colors.

You may wish to use these resources:

-   [Colour Contrast
    Check](http://www.snook.ca/technical/colour_contrast/colour.html)
    (Jonathan Snook, Snook.ca)

> This tool allows you to specify foreground and background colors to
> determine if they provide enough contrast.

-   [Contrast Checker](http://www.q42.nl/demos/contrastcheck/) (Q42)

The contrast checker tool enables you to compare the contrast in a web
page.

-   [Making Text Legible: Designing for People with Partial
    Sight](http://www.lighthouse.org/print_leg.htm) (Lighthouse
    International)

Basic guidelines for making effective legibility choices that work for
nearly everyone.

**Requirements (content & style):** N/A

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Font Size and Typeface**

**Standard:**

HHS must use sans serif (such as Verdana or Arial) on Web pages. The
selected font must be used consistently throughout the site. In general,
usability tests have shown that users perceive sans serif fonts to be
more contemporary.

HHS must use Arial or Verdana font and the listed font size (or
equivalent) for standard text and links on all Web pages. Use the
following scale as a guide to determine size:

  --------------------------------- -------------------------------------
  **If the Font Type Is...**        **Then You Must Use...**

  Arial                             11 Point Font Size

  Verdana                           10 Point Font Size
  --------------------------------- -------------------------------------

If you have specialized audiences, use the appropriate font size to
accommodate them. For example, older adults may require a 12 point font
in Verdana to read effectively. Additionally, use "scalable fonts" or
fonts that will allow the user to increase and decrease text size using
the browser functions (e.g., View \> Text Size \> Larger).

**Rationale:**

Research has shown that fonts smaller than 11 points (Arial) elicit
slower reading performance from users.

**Exemption(s):**

A font size of one or two points smaller than the approved points above
may be used in the following situations (but in no case smaller than an
8-point font):

-   In data tables.

-   In PDF documents because of their nature and because they are
    expandable when opened.

-   In a navigation bar that presents secondary information such as
    bread crumb navigation or standard information/links that appear in
    the "footer" of a page.

-   For notices or disclaimers. For example: Documents in PDF format
    require the [Adobe Acrobat
    Reader®](http://www.adobe.com/products/acrobat/readstep2.html).

-   To present information and/or links in the footer of a Web page. For
    example: This is an official U.S. Government Web site managed by the
    [U.S. Department of Health & Human Services]{.underline}.

**Font Size and Typeface (Continued)**

-   To present secondary information that describes a prime link or
    piece of content. For example:

> [Confirmed Human Cases by
> Country](http://www.who.int/csr/disease/avian_influenza/country/cases_table_2006_08_23/en/index.html)\
> \[Note: Numbers are confirmed by World Health Organization and may not
> reflect news or country reports.\]

-   When you provide a "page text sizer" control that allows users to
    increase or decrease a font size. Examples of a page text sizer
    include: **[A]{.underline} [A]{.underline} [A]{.underline}** and
    **Text Size:
    [[SM]{.underline}](http://www.compliance.gov/index.html#%23)
    [[MD]{.underline}](http://www.compliance.gov/index.html#%23)
    [[LG]{.underline}](http://www.compliance.gov/index.html#%23)
    [[XL]{.underline}](http://www.compliance.gov/index.html#%23)**

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Bailey, 2001; Bernard and Mills, 2000; Bernard, Liao and Mills, 2001a;
Bernard, Liao and Mills, 2001b; Bernard, et al., 2002; Ellis and
Kurniawan, 2000; Galitz, 2002; Ivory and Hearst, 2002; Tinker, 1963;
Tullis, 2001; Tullis, Boynton and Hersh, 1995.

**Requirements (content & style):** N/A

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Designing and Employing Check Boxes**

**Standard:**

HHS must use a check box control to allow users to select one or more
items from a list of possible choices. In addition, a control that
allows users to clear checked box selections must also be provided.

Also, users should be able to select an option by clicking on either the
box itself or its label.

**Rationale:**

Users should be able to select each check box independently of all other
check boxes. One study showed that for making multiple selections from a
list of non-mutually exclusive items, check boxes elicit the fastest
performance and are preferred over all other widgets.

By providing users with a larger click zone area that extends to the
label and the check box, they are faster at making the selection. This
is especially true for older adults.

![](media/image4.png){width="4.942361111111111in"
height="3.7319444444444443in"}

**Exemptions:** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Bailey, 1996; Fowler, 1998; Galitz, 2002; Johnsgard, et al., 1995;
Marcus, Smilonich and Thompson, 1995.

**Requirements (content & style):** N/A

**Related Standards:**

-   [Use Radio Buttons for Exclusive Selections]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Designate Visited and Unvisited Links**

**Standard:**

To designate unvisited links, HHS must use the default blue text link
color (#0000FF, RGB (0,0, 255)); to designate visited links, HHS must
use the default purple link color (#800080, RGB (128,0,128)). For links
that point to the same target, all links should change color to the
default purple once the target site has been visited.

**Rationale:**

Link colors help users understand which parts of a Web site they have
visited. Providing this feedback, according to several studies, helps
improve users' speed in finding information. In addition, this color
convention is considered a common experience for users on the Web. By
following long understood conventions, we reduce users' confusion and
improve their overall success rates.

![](media/image5.png){width="2.8777777777777778in"
height="0.4354166666666667in"}

**Exemptions:**

Primary site navigation links that represent the major categories and
topics of a site are exempt. This primary navigation is typically
presented on the homepage and may be persistent across a Web site.
Examples of primary navigation items include tabs and left, right, and
middle panels (navigation bars). Graphic examples are provided below:

![](media/image6.png){width="3.1333333333333333in"
height="1.6423611111111112in"}

![](media/image7.png){width="4.252777777777778in" height="2.06875in"}

**Designate Visited and Unvisited Links (Continued)**

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Evans, 1998; Nielsen and Tahir, 2002; Nielsen, 1996a; Nielsen, 1996b;
Nielsen, 1996c; Nielsen, 2003; Spool, et al., 2001; Tullis, 2001.

**Requirements (content & style):** N/A

**Related Standards:**

-   [Use Text for Links]{.underline}

-   [Presenting Links to Materials in Multiple Languages]{.underline}

**Related Guidelines:**

-   [Provide Consistent Clickability Cues]{.underline} (Source: HHS
    Research-Based Web Design and Usability Guidelines)

**Use Text for Links**

**Standard:**

HHS must not use images alone as links. Links must be text. If an image
is clickable, a text description must be used in addition to the image
(along with the required alt tag). In that case, both the image and text
must be clickable. View the "Requirements" section below for format.

When providing a list of links, HHS should provide context descriptions
with each unless the context description indicates, in one sentence or
phrase, what the user will find at the linked page. View the
"Requirements" section below for format.

**Rationale:**

Text links are more easily recognized as clickable, usually download
faster than images, are preferred by users, and change colors after
being selected. In addition, it is easier to convey a link's destination
in text, rather than using an image. Another benefit to using text links
is that users with text-only and deactivated graphical browsers can see
the navigation options. In one study, users showed considerable
confusion regarding whether or not certain images were clickable; this
was true even for images that contained words. Users could not tell if
the images were clickable without placing their cursor over them.

Adding brief context descriptions to a set of link titles can help users
better understand the distinction between their options. Context
descriptions should be brief and add value to the link title.

**Exemptions:**

-   Context descriptions are not required on the Home pages of HHS Web
    sites because they function as menus or quick links.

-   Small thumbnail images that link to larger images (of the thumbnail)
    are exempt from this standard.

-   An agency logo does not need text, but it still needs a text link if
    there is no text option.

-   Graphics that are primarily text (e.g., tabs) are exempt.

-   With tabbed navigation, the navigation bars are exempt.

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Detweiler and Omanson, 1996; Farkas and Farkas, 2000; Koyani and Nall,
1999; Mobrand and Spyridakis, 2002; Nielsen, 2000; Spool, et al., 1997;
Zimmerman, et al., 2002.

**Requirements (content & style):**

When providing an image as a link, text must be provided in or alongside
the link:

Style examples:

![](media/image8.png){width="1.4479166666666667in" height="0.40625in"}
![](media/image9.png){width="0.9986111111111111in"
height="0.6666666666666666in"} ![](media/image10.png){width="2.03125in"
height="0.4583333333333333in"} ![](media/image11.png){width="1.03125in"
height="0.40625in"}

**Use Text for Links (Continued)**

Style examples for presenting context descriptions:

![](media/image12.png){width="5.384722222222222in" height="1.21875in"}

**Related Standards:**

-   [Designate Visited and Unvisited Links]{.underline}

-   [Presenting Links to Materials in Multiple Languages]{.underline}

-   [Image Maps (to be developed)]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Distinguish Required Data Entry Fields**

**Standard:**

HHS must clearly and consistently distinguish required data entry fields
from optional data entry fields. HHS must use ONE of the following
approaches to distinguish required data entry fields:

-   Provide an asterisk in front of the label for required fields. In
    addition, HHS must provide text stating: "A field with an asterisk
    (\*) before it is a required field." This statement must precede the
    beginning of the data entry form.

-   Provide the word "(Required)" in front of the label for required
    fields. In addition, HHS must provide text stating: "All required
    fields have the word (Required) in front of a label." This statement
    must precede the beginning of the data entry form.

-   Separate fields into required and optional when practical. These
    groupings must be clearly labeled "Required" and "Optional" and
    include the statement: "Fields are organized into required and
    optional groupings."

**Rationale:**

Users should be able to easily determine which data entry fields are
required and which are optional. Many sites are currently using an
asterisk in front of the label for required fields. Some sites cluster
required and optional fields to assist the user.

To comply with Section 508, it is not sufficient to use color or bold to
emphasize required fields. Colorblind users or those using screen
readers will not get the information.

![](media/image13.png){width="3.8222222222222224in"
height="2.3333333333333335in"}

**Distinguish Required Data Entry Fields (Continued)**

**Exemptions: N/A**

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Bailey, 1996; Fowler, 1998; Morrell, et al., 2002; Tullis and Pons,
1997.

**Requirements (content & style):** N/A

**Related Standards:**

-   [Designing and Employing Check Boxes]{.underline}

-   [Use Radio Buttons for Exclusive Selections]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Use Radio Buttons for Exclusive Selections**

**Standards:**

HHS must provide radio buttons when users need to choose one, and only
one, response from a list of mutually exclusive options. HHS must always
use at least two radio buttons in connection with each other. A single
radio button must not be used to present a lone item.

If users can choose not to activate any of the radio button choices, HHS
must provide a selection labeled "None." Designers and developers should
assign one of the radio button choices as the default, when appropriate.

Since radio buttons require only one choice, make sure that the options
are both comprehensive and clearly distinct.

In addition, users should be able to select an option by clicking on
either the button itself or its label. By providing users with a larger
click zone area that includes both the label and the button, users will
be faster at making the selection. This is especially true for older
adults.

**Rationale:**

Radio buttons are a series of on-screen buttons that allow only one
selection to be made from a group of options. By following the standards
above, radio buttons can be used for optimal user performance.

![](media/image14.png){width="1.7555555555555555in"
height="1.1055555555555556in"}

![](media/image15.png){width="1.35in" height="1.49375in"}

**Exemptions:**

-   If a set of mutually-exclusive options are greater than five or
    more, a drop down box or list box may be used to save space.

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Bailey, 1983; Bailey, 1996; Fowler, 1998; Galitz, 2002; Johnsgaard et
al., 1995; Marcus, Smilonich and Thompson, 1995; Tullis and Kodimer,
1992.

**Use Radio Buttons for Exclusive Selections (Continued)**

**Requirements (content & style):** N/A

**Related Standards:**

-   [Designing and Employing Check Boxes]{.underline}

-   [Using Drop-Downs (to be developed)]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Design for Dominant Screen Resolutions**

**Standard:**

HHS must design for monitors with the screen resolution set at 1024x768
pixels, but use a liquid layout that works well for any resolution, from
800x600 to 1280x1024.

**Rationale:**

As of December 2006, fifty-four percent of users have their screen
resolution set at 1024x768. By designing for screens set at 1024x768,
designers will accommodate this most common resolution, while balancing
tradeoffs for those using 800x600 and 1280x1024. Designers and coders
should test Web pages in the most common screen displays to ensure good
visibility, legibility, and aesthetics. Please note: As resolutions are
increasing, some users are viewing Web sites in smaller browser windows.

![](media/image16.png){width="4.927777777777778in"
height="2.2708333333333335in"}

Source: thecounter.com, 2006

*This information will be reviewed quarterly.*

**Exemption(s):** HHS STAFFDIVS should obtain approval through the HHS
Web Communications Division. HHS OPDIVS should get approval through
their Web Manager/Representative. \[Note: A formal process for approving
or denying exemptions will be created with HHS OPDIV Web
Representatives.\] You may get an exemption from this standard if:

-   Your web site logs or other data collection efforts indicate that
    the majority of your users have set resolutions other than 1024x768.

-   Pages, other than menu pages, may be exempt if there is a clear and
    present need for more tightly controlled dimensions to work with
    column widths, text boxes, images, or navigation widgets.

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

www.thecounter.com, 2006; Evans, 1998; Jupitermedia Corporation, 2003.
Nielsen, 2006.

**Requirements (content & style):** N/A

**Related Standards:** N/A

\[NOTE: Establish a notification system in the Web Content Management
System that reminds WCD staff to update this standard, if needed, on a
quarterly basis.\]

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Design Using Most Common Browsers and Operating Systems**

**Standard:**

HHS should design, develop, and test for the most common browser
(Internet Explorer release 6.x, as of December 2006) and Operating
Systems (OS) (Windows XP, as of December 2006); however HHS must design
websites that display without significant degradation for users using
other browsers, such as Firefox, Safari, Netscape, Opera, and older
versions of Internet Explorer (releases lower than 6.x) and other
operating systems such as Windows 2000, Windows 98, and OS X.

**Rationale:**

The goal is that users should be able to view Web content without having
to use a particular browser. To ensure that Web browsers are displaying
content without significant differences, designers and coders should
view the Web pages in different Web browsers on different Operating
Systems.

The preferred way to accomplish this is to design with browser and OS
neutral code (HTML 4.x, XHTML 1.x, etc). This means avoiding IE-specific
and XP-specific code and active X controls.

![](media/image17.png){width="4.863888888888889in"
height="2.8847222222222224in"}

Source: thecounter.com, 2006

*This information will be reviewed quarterly.*

**Design Using Most Common Browsers and Operating Systems (Continued)**

![](media/image18.png){width="4.875694444444444in"
height="2.8756944444444446in"}

Source: thecounter.com, 2006

*This information will be reviewed quarterly.*

**Exception(s):**

You may get an exemption from this standard:

-   If your Web logs or other data collection efforts indicate that the
    majority of your users are accessing information in a
    browser/version other than MSIE 6.x and operating system other than
    Windows XP.

-   If you currently employ Web applications that don't display or work
    well using the most common browsers and/or operating systems. These
    applications may be "grandfathered" in. \[Note: more details on how
    this will be handled will be developed with the HHS OPDIV and
    STAFFDIV Web Representatives.\] However, you must provide a
    prominent notice describing what browsers and/or operating systems
    work best with the application, as well as information on how to
    obtain said browsers.

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Evans, 1998; Jupitermedia Corporation, 2003; Morrell, et al., 2002;
Nielsen, 1996, thecounter.com, 2006.

**Requirements (content & style):** N/A

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

\[NOTE: Establish a notification system in the WCMS that reminds WCD
staff to update this standard, if needed, on a quarterly basis.\]

**Presenting Links to Materials in Multiple Languages**

**Standard:**

When foreign language content is available, HHS must present links to
this material on its menu pages (e.g., the homepage) and content pages.
Furthermore, links to foreign language materials must be presented in
their language (i.e., [En Español]{.underline}, not [In
Spanish]{.underline}). However, if you need to accommodate both
non-English and English speakers (e.g., those who need to find
information for a non-English speaking patient or family member), then
provide the non-English version in parenthesis. For example:
[Français]{.underline} (French). View the "Requirements" section below
for format.

**Rationale:**

Usability testing has found that users searching for information in
multiple languages prefer to find all versions grouped together on a Web
site. On document or content pages, users also expect to find what
versions are available for themselves, colleagues, or patients and the
public.

**Exception(s):** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

**Requirements (content & style):**

Comment: Link text (title of document) should be in the language as the
content of the document.

Another option is to have a clickable option En Español; when the person
clicks on it, the web site is made available in Spanish.

![](media/image19.png){width="1.6145833333333333in"
height="0.8333333333333334in"} 
![](media/image20.png){width="1.21875in" height="0.84375in"}

![](media/image21.png){width="3.8222222222222224in"
height="0.9895833333333334in"}

Example: [Healthy Heart]{.underline}

[Also available en Español,]{.underline} [Français]{.underline}, [Tiếng
Việt]{.underline}

**Presenting Links to Materials in Multiple Languages (Continued)**

On menu pages---such as the homepage and second-tier pages---present
both English and foreign language links together. Examples include:

> **Overviews**

-   [Nutrition for Seniors]{.underline}

> [Also available En Español,]{.underline} [Français]{.underline},
> [Tiếng Việt]{.underline}

**OR**

-   [Indiana Pandemic Influenza Plan (PDF -
    532 KB)](http://www.in.gov/isdh/pdfs/PandemicInfluenzaPlan.pdf) ([PDF
    en Español](http://www.usda.gov/documents/AI_Brochure_SPN.pdf) [--
    234 KB]{.underline})

On content/document pages, provide all available language versions under
the document title or in a consistent location on a Web page. For
example:

![](media/image22.png){width="4.613888888888889in"
height="1.3798611111111112in"}

  

**OR**

> ![](media/image23.png){width="2.888888888888889in"
> height="0.8416666666666667in"}

**OR**

![](media/image24.png){width="5.133333333333334in"
height="1.5034722222222223in"}

**Presenting Links to Materials in Multiple Languages (Continued)**

**Related Standards:**

-   [Designate Visited and Unvisited Links]{.underline}

-   [Use Text for Links]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Use Appropriate List Style**

**Standard:**

HHS must use bulleted lists to present items of equal status or value,
and numbered lists if a particular order to the items is warranted.

**Rationale:**

Numbered lists imply rank, sequence, or order. Bulleted lists generally
present items in a random order. Numbered lists are especially important
when giving instructions.

![](media/image25.png){width="4.957638888888889in" height="1.15625in"}

![](media/image26.png){width="2.001388888888889in" height="1.15625in"}

![](media/image27.png){width="4.625694444444444in"
height="1.542361111111111in"}

**Exemptions:** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Coney and Steehouder, 2000; Detweiler and Omanson, 1996; Lorch and Chen,
1986; Narveson, 2001; Spyridakis, 2000.

**Requirements (content & style):** N/A

**Related Standards:**

-   [Designing and Employing Check Boxes]{.underline}

-   [Use Radio Buttons for Exclusive Selections]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Use Mixed Case with Prose Content**

**Standard:**

HHS must use mixed upper- and lower-case letters when displaying
continuous prose text. This standard will apply to headlines, headers,
and links, as well as the body of content.

If a phrase is intended to attract the user's attention, display the
phrase in bold or italics. Only use these methods to emphasize one or
two words, or a short phrase, because they slow reading performance when
used for extended prose. They also cease being eye-catching.

**Rationale:**

TEXT PRESENTED IN ALL CAPS IS DIFFICULT TO READ. Reading text is easier
when capitalization is used conventionally to start sentences and to
indicate proper nouns and acronyms.

**Acceptable:** Use mixed case with prose

**Acceptable:** Use Mixed Case with Prose

**Unacceptable:** USE MIXED CASE WITH PROSE

**Exemptions:** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Breland and Breland, 1944; Engel and Granda, 1975; Mills and Weldon,
1987; Moskel, Erno and Shneiderman, 1984; Poulton and Brown, 1968; Smith
and Mosier, 1986; Spyridakis, 2000; Tinker and Paterson, 1928; Tinker,
1955; Tinker, 1963; Vartabedian, 1971; Wright, 1977.

**Requirements (content & style):** N/A

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Appropriate Use of Images on Web Pages**

**Standard:**

HHS should use images only when they communicate supplemental
information or otherwise enhance understanding. Images must serve a
specific informational purpose, i.e., provide support to the content,
rather than simply serve as decoration.

**Rationale:**

A Web site's graphics should add value and increase the clarity of the
information on the site. Adding unnecessary graphics pushes important
content down a page---thus improving the chance it will be missed---and
reduces the space available to present other important information. In
addition, users tend to be frustrated if they wait several seconds for a
graphic to download and then find that the image does not add any value.
Users also tend to have negative reactions to sites that display photos
of agency staff or stock photography that offer no informational value
to the content they are viewing.

![](media/image28.png){width="2.6666666666666665in"
height="2.9993055555555554in"}

**Exemptions:**

The use of traditional agency graphics, logos, headers, and mastheads on
a Web site is exempt. Additionally, you are exempt from this standard
if:

-   You can justify how an image fits within the mission of your Web
    site. For example, if your site is geared toward a specialized
    audience, such as children who may require visual content to learn,
    then strategic use of graphics is allowed.

-   The purpose of your page is to provide press release photos or event
    photos.

-   Logical images or icons are strategically used to call attention to
    a specific part of a page. Again, caution must be used as usability
    test findings indicate that users ignore images and icons that look
    like commercial ads.

**Appropriate Use of Images on Web Pages (Continued)**

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Badre, 2002; Evans, 1998; Nielsen, 1997e; Nielsen, 1999b; Nielsen, 2000;
Nielsen, 2003; Spool, et al., 1997; Wen and Beaton, 1996; Williams,
2000.

**Requirements (content & style):** N/A

**Related Standards:**

-   [Use Text for Links]{.underline}

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Present RSS and Podcast Links in a Consistent Format**

**Standard:**

When presenting RSS and Podcast features on a Web site, HHS must follow
the standard format and terminology provided below. HHS must use the
word RSS or Podcast to identify the technology, not XML or other
terminology or icon. In addition, HHS must provide a "Help" link
describing RSS and Podcasts. View requirements section below for format.

**Rationale:**

RSS and Podcast are increasingly being used on HHS Web sites to
communicate information. To help users understand and use these
features, the terminology and layout used to present them should be
consistent.

**Exemptions:** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\] N/A

**Requirements (content & style):**

![](media/image29.wmf){width="0.375in"
height="0.14583333333333334in"} [News Releases]{.underline}  [Help with
RSS]{.underline}

![](media/image29.wmf){width="0.375in"
height="0.14583333333333334in"} [Site Updates]{.underline} [Help with
RSS]{.underline}

![](media/image30.png){width="0.5625in"
height="0.14583333333333334in"} [Topic \[e.g.,
HealthBeat\]]{.underline}  [Help with Podcast]{.underline}

Note: HHS provides an image library at
<http://intranet.hhs.gov/web/#stand>. This library will continue to
expand with new images.

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]

**Provide File Type and Size with Downloadable Files**

**Standard:**

HHS must provide file format type and size information with all non-HTML
file-types such as Adobe Acrobat (PDF), MS Word (DOC), and Adobe Flash
(SWF) files.

When linking to a *single* file format that is not in HTML or another
browser-friendly format, place the file format notice at the link level
and use this format, [Subject/name of file (file format -- file size OR
number of pages or minutes).]{.underline}

When linking to *multiple* file formats that are not in HTML or another
browser-friendly format, place the file format notices at the link level
and use this format, [Subject/name of the file (file format#1 -- file
size OR number of pages or minutes]{.underline}) ([file format#2 -- file
size OR number of pages or minutes]{.underline}). View the
"Requirements" section below for format.

In addition, HHS must provide help instructions on how and where to
access necessary plug-ins needed to view non-HTML files. These
instructions must be available from a prominent location---such as a
linked notice placed at the top of a Web page or in the footer
location---and must be used on all relevant Web pages. View the
"Requirements" section below for format.

**Rationale:**

OMB guidance for public facing Web sites and HHS usability test findings
indicate that users want to know the file type. Users with low bandwidth
want to get a sense of the time required to view a resource. In
addition, you should provide instructions for downloading viewers and/or
players on all Web pages providing non-HTML files.

**Exemptions:** N/A

**Sources:** \[Note: this field is a placeholder. It will provide
detailed references and will be hidden from view in the online
version.\]

Badre, 2002; Evans, 1998; Nielsen, 1997e; Nielsen, 1999b; Nielsen, 2000;
Nielsen, 2003; Spool, et al., 1997; Wen and Beaton, 1996; Williams,
2000.

**Provide File Type and Size with Downloadable Files (Continued)**

**Requirements (content & style):**

Style for presenting single and multiple file formats:

-   Single File Format Example

> [What Is a Heart Attack and What Are the Long-Term Effects? (PDF --
> 230 KB]{.underline}) (National Heart, Lung, and Blood Institute)
>
> [What Is a Heart Attack and What Are the Long-Term Effects? (PDF -- 5
> pages]{.underline}) (National Heart, Lung, and Blood Institute)
>
> [What Are the Long-Term Effects of a Heart Attack? (Flash -- 1:30
> hr.]{.underline}) (National Heart, Lung, and Blood Institute)
>
> [What Is a Heart Attack? (Flash -- 30 sec.]{.underline}) (National
> Heart, Lung, and Blood Institute)

-   Multiple File Format Example

[Heart Attack]{.underline} ([PDF-- 106 KB)]{.underline}
([Flash](../../../../../../../../C:%5CDocuments%20and%20Settings%5Csanjay.koyani%5CDesktop%5CHH%5Cflashversion.flash)
[-- 242 KB]{.underline}) (National Library of Medicine)

[Heart Attack]{.underline} ([PDF-- 2 pages)]{.underline}
([Flash](../../../../../../../../C:%5CDocuments%20and%20Settings%5Csanjay.koyani%5CDesktop%5CHH%5Cflashversion.flash)
[-- 1:25 min.]{.underline}) (National Library of Medicine)

*(Note: The first item links to an HTML page.)*

[Heart Attack (PDF -- 106KB)]{.underline}
([Flash](../../../../../../../../C:%5CDocuments%20and%20Settings%5Csanjay.koyani%5CDesktop%5CHH%5Cflashversion.flash)
[-- 242 KB]{.underline}) (National Library of Medicine)

[Heart Attack (PDF -- 2 pages)]{.underline}
([Flash](../../../../../../../../C:%5CDocuments%20and%20Settings%5Csanjay.koyani%5CDesktop%5CHH%5Cflashversion.flash)
[-- 1:25 min.]{.underline}) (National Library of Medicine)

*(Note: The first item links to a PDF document.)*

Content and style for instructing users about how to access non-HTML
file formats:

-   If your page links only to PDFs, use this notice (or something
    similar):

> **Note:** Documents in PDF format require the [Adobe Acrobat
> Reader®](http://www.adobe.com/products/acrobat/readstep2.html). If you
> experience problems with PDF documents, please [download the latest
> version of the
> Reader®](http://www.adobe.com/products/acrobat/readstep2.html).

-   If your Web page links to multiple non-HTML files, use this notice
    (or something similar):

> **Note:** If you need help accessing information in different file
> formats such as PDF, MS Word, MP3, see [Instructions for Downloading
> Viewers and
> Players](../../../../../../../../C:%5CDocuments%20and%20Settings%5Csanjay.koyani%5CDesktop%5CHH%5Cinstructions.html).
>
> \[Note: See recommended format for the "Instructions for Downloading
> Viewers and Players" page at <http://intranet.hhs.gov/web/>.\]

**Related Standards:** N/A

**Related Guidelines:** \[Note: Related Web Guidelines from HHS'
*Research-Based Web Design & Usability Guidelines* and other relevant
sources will be added in this section.\]