Download Guidelines - Rochester Institute of Technology

Brand Identity
Guidelines
Contents
Contents
From the President . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . i
The RIT Brand . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ii
Graphic Identity—History . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iii
Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iv
Contacts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . v
Last Updated:
January 2015
RIT does not discriminate. RIT promotes and
values diversity within its workforce and
provides equal opportunity to all qualified
individuals regardless of race, color, creed,
age, marital status, sex, gender, religion,
sexual orientation, gender identity, gender
expression, national origin, veteran status,
or disability.
©2015 Rochester Institute of Technology
All rights reserved P1222-01/15-JSA
Print . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Identity Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
Signature System Spacing Requirements . . . . . . . . . . . . . . . . . 3
College Signature System . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Typography . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
Colors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
Applications
Athletics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
Primary Mark . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Secondary Mark . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Tertiary Mark . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Primary Artwork Marks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Primary Word Mark . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
Secondary Word Mark . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Special Marks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Banners . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Miscellaneous . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
Merchandise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
Photography . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Publications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Stationery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
The Basics
Overview. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Executive Summary. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Brand Identity . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
University Goals. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
Contacts for Assistance. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
Before You Start. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
The RIT Identity on the Web. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Official Logo Graphics. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Typography and Fonts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Colors. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
The RIT Identity Bar and Other Required Components. . . . . . . . . 11
Navigation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Sources for Existing Content. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Social Media Guidelines. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Advanced Topics
Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Identity Requirements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Coding and Accessibility Guidelines. . . . . . . . . . . . . . . . . . . . . . . . . .
Website Monitoring. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
The RIT Web Template System. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Hosting Your Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Security . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Audio/Video and Photography. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Captioning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Legalities. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Intellectual Property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Privacy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Copyright. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Student-Model Photo Release. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Laws on Accessibility. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
16
16
17
19
19
19
19
20
22
23
23
24
24
24
24
From the President
From the President
The Importance of Standards
To enhance its position as a premier academic
institution, RIT needs to present to the public a clear,
united, and immediately recognizable “personality” or
brand. To communicate this solidarity, it is essential
that faculty and staff understand the significance
of their role in building the university’s brand.
We build our brand over time through the
messages we communicate in every medium: our
logo, or lettermark; the experiences of our students
and alumni; our reputation in the community and
around the world—in everything we offer. The RIT
brand then is more than an appearance. But our
brand identity, defined in the following guidelines,
pertains only to that—how we look.
The graphic standards that have gone into building
our brand appearance are identified in the following
pages to provide direction, clarify ambiguities, and
answer specific questions. They have been developed
through the cooperation of University Publications in
consultation with its campus partners in this
endeavor. The guidelines apply to every
office, department, college, and division that
produces information bearing RIT’s name.
i
The RIT Brand
The RIT Brand
It is easy to think of a brand simply as a logo,
an updated version of the old-time cattle brand
that was seared into cowhide. But today a brand
encompasses far more: The RIT brand is how we
are perceived by and what we represent to our
various audiences.
It has been said that a brand is a promise. It can
be tempting to believe that by promising to be
something, we will become it. But the RIT promise,
like all brand promises, is to uphold all that we are
already known for. That is, our customers can count
on RIT to be vibrant, responsive, innovative, experiential,
and creative. They can see it in our graphic identity
and our campus; read about it in news stories and
the alumni magazine; and hear it in the classroom,
the financial aid office, and the board room.
RIT expects above all that its dedicated faculty
and staff express this promise in their interactions
with students.
Lasting brands are built from the inside, and
communicate clearly and consistently to internal and
external constituencies. Much of what is contained
herein is intended to serve as a guide for materials
developed for communicating RIT to the external public.
The value of this identity guide, which gives visual
focus and consistency to the RIT print and Web,
is realized when its concept and content are accepted
and applied by community members.
ii
The RIT Brand
Graphic Identity—History
For most of its years, RIT’s graphic identity was
linked to its athletic teams and the school colors
which, dating back to the days of the Rochester
Athenaeum and Institute, were blue and gray.
After its name was changed to Rochester Institute of
Technology, the teams were identified as the Techmen.
In the mid-1950s, though, the team and coaches
sought a fiercer and more collegiate sounding name
and decided on the Tigers. Consequently, and after
an analysis of what colors were already in use by other
universities, the school colors were changed to brown,
orange, and white.
When the campus moved to Henrietta in 1968, the
colors were changed to burnt umber (Pantone 1675)
and orange (Pantone 165) to correspond more closely
to the brickwork of the new campus. A graphic mark
was designed at this time by faculty member Roger
Remington also to represent the architecture of the
new campus and depict a technical focus.
In 1989, University Publications was asked to create a
new graphic standard for all RIT publications, letterhead,
business cards, etc. that use the RIT lettermark (left).
The configuration of letters and dots in the lettermark can
be traced back to the 1950s, when an earlier RIT seal was
designed and implemented.
The administration determined that this mark should
be the university’s official identity symbol, used for all
printed and electronic materials relating to recruitment,
development, and other external communications.
In the early 2000s, the RIT colors were further refined
to orange (PMS 165 for use on coated paper or PMS 021 for
uncoated paper) and brown (PMS 476).
iii
www.rit.edu
RIT web address
RIT does not discriminate. RIT promotes and values diversity
within its workforce and provides equal opportunity to all
qualified individuals regardless of race, color, creed, age, marital
status, sex, gender, religion, sexual orientation, gender identity,
gender expression, national origin, veteran status, or disability.
RIT nondiscrimination statement
The sets of lettermarks and other graphics and the
identity guidelines provided here should be applied
when creating printed pieces and websites pertaining
to RIT. Specifications are included for fonts, colors,
measurements, and logos—everything that is needed to
achieve a consistent RIT appearance. Some of the images
can be obtained online; others can be requested from
University Publications or The Hub.
Publications intended for off-campus audiences
should include RIT’s Web address and nondiscrimination
statement. Public Safety statistics are included in some
publications intended for incoming students. Other items
that may be essential, depending on the audience or
purpose, include the copyright symbol and year, and
notice of sustainable printing products or processes.
Credit should always be given for others’ work.
The RIT brand includes many elements, tangible
and intangible, but its visual representation should be
correctly and consistently displayed on such common
items as letterhead and envelopes, business cards,
brochures, catalogs, banners, websites, team uniforms,
and campus signs.
These guidelines are bound to evolve with changing
technologies and tastes, always upholding the university’s
outlook and standards. Standards herein are guidelines
designed to ensure consistency, while still providing
room for creativity and differentiation. There is room
for variation and flexibility, and University Publications
welcomes inquiries about appropriate usage.
Nevertheless, however unique a major or department
may be, only very rarely will its appearance in print be
allowed to deviate from the RIT brand (see “Affinity
Logos”).
University Publications—as well as The Hub, RIT
Athletics, and the Web Advisory Committee—are charged
with the responsibility of overseeing the university’s
identity system. Changes are made only after careful
evaluation and consideration of university tradition.
Introduction
Introduction
iv
Contacts
Contacts
For help with
Contact
Athletics Design Standards
Lou Spiotti
475-2615
Business Cards The Hub
475-2300
Copyrights, Trademarks
Robert Colón
475-6932
Postal Regulations The Hub
475-2300
Publications Design
University Publications
475-4957
RIT Identity Licensing
Tina Karol,
Procurement Services
475-6803
RIT Identity System
University Publications
475-7940
Stationery & Envelopes The Hub
475-2300
Website Account Creation
ITS Help Desk
475-4357
Website Design
RIT Production Services
475-2555;
University Publications
475-4957
v
Print
Print
Introduction
Millions of sheets of printed materials are produced
annually at RIT as catalogs, stationery, newsletters,
booklets, and brochures. Our publications are designed to
inform and attract potential and current students, alumni,
parents, donors, and others with varying interests in the
university. Their presentation reflects the expertise of
designers, marketers, and writers in very specialized fields.
This section deals with only a small, but critical, part
of the print process—how the RIT brand is represented in
print. It will cover the components of the RIT identity
system, specifications for and examples of typography
and colors, and how and when the lettermark is applied.
The final step in the creative process involves the many
methods for producing print today, and University
Publications can manage that part of the process or
provide direction on the methods available.
1
Print
Identity Components
There are four components to RIT’s identity:
seals, lettermark, typography, and colors.
RIT official seals
Seals
The use of both seals (left) is restricted. The official
seal is reserved for formal uses, such as diplomas,
transcripts, and other official documents. It may be
used in special situations to communicate a sense
of the university’s history.
The contemporary seal is a special treatment of
the RIT lettermark and is more widely used than the
official seal. It may be seen, for example, on officially
licensed clothing and other merchandise and on the
RIT flag and podium.
Lettermark
The RIT lettermark is set in ITC New Baskerville Bold.
The same typeface is recommended for supporting
text used in proximity to the lettermark. Georgia may
be substituted for New Baskerville by PC users and
on websites. (See comparison, left.) The most common
examples of supporting text (next page) are the RIT
signature and what is commonly known as the
address block.
RIT official lettermark
Design requirements: The RIT lettermark is the only
authorized logo representing the university, and it
cannot be altered or combined with other shapes
or logo type. The use of secondary logos representing
colleges, divisions, or departments within RIT is not
allowed, except in the following circumstances: major
development campaigns; university anniversaries;
or other rare occasions. All secondary logos must be
approved by Jeff Arbegast, 475-7940, senior associate
director/director of university design, University Publications.
Versions of the lettermark that can be downloaded
are at www.rit.edu/upub/logos.html.
2
Print
Vertical orientation
5/8"
space
Rochester Institute of Technology
College of Xxxxxxxxxxxxxxxxxx
XX Lomb Memorial Drive
Rochester, NY 14623-xxxx
University Signature System
Spacing Requirements
Horizontal orientation
Rochester Institute of Technology
College of Xxxxxxxxxxxxxxxxxx
XX Lomb Memorial Drive
Rochester, NY 14623-xxxx
5/8”
space
RIT address spacing requirements between logo and text
3
Print
College Signature System (Vertical)
RIT’s signature comprises the lettermark and university
name (left). When more information is required—
for example, the return address on a piece of mail or
publication—there is an established hierarchy for the
presentation of such information.
The primary construction is simply the lettermark,
with Rochester Institute of Technology (both in ITC
New Baskerville) either directly beneath or to the
right of it. Secondary to those is the college or division
title, and the tertiary element is the school, office, or
department (left).
1—RIT
1—Rochester Institute of Technology
2—Development or College of Liberal Arts
3—Fund for RIT or International Studies
Each college has two versions of the lettermark graphic associated with a college name.
Both versions are available for download at www.rit.edu/upub/downloads.
4
Print
College Signature System (Horizontal)
RIT’s signature comprises the lettermark and university
name (left). When more information is required—
for example, the return address on a piece of mail or
publication—there is an established hierarchy for the
presentation of such information.
The primary construction is simply the lettermark,
with Rochester Institute of Technology (both in ITC
New Baskerville) either directly beneath or to the
right of it. Secondary to those is the college or
division title, and the tertiary element is the school,
office, or department (left).
1—RIT
1—Rochester Institute of Technology
2—Development or College of Liberal Arts
3—Fund for RIT or International Studies
Each college has two versions of the lettermark graphic associated with a college name.
Both versions are available for download at: www.rit.edu/upub/downloads.
5
Pantone 165 coated
Pantone 021 uncoated
CMYK 0C, 64M, 100Y, 0K
Hex # F36E21
Typography
Major recruitment publications are set in Myriad and
Minion, but a range of choices is available for other
publications, and different fonts are used for Web sites.
As mentioned previously, the lettermark uses ITC New
Baskerville.
RIT official colors: brown and orange
Pantone Black coated
Pantone Black uncoated
CMYK 25C, 25M, 25Y, 100K
Hex # 000000
Pantone Warm Gray 3 coated
Pantone Warm Gray 3 uncoated
CMYK 6C, 7M, 9Y, 15K
Hex # C7C3BD
Colors
RIT’s official colors are brown and orange. Brown and
orange are used on major recruitment publications, on
the RIT flag, for team uniforms, and wherever appropriate.
Black, white, and gray are acceptable accent colors, and
Pantone Warm Gray 3 has been approved for business
cards.
Identity Components Typography, Colors
Pantone 476 coated
Pantone 476 uncoated
CMYK 0C, 60M, 70Y, 85K
Hex # 513127
Specifications
Brown:
Pantone 476 coated or uncoated paper
CMYK 0C 60M 70Y 85K (coated or uncoated paper)
Hex #513127
Orange:
Pantone 165 coated paper
Pantone 021 uncoated paper
CMYK 0C 64M 100Y 0K coated and uncoated paper
Hex #F36E21
RIT secondary colors: black and pantone warm gray 3, white and gray are also acceptable
6
Applications Athletics
Applications
Athletics
The following list includes all collateral materials and
publications to which RIT’s graphic standards apply.
Questions about other examples should be directed
to Jeff Arbegast, senior associate director/director of
university design, University Publications, 475-7940.
Athletics
Lou Spiotti, 475-2615, oversees the application of and
licensing agreements for graphics and the RIT Tiger.
7
Applications Athletics
Athletics—Primary Mark
The RIT Athletics primary mark is one of the most
recognizable marks in the RIT brand family. It is to
be utilized in materials distributed off-campus. The RIT
Primary Mark is to be reproduced in three colors (PMS
1505, PMS 167, and black), and should always be
displayed at a minimum of 2.75" wide. The typeface
used is Compressor-Wedge Serif.
Athletics primary mark
8
Applications Athletics
Athletics—Secondary Mark
The RIT Athletics secondary mark is to be used
on-campus as a stand-alone mark or in conjunction
with the RIT sports marks. When the secondary athletic
mark is to be reproduced in two colors (PMS 1505
and black), the background may be white, black, brown,
orange, or gray. When the mark is reproduced in black and
white, it should appear on either a white or a black
background only. Regardless, it must always be displayed
at a minimum of 2.75" wide.
Athletics secondary mark
9
Applications Athletics
Athletics—Tertiary Mark
The RIT Athletics tertiary mark is not to be used as
a stand-alone mark, but in conjunction with the RIT
Athletics primary, secondary and/or word marks where
legibility is an issue (on helmets, shoulder patches,
or shorts, for example). When the tertiary mark is
reproduced in three colors (PMS 1505, PMS 167, and
black), the background may be white, black, brown,
orange, or gray. When the mark is reproduced in black and
white, it should appear on either a white or a black
background only. Regardless, it must always be displayed
at a minimum of 1.75" wide.
Athletics secondary mark
10
Applications Athletics
Athletics—Primary Artwork Marks
The RIT Athletics primary word mark may be used on or
off-campus, as a stand-alone or in conjunction with RIT
Athletics secondary marks or sports marks. When the
primary word mark is reproduced in two colors (PMS 1505
and black), the background may be white, black, brown,
orange, or gray. When the mark is reproduced in black and
white, it should appear on either a white or a black
background only. Regardless, it must always be displayed
at a minimum of 2" wide.
Athletics primary artwork marks
11
Applications Athletics
Athletics—Primary Word Mark
Athletic Word Marks offer the greatest flexibility of all
of the Athletic Marks for they literally spell out the RIT
brand. They may be used on or off-campus, as a standalone or in conjunction with Secondary Marks or Sports
Marks. The RIT Primary Word Mark is to be reproduced in
two-colors (PMS 1505 and Black) and should always be
displayed at a minimum of 2" wide.
Athletics primary word mark
12
Applications Athletics
Athletics—Secondary Word Mark
The RIT Athletics secondary word mark may be used
on or off-campus, as a stand-alone or in conjunction
with RIT Athletics secondary marks or sports marks. When
the secondary word mark is reproduced in two colors
(PMS 1505 and black), the background may be white,
black, brown, orange, or gray. When the mark is
reproduced in black and white, it should appear on either
a white or a black background only. Regardless, it must
always be displayed at a minimum of 2.25" wide.
Athletics secondary word mark
13
Applications Athletics
Athletics—Special Marks
Athletics special marks
14
Applications Banners
Banners
The use of each college’s unique banner is restricted
to Commencement ceremonies and similar official
university-wide events. The Provost’s Office oversees
the banners’ use.
15
College of Applied Science and Technology—Concentric
circles around a nucleus exemplifies the interrelationship
among different programs within the College of Applied
Science and Technology. Each pathway flowing around the
center is linked, showing bridges that allow for many
different career paths. The mechanical nature and precision
of the pathways suggest science, technology, engineering,
and service.
Saunders College of Business—Arrows pointing in many
directions signifies the diverse activities of the Saunders
College of Business. The arrows, a common symbol in
business, reflect the financial, marketing, and entrepreneurial
directions of business. The multiple directions in which they
point intimate two-way transaction and constant exchange
in the global marketplace.
Applications Banners
Banners
B. Thomas Golisano College of Computing and
Information Sciences—With a grid of repeating circles, this
symbol signifies the basic computer vocabulary of zeros and
ones that conveys knowledge, information, and technology.
The B. Thomas Golisano College of Computing and
Information Sciences is represented by a symbol that
suggests computer pixel construction and the organization,
movement, and transmission of information.
Kate Gleason College of Engineering—This strong
mechanical symbol represents the many facets of the Kate
Gleason College of Engineering. Its configuration suggests a
structured, cohesive system with connectivity, interaction,
and movement. The circular terminals at the ends of the
intersecting stems suggest a balance of humanistic-social
subjects, physical sciences, and professional studies.
College of Health Sciences and Technology—With a
stylized DNA molecule encircling the EKG pattern, this icon
symbolizes the link between the types of programs offered in
the College of Health Sciences and Technology: the science
and research programs and the medically oriented clinical
programs.
RIT college banners (more on next page)
College of Imaging Arts and Sciences—With light
as the key component for all things visual, this symbol
represents the College of Imaging Arts and Sciences
with radiating rays of light. It is a combination of concentric
circles and angled forms that allude to two- and threedimensional design, a camera lens, a printing cylinder,
and the human eye.
16
National Technical Institute for the Deaf—Emanating rays of
light personify deaf and hard-of-hearing students, each an
individual, yet preparing together for technological careers,
ready to go in all directions in a global society, represented
by the circular shape. The allusion to an eye conveys the
importance of visual communication, and the center represents
the beacon that is the National Technical Institute for the Deaf.
Applications Banners
College of Liberal Arts—The College of Liberal Arts is signified
by a fleuron with a crown-like shape that suggests high honor
or nobility. With programs based in the humanities and the
social sciences, this college is represented by a symbol
connecting the past with the present in an organic, reflective
manner.
College of Science—The classic symbol of the atom as the
fundamental building block of matter represents the College
of Science. The symbol signifies an inner core with outer
rings that orbit the central nucleus, conveying the perfect
harmony through which physics, biology, chemistry, medicine,
mathematics, and statistics coexist.
Golisano Institute for Sustainability—With an image
representing water, wind, and the Earth, this insignia symbolizes
the energy of the sun, which powers clean energy, healthy
environments, and pollution prevention. The inner
gear, surrounded by leaves, reinforces the central ideas of
sustainability: remanufacturing, diverse and productive
ecosystems, nanopower, government and society, and the
management of human consumption.
RIT Croatia—As four appendages revolve around a central
managing hub, this symbol represents the reciprocating
partnership of business and technology within the RIT Croatia
college.
RIT college banners
RIT Dubai—With a sun representing the dynamic energy of the
institution and wavy lines signifying the fertile environment for
developing globally savvy students, this symbol signifies RIT
Dubai’s commitment to the highest standards of career-focused
higher education.
American University in Kosovo—An organic symbol with
individual entities representing parts of a well-organized system
represent the entrepreneurial leadership at the core
of the American University in Kosovo. The six tapered points
reach out to the business community. The circular configuration
shows motion, activity, and unity.
17
Applications Miscellaneous
Merchandise
Chiefly sold through Barnes & Noble @ RIT; licensing
agreements overseen by Peter Briggs in consultation with
Robert Colón, RIT legal counsel.
RIT merchandise available through Barnes & Noble @ RIT
18
Applications Miscellaneous
Rochester Institute of Technology
University Publications Office
22 Lomb Memorial Drive
Rochester, NY 14623-5604
585-475-4973, Fax: 475-7783
RELEASE
I, ________________________________________, for consideration received, do hereby grant to Rochester Institute
of Technology (“RIT”), and its respective individual employees, directors, officers, agents, representatives, successors and
assigns, the absolute and irrevocable right and unrestricted permission, for any purpose whatsoever and without further
notice to me or any other or further consent or authorization from me to use, reproduce, broadcast, telecast, announce,
publish, present and display my name, likeness, features, voice, manual language expressions, identity, resemblance,
quotations or photographs, whether alone or in combination, and whether contained or depicted in any photographs,
pictures, video, television, digital motion and other electronic media images or other recorded materials of me or in which I
may be included with others, either still or moving, live or delayed, or otherwise including any written quotes of information
that I readily shared with interviewers; and to copyright same and use individually or in any and all media now and in
the future for illustration, promotion, art, editorial, advertising and trade or any other purpose and to use my name in
conjunction with the above.
I agree that I am entitled to no compensation for any such use of my name, likeness, features, voice, identity, resemblance,
quotations or photographs other than what may have already been given to me.
I assign to RIT all rights, title and interest that I may have in the above referenced materials and waive all claim and title
thereto and therefor. And I do hereby release RIT, its individual employees, directors, officers, agents, representatives, successors
and assigns, including the person who took or produced the above referenced materials, now and forever, from any actions,
suits, claims, covenants, damages, executions, demands and liabilities which I or my heirs, representatives, successors
and assigns ever had, now have or may have arising out of the aforesaid authorization and consent, without limitation,
including any claims for libel or alleged misrepresentation of me by virtue of alterations or faulty mechanical reproduction.
Please print:
Full Name/Title:
Date of Birth:
College/Program:
Expected Graduation Year:
Photography
Standards for photography have necessarily adapted
to today’s casual, on-the-fly methods of image capture.
Nevertheless, RIT’s internationally known photography
school continues to set high standards as the field
evolves. It is essential that the photography seen online
and in university publications respect these standards and
the school’s reputation.
Address:
Signature:
Date:
Parent/Guardian Consent (required if under 18 years of age)
Parent/Guardian Signature:
Date:
Download the RIT model release form at www.rit.edu/academicaffairs/etc/RIT_Model_Release.pdf
19
Applications Miscellaneous
Publications
Recruitment- and development-related and official
internal pieces are produced by University Publications
(Ellen Shady, director, 475-4957).
Publications intended for off-campus audiences should
include RIT’s Web address and the antidiscrimination
statement. Public Safety statistics are included in some
student-directed publications.
Note: Publications created for student events and
for casual and on-campus use need not conform to
the guidelines cited here except as they apply to the
RIT lettermark.
A sampling of RIT publications
20
envelope sample
Applications Miscellaneous
Stationery
Orders for all of the following are processed by
The Hub: letterhead, standard-size envelopes, return
envelopes, postcards, business reply cards, invitation
cards, envelopes, reply cards, and/or envelopes,
faculty, staff, and graduate student business cards.
Design requirements
RIT business cards, letterhead, and envelopes can be
printed in three-color with Pantone 476, Pantone Warm
Gray 3, and black. RIT stationery, envelopes, and business
cards should be printed on white paper stock only.
business card sample
Business Cards
RIT business cards are supplied to all faculty/staff at RIT.
There have been a few instances where RIT has
provided business cards to doctoral students currently
enrolled here who meet specific criteria: paid
employment in research projects or the like at RIT.
RIT does not provide or print business cards for RIT
alumni, unless they are currently employed at RIT.
Letterhead sample
21
Web
Web
www.rit.edu
About this Document
Last Updated:
January 2015
Developed by:
University Publications
Information and Technology Services
RIT Production Services
RIT Web Advisory Committee
Chief Communications Officer
Approved by:
President
Senior Vice President for Enrollment Management
and Career Services
©2015 Rochester Institute of Technology
All rights reserved P1222-01/15-JSA
1
Web
Contents
The Basics
Overview. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Executive Summary. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Brand Identity . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
University Goals. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
Contacts for Assistance. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
Before You Start. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
The RIT Identity on the Web. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Official Logo Graphics. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Typography and Fonts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Colors. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
The RIT Identity Bar and Other Required Components. . . . . . . . . 11
Navigation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Sources for Existing Content. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Social Media Guidelines. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Advanced Topics
Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Identity Requirements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Coding and Accessibility Guidelines. . . . . . . . . . . . . . . . . . . . . . . . . .
Website Monitoring. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
The RIT Web Template System. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Hosting Your Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Security . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Audio/Video and Photography. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Captioning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Legalities. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Intellectual Property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Privacy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Copyright. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Student-Model Photo Release. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Laws on Accessibility. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
16
16
17
19
19
19
19
20
22
23
23
24
24
24
24
2
Overview
Web The Basics
The Basics
Executive Summary
Web standards are vital for any organization and are
particularly important for RIT, one of the largest private
universities in the nation. RIT’s reach spans across a wide array
of constituents both nationally and internationally.
Understanding RIT’s diverse audience is essential to creating a
cohesive and consistent graphic identity. The Web is a major
component in any communications strategy, offering an
opportunity for RIT to reinforce and extend its visibility and
identity worldwide.
All organizational entities of the university—including
individual divisions, colleges, centers, institutes, and
administrative departments—should follow these Web
standards and identity guidelines. While created to promote
consistency across the “official” RIT Web presence, they also
allow creative latitude and individuality for RIT entities while
maintaining a visual common ground to RIT as a whole.
“The Basics” section of this document will assist RIT faculty
and staff in maintaining the university’s identity on the
Web, and will guide stakeholders, developers, and content
providers in the website creation and maintenance process.
Detailed information for Web developers is located in
“Advanced Topics.” These standards and identity guidelines are
intended for internal use and for external Web development
contractors who have been engaged by RIT.
All official RIT websites will follow the standards and
identity guidelines set forth in this document. Official
university websites include RIT division, college, academic
department, and administrative department websites. These
standards do not apply to personal websites for faculty, staff,
students, or student clubs and organizations.
3
Web The Basics
Brand Identity
RIT has enjoyed a dramatic rise in stature in recent decades.
According to brand research conducted on behalf of RIT, the
university has done a good job of communicating its message
to the external market and its many constituencies. In particular,
prospective and enrolling students report that their perception
of RIT is of a highly career-focused, specialized, and technological
university. The research also points out that there is much to be
lost if these perceptions should slip in the external market.
Therefore, RIT Web content should continue to reinforce these
well-known RIT attributes.
The brand research recommends that broadening and
redefining these attributes—through creativity and innovation,
redefinition of community, and becoming more globally
positioned—will be critical in the future. Additionally, more
broadly and effectively describing the aspects of its social
and community life advances RIT’s aspirational brand.
Brand focus should include innovation, creativity, and
collaboration as a defining feature of the RIT experience. Web
stakeholders, developers, and content providers should keep the
following RIT vision statement in mind as they develop their site:
RIT will lead higher education in preparing students for
innovative, creative, and successful careers in a global society.
The following statement, too, supports RIT’s vision:
Among the nation’s technologically focused universities,
RIT is distinguished as a community that generates sparks of
inspiration, genius, and ambition; of creativity, perspective,
connection, and synergy; and of spontaneity, community, and
fun as it prepares students for 21st century career success.
The result is a unique blend of rigor and imagination, of
specialization and perspective, of intellect and practice that
ensures RIT graduates of success not only in a first job, but over
a lifetime career.
Specific recommendations from the brand research relating to
RIT’s Web presence follow:
• All Web, print, and other materials from or about RIT should
reflect consistent design, production, and content standards.
• Individual college websites and publications should all be
immediately recognizable as divisions of RIT and reflect the
larger RIT brand. Guidelines intentionally provide latitude
for college websites to be differentiated.
• The university’s design, imaging, and printing expertise
should be evident in all university-related publications,
Web material, and the like.
4
Web The Basics
University Goals
Strategically choosing content for an official website can
positively influence progress toward RIT’s goals. Accordingly, the
website stakeholder and developer should weigh carefully the
selection of design, navigation, writing, photography, and video.
A few of those goals include:
• Broaden geographical reach, contributing to growth in
national and global student, employer, and partner interests
• Embrace and reflect diversity of students, faculty, and staff
• Grow undergraduate and graduate admission applications
• Showcase examples of innovation, creativity, research, and
scholarship
• Enhance alumni pride, engagement, and connection to the
university
• Grow fundraising
• Grow sponsored research
5
Web The Basics
RIT Web Development Related Contacts
RIT Production Services
University Publications (UPub)
RIT Production Services is responsible for much
of the website and multimedia creation across
campus. From photography to video and
captioning, it is the largest and most active Web
design and development department at RIT.
UPub is the keeper of the RIT graphic identity.
Besides the RIT Identity Manual, the RIT Grammar
and Style Guide, and numerous other RIT
publications, it also creates and maintains
many university websites.
RIT Production Services
http://www.rit.edu/etc/web
University Publications
http://www.rit.edu/upub
Raman Bhalla
Assistant Director, Web/IT Services
e-mail: [email protected]
phone: 585-475-2555
Ellen Shady
Director
e-mail: [email protected]
phone: 585-475-4957
Information & Technology Services (ITS)
ITS is charged with maintaining RIT’s Web servers
and creating Web accounts. If your department/
office doesn’t already have a Web presence, you
must first contact ITS to create your Web account.
Decisions about site URLs are determined by
conventions created by ITS. It is also possible
to receive redirects where appropriate. See the
“Hosting Your Site” section of this document
for more information.
Computer account request form
http://www.rit.edu/accounts
ITS Helpdesk
475-4357 (voice) or 475-2810 (tty)
Jared Lyon
Senior Web Developer
e-mail: [email protected]
phone: 585-475-5031
RIT Web Advisory Committee (RWAC)
RWAC is a group created to help guide
RIT’s overall Web presence. Members of
the committee represent a cross section
of RIT’s various divisions. The committee
is co-chaired by the division of Enrollment
Management and Career Services (EMCS)
and Information Technology Services (ITS).
Contacts for Assistance
Several areas currently work collaboratively to support
RIT’s Web presence. Primary areas are University
Publications, RIT Production Services, and Information
and Technology Services (ITS). The Web Advisory
Committee is a campus-wide Web committee charged
with guiding RIT’s overall Web presence.
For resolution of any questions, conflicts, or concerns
about RIT’s Web presence, you may contact one of the
co-chairs of the Web Advisory Committee:
• Dan Shelley, Assistant Vice President and
Director of Undergraduate Admissions,
585-475-6736 or [email protected]
Dan Shelley
Assistant Vice President and Director
of Undergraduate Admissions, EMCS
e-mail: [email protected]
phone: 585-475-7298
6
Web The Basics
Before You Start
Before creating or updating any website, it is important to
define the following elements: website goal, audience,
major tasks, content, and structure/hierarchy.
Determining these areas is vital to the success of any
website. Spending more time with advance planning will
make the implementation of your site much easier and
more efficient. As a general guideline, 80 percent of the
work related to a website is done upfront, and 20 percent
of the work goes into actual implementation of the site.
When updating a site, keep in mind that it’s usually best
to make small improvements to your site rather than
drastic changes all at once.
Before creating or updating an RIT website, it is also
important that you plan your site to conform to RIT
identity standards and legal requirements. Sources
of technical assistance are provided in Contacts for
Assistance.
7
Web The Basics
The RIT Identity on the Web
Official RIT logo. The logo can be found at www.rit.edu/upub/approved-rit-logos in multiple formats.
Official Logo Graphics
The only RIT logo graphic required for campus-wide use is the RIT
logo. When used on the Web, it is required to be at least 90 pixels
wide and a single, solid color. The logo can be found at http://
www.rit.edu/upub/logos.html in multiple formats, including
EPS, JPG, and GIF. Other approved logos, including those related
to RIT Athletics, require approval from the specific controlling
department.
Note: The RIT identity bar, discussed in The RIT Identity Bar
and Other Required Components, has been created to address
the RIT logo requirement. It should be used on all administrative
and academic sites.
8
Web The Basics
Sans serif font family: Helvetica
Sans serif font family: Arial
Typography and Fonts
Unlike in print, font selection on the Web can be limited to the
fonts available on each viewer’s computer. Because of this, it’s
best to create Web pages using the most common fonts. Also,
because the specified font may be unavailable, developers must
provide a font degradation path. Here are some recommended
examples, in stylesheet format:
font family: Helvetica, Arial, sans serif
font family: Georgia, Times New Roman, Times, serif
Serif font family: Georgia
Serif font family: Times New Roman
Serif font family: Times
9
Web The Basics
Colors
The official RIT colors, orange and brown, are the primary
colors for use on all RIT marketing. Consistent use of our
colors is key to maintaining a unified brand image and
identity. When used on the Web, a hexadecimal value is
used to represent these colors.
RIT Orange
Hex #F36E21
RIT Orange
Hex #F36E21
RIT Brown
Hex #513127
RIT Brown
Hex #513127
The official RIT colors
Black
Hex #000000
Dark Gray
Hex #666666
Light Gray
Hex #BBBBBB
Dark Cream
Hex #DFDECB
Light Cream
Hex #F8F7ED
Dark Red
Hex #660000
Light Red
Hex #87080E
Secondary Web Colors
A secondary palette is intended for Web use only and
provides complementary options that you may choose to
use with the official colors. Although developers are free
to use other colors on RIT websites, the colors listed here
have been chosen because they complement RIT’s official
colors.
Black
Hex #000000
Dark Gray
Hex 666666
Light Gray
Hex #BBBBBB
Dark Cream
Hex #DFDECB
Light Cream
Hex #F8F7ED
Dark Red
Hex #660000
Light Red
Hex #87080E
Secondary palette of RIT colors for the Web
10
Web The Basics
The RIT Identity Bar and Other Required Components
The RIT Identity Bar
The RIT identity bar should be placed at the top of every official
RIT website hosted on the main rit.edu Web server (personal Web
pages excluded). University Publications must approve any other
graphics or text that developers would like added to the bar. The
default is to have the RIT search box. If the site has its own search
tool, developers should, to avoid confusion, use a link to the
main RIT search page instead of using the RIT search box.
The identity bar is 51 pixels high; it should always appear as
such. It must include:
•a solid-color RIT logo at a minimum of 90 pixels wide
that links to the RIT homepage.
•“Rochester Institute of Technology” spelled out beside
the logo.
•links to the RIT directories and RIT search or search box.
The color options provided for the identity bar to the left
are the only acceptable colors.
Acceptable colors for the RIT identity bar
#F36E21 (orange)
#513127 (brown)
#000000 (black)
#666666 (dark gray)
#BBBBBB (light gray)
11
Web The Basics
Two examples of a standard footer created to complement the RIT identity bar
Footer Components
A footer should be placed at the bottom of all official
websites (personal Web pages excluded). This footer
should include a copyright statement, links to the
RIT homepage, terms of use (which includes links to
the disclaimer and privacy policy), nondiscrimination
statement, and copyright infringement information.
Any additional footer text and links may be added per
site as needed, and background color is flexible.
“Favicon”
A favicon (short for favorites icon)—also known as a
website icon, shortcut icon, url icon, or bookmark icon—
is a 16x16-pixel icon associated with a particular website
or Web page.
To ensure RIT has a consistent look and feel, it is
recommended every website use the standard RIT favicon.
The RIT favicon
12
Web The Basics
College of Science
College Home
About the College
Academic Programs
Cooperative Education
Facilities
Advising/Student Services
Student Life
Research/Study Abroad
Alumni Services
News & Events
Departments & Contacts
Admission & Financial Aid
College of Engineering
College Home
About the College
Undergraduate Programs
Graduate Programs
Cooperative Education
Facilities
Advising/Student Services
Success Stories
Student Life
Research/Partnerships
Alumni Services
News & Events
Departments & Contacts
Admissions & Financial Aid
College of Applied
Science and Technology
College Home
About the College
Undergraduate Programs
Graduate Programs
Online Programs
Global Focus
Partnering with Industry
Giving
Alumni
Scholarship
Faculty Resources
Facilities
News & Events
Other RIT Resources
Samples of navigation from several of the colleges at RIT
Navigation
While navigation from division to division, college to
college, or department to department will differ, the
elements in common are often much greater than the
differences. Each website often serves more than one
constituency, making the development of a standardized
set of navigation links difficult to achieve. With this in
mind, the RIT Web Standards and Identity Guidelines
considers the following to be important:
Guidelines and Considerations
1. Generally, main navigation should be kept to a
minimum number of items that fit in the top 720 pixels
of the page.
2. Navigation should reinforce university goals and
priorities.
3. Navigation link nomenclature should be similar to other
RIT sites and to other universities, which adds a level of
familiarity and speeds visitor information search.
To the left are samples of navigation from the colleges
of Science, Engineering, and Applied Science and
Technology. Note the consistency from site to site. Clarity
and simplicity work to ensure it is easily understood. Due
to the ever-changing nature of the Web, the navigations
to the left may now appear differently on the sites.
13
Web The Basics
The Office of University Publications
http://www.rit.edu/upub/archive
The Office of University Publications produces
most of the official print publications for RIT,
including the prospectus, college viewbooks,
bulletins and RIT Alumni Magazine. Text, as
well as most images, may be reused from these
publications.
University News Services
http://www.rit.edu/news/
University News Services constantly creates
news content related to various units on
campus. News feeds are available by individual
college, division, category, and specific content
type to automatically display on your site.
RIT Production Services
http://www.rit.edu/etc
RIT Production Services produces many official
videos and websites across campus. It also is a
repository of RIT photography available for use.
Sources for Existing Content
RIT Web developers are encouraged to make use of
already existing RIT branded text, photography, and video
content: it is simple, reduces development costs, and
aligns with RIT’s branding messages. The writing, media,
and design of these existing assets has been reviewed
and approved by many people who are knowledgeable
about RIT’s brand message and look. The three
departments listed below are major sources of
existing RIT branded assets.
The Office of University Publications collaborates with
all RIT colleges and many divisions and departments
across campus on the design and development of RIT’s
official publications. It, along with RIT Production Services,
contracts with many colleges, divisions, and departments
in the design and development of official RIT websites.
University News Services (UNS) provides ongoing news
content and photography for RIT’s official websites.
Sources for existing content
14
Web The Basics
Social Media Guidelines
RIT understands that social media is critical to
communicating with and connecting to its various
stakeholders. Social media should be used to disseminate
important news and information, listen to feedback, and
answer questions from our community as well as the
general public. Social amplification helps tell the RIT story.
RIT’s Social Media Task Force has developed these
guidelines to properly portray, promote, and protect the
reputation of the university. The guidelines have been
created to help develop strategies for RIT social media,
as well as create campus-wide partnerships among those
who oversee each social media presence. Following these
guidelines will help ensure consistent messaging and
branding, and offer assistance on how to monitor and
maintain engagement with social media.
15
Implementation
Web Advanced Topics
Advanced Topics
Identity Requirements
The university’s minimum Web standards require:
• The RIT identity bar (discussed in the previous section),
which includes:
oA solid-color RIT logo at a minimum of 90 pixels
wide that links to the RIT homepage
o“Rochester Institute of Technology” spelled out
beside the logo
oLinks to the RIT directories and RIT search or search
box
• Standard footer components
oCopyright statement
oLinks to RIT homepage, terms of use (includes
disclaimer and privacy policy), copyright
infringement information
• The university favicon
Information on how to implement these requirements
can be found at http://www.rit.edu/framework/.
16
Declare a DOCTYPE
Every Web page developers create should
have a DOCTYPE specified. This helps
reduce display irregularities across
different browsers and operating systems.
It is recommended that developers’
DOCTYPE be HTML 4.0 and
above or XHTML 1.0 and above.
Separate Content from Design
Global design information for developers’
sites should be put in a separate CSS style
file. If developers require, that information
should be placed in the <head> of the
specific page. This improves code
efficiency, site maintenance, accessibility,
device compatibility, and search engine
visibility.
Further reading: Why Web standards?
http://dev.opera.com/articles/view/1introduction-to-the-web-standardscur/#webstandards
Provide Text Equivalents for all
Important Graphic Elements
All images and image map regions should
have their “alt” attribute set for accessibility
reasons. Decorative images that do not
convey important information should be
built into the CSS, rather than the HTML. If
this is not possible, include an empty alt
attribute (alt="") rather than leaving it out
entirely.
Caption all Video and Flash Present­
ations on Public-facing Websites
Important information can be conveyed in
the audio of video and Flash presentations.
All videos posted on an RIT website must
be captioned or provide equivalent
information. Captioning services are
available on and off the RIT campus for
most forms of media. Please reference the
audio/video section of this document.
Further reading: Captioning information,
available from PEPNet-Northeast http://
www.netac.rit.edu/publication/tipsheet/
captioning.html
bad practice, and has a detrimental effect
on accessibility. Also, one should use the
<th> tag to define headers and use the
<summary> tag to provide a summary of
the table.
Transcribe/Describe all Audio Elements
on Public-facing Websites
Similar to video, all audio must be
accompanied by a text transcript or a
descriptive equivalent conveying the same
information.
Ensure that all Information is Easy
to Read, Even for Those with Mild
or Moderate Vision Problems
Low-contrast color schemes should be
avoided (example: light blue text on a
slightly darker blue background). Avoid
using very small font sizes. Never use
bitmapped/graphic text when real text
(which the user can resize) could be used.
Use Descriptive Links
Linked text should always describe the
content it links to. Never create a link that
says only “click here.” Some accessibility
programs for the blind will read all linked
text on the page, and hearing “click here”
will not tell the user what the link means.
Furthermore, some users of developers’
sites may not even be clicking. For
example, instead of “Click here for more
information about our faculty,” a better
wording might be, “Developers can find
more information about our faculty on the
College of Business website.”
Use Label, Fieldset, and Legend to
Improve Form Accessibility
The label tag should be used to associate
all inputs with their respective descriptions,
and the fieldset and legend tags should be
used to separate sections of long forms.
Use Tables Appropriately
Tables should be used only for their
intended purpose: to display tabular data
(such as information from a spreadsheet).
Using tables for design or layout purposes is
Avoid Using Frames
Frames can cause a number of problems
for users with disabilities, especially those
using screen readers for the blind. If you must
use frames, be sure to include a descriptive
title attribute for each frame, as well as a
longdesc attribute that provides a more
detailed description of each frame’s contents.
Web Advanced Topics
Coding and Accessibility Guidelines
Given the Web’s increasingly important
role in society, it has become essential for
website owners to ensure the information
they post on the Web is accessible to
as broad an audience as possible. RIT is
committed to making all of its websites
accessible to people with disabilities,
including visual, aural, motor, and
cognitive challenges. In addition, it is
important that RIT websites be accessible
to the rapidly growing number of people
who access the Web via mobile devices
such as cellular phones.
Do Not Use Color Alone to
Convey Important Information
People who are colorblind, for example,
will be unable to use a form where required
fields are indicated only by red text.
Instead, indicate the required field with an
asterisk (*), which could also be the color
red to further aid non-colorblind people.
Don’t Forget Mobile Devices
It is almost impossible to build an effective
website that works perfectly on every mobile
platform. The screen size, connection speed,
browser software, and compatibility with
technologies such as Flash and Javascript
vary greatly from device to device.
However, if all of the previously mentioned
accessibility methods are followed, your
website is likely to be reasonably accessible
on most mobile devices.
Further reading: Implementing style
sheets targeted at mobile browsers http://
www.alistapart.com/articles/return-of-themobile-stylesheet
17
Validate Your Pages
Every page you create should be validated
to ensure it contains standards-compliant
code. Along with DOCTYPE, this helps
reduce display irregularities across
different browsers and operating systems.
The most popular and easiest to use HTML
validation service is hosted by the W3C, the
international organization that creates Web
standards. In addition to HTML, you should
also validate your CSS.
Further reading: W3C Markup Validator
http://validator.w3.org/ (for HTML), W3C
CSS Validator http://jigsaw.w3.org/cssvalidator/ (for CSS)
Web Content Accessibility Guidelines
http://www.w3.org/TR/WCAG20/
Covers all of the best practices for Web
accessibility in detail. Published by the
W3C, the main international organization
that develops standards for the Web.
How People with Disabilities Use the Web
http://www.w3.org/WAI/intro/people-useweb/ Provides examples of ways that
people with various disabilities use the
Web and the difficulties they commonly
encounter online.
Web Advanced Topics
Also note, Adobe Device Central
emulates a large number of mobile
devices. It is included with newer versions
of the Adobe Creative Suite.
Mobile Web Best Practices
http://www.w3.org/TR/mobile-bp/
The W3C’s comprehensive guide to
building websites that are accessible
on mobile devices.
Perform Browser Testing
Not all Web browsers display sites the same
way, so your site could look great on one
browser or operating system and incorrect
on another. Using proper coding and
validation helps reduce irregularities;
however, it is strongly recommended that
you test your site on some of the most
popular browsers and operating systems.
Further reading: 13 Essential Tools to
Check Cross-Browser Compatibility
http://mashable.com/2014/02/26/browsertesting-tools/
Further notes on accessibility
Campus Web developers are encouraged
to read and consider the following
resources:
18
The RIT Web Template System
The RIT Web template system allows users
to rapidly create a website on RIT’s main
Web environment (www.rit.edu) while also
maintaining consistency and continuity
across all official RIT sites. The system
conforms to RIT’s standards and guidelines
for identity, code, and design.
The website images at left show the
efficiency of creating a site in the template
system, as well as the diversity allowed.
Each of the sites uses the same HTML code
structure but with different CSS applied.
This provides each site its own identity
while keeping the overarching
RIT identity.
The RIT Web template system may not be
used on personal Web pages or university
sites hosted by external commercial
entities.
A more in-depth walkthrough of the
RIT Web template system can be found on
the template system’s website http://www.
rit.edu/template/.
Hosting Your Site
Pros and cons of hosting your site on RIT’s
main Web server
A sampling of sites using the RIT Web
template system
Pros:
• site can be found via RIT search from
any other website on rit.edu
• security updates and scans are
performed for you
• only sites hosted at RIT can have the RIT
identity bar
• no maintenance, hosting, or domain
name fees
Cons:
• custom configurations (ASP,
ColdFusion) may be limited
• custom domain names must redirect to
your rit.edu url
• turnkey solutions, such as having your
site powered by another site, may not
be possible
Security
Third-party Applications
It’s the responsibility of the site owner to
ensure installed third-party applications
and related modules are updated and
patched. Applications that are not updated
are often vulnerable to security problems.
Form Validation
All input received via form needs to be
validated to ensure the integrity of the
data. Do not rely on client-side validation
such as JavaScript. JavaScript can be
turned off by the client, which will override
your validation rules. Server-side validation
should be used to ensure data is input as
expected. Some parameters that should be
considered include:
•Length of input
•Data types of input
•SQL injections
•Cross-site scripting
For details on what information can and
cannot be requested in forms, and other
privacy-related issues, refer to Privacy.
Databases
When using databases for your website,
static queries should be used, if possible.
Otherwise, use prepared statements for
dynamic queries. Stored procedures
and views should also be considered.
Connection strings should never
include embedded usernames and
passwords. Use Config Vars available
through the Webman application to
manage your credentials. For more
information about Config Vars, please
visit the Webman Guide.
Databases should never contain sensitive
data such as Social Security numbers.
Please contact ITS if your application needs
to store sensitive information.
SSL
Any application or website that requires a
user to log in needs to use SSL. The official
RIT Web hosting environment supports
an SSL certificate enabling users to send
credentials over https. When .htaccess
files are used for authentication, the
SSLRequireSSL directive should be set.
Web Advanced Topics
Website Monitoring
Although no formal monitoring policy is in
place, RIT websites are subject to periodic
informal monitoring. If necessary, action
will be taken to assist out-of-compliance
site owners and developers
in bringing their site into compliance.
It’s worth noting that even if you have
not been contacted, it’s possible that
your site is not in compliance.
Authentication
(Login-restricted Websites)
Websites or applications should use
.htaccess for authentication whenever
possible. Avoid developing your own
authentication. Consult the Webman Guide
https://webman.rit.edu/guide/ for more
information on the use of .htaccess files for
authentication and authorization.
PHP
When developing PHP applications,
consider the following:
• Errors should never be displayed in
production
• When developing applications in
the staging environment, consider
password-protecting your site
• Leave register_globals set to “off”
• Dynamic HTML content should be
encoded using htmlentities()
• Phpinfo() should never be visible on
any public-facing site
• Leave the directive allow_url_fopen set
to “off”
• Test your PHP applications after
upgrades are performed
•File system permissions should be
set appropriately. On the official Web
hosting environment, 770 is sufficient.
Directories/Folders
Directories should not be browsable. A
19
Audio/Video and Photography
Audio, Video, and Streaming Media
Standards
Ultimately, the audio, video, and streaming
media standards must be dictated by the
playback requirements of the given media.
•There are two ways to deliver media over
the Internet: streaming and progressive
download.
o Streaming—provides the media in
many small portions from a streaming
server to the viewer. One benefit is the
ability to scrub through media. It also
provides security if the viewer should
not be able to save a copy of the media.
Requires a special “streaming server.”
o Progressive Download—transfers
the media to the viewer and stores it
temporarily in cache. One benefit is
the viewers’ ability to download the
media to their computers. No special
server required; any server capable
of displaying Web pages can offer
progressive download.
•Consider your audience and their
capabilities:
o Internet speeds will affect what
quality can be acceptably transmitted
to viewers.
o Software on viewer’s computer will
determine acceptable media formats.
Formats
There are many formats available for Web
media; this consideration is based on
viewer’s software and encoding qualities:
•Flash (FLV) Format—generally
recommended for Web media that
features video. Has good compression
quality, especially when combined with
the H.264 codec. Platform independent
since video is typically played in the
Web browser. Quickly becoming widely
accepted in Web media due to wide
accessibility and a nearly complete
feature set.
•Windows Media Format—acceptable
quality, best for viewers on Windows
computers. Uses latest Windows Media
codecs.
•QuickTime Format—wide range of
quality, very good with the H.264 codec.
Best for viewers on Mac OS computers.
•Real Media Format—good quality with
latest codec. Nominal native support;
third-party media player download
required.
•Other formats include mp4, SilverLight,
and others. These are not generally
recommended.
Quality and Bitrates
Quality of media is directly related to the
bitrates the media is encoded at.
•Bitrate is typically measured in kilobits
per second (kbps) and while one is
specified as a whole, the video and audio
are actually encoded at separate bitrates.
•Encoding can also typically be done using
two schemes: constant bitrate (CBR) or
variable bitrate (VBR). CBR tries to keep
the track at exactly the specified bitrate
while VBR allows the encoder to use less
than the specified bitrate if the media
doesn’t require as much.
•You can also typically specify how many
passes over the media the encoder will do.
More passes means better processing, but
increases the time it takes to encode the
media.
•It is recommended that 2-pass VBR is used
when possible.
different aspect ratios for the frame size.
The 4:3 aspect ratio is for standard media.
16:9 aspect ratio is for widescreen media.
•Web assets are not specifically included in
the 4:3 and 16:9 standards, but following
those guidelines is recommended.
Frame Rate
Media containing video will also have a
frame rate that determines how many
frames are stored and displayed per
second. Too low a frame rate will make
video look jittery. If your video contains a
lot of fast motion, it is recommended you
increase your frame rate.
Web Advanced Topics
browsable directory is one where a default
Web page doesn’t exist. As a result, all the
files in that directory are listed. To stop a
directory from being browsable, simply
add an empty index.html file.
Interlaced/Progressive
Media played on a television will be
interlaced, while media played on a
computer will be progressive.
•When bringing television media to the
computer, remember to de-interlace the
media. Not de-interlacing will result in
many visible lines over the media during
playback on the computer.
Resolution (frame size)
This is another factor that determines
quality of media containing video.
Generally, the lower the bitrate for
the video, the less resolution will be
acceptable.
•Media is normally specified in two
20
4:3 Aspect
Ratio
16:9 Aspect
Ratio
Max Video
Bitrate
Max Audio
Bitrate
Frame
Rate
56kbps
260x195
Not
Recommended
40kbps
16kbps
15fps
256kbps
320x240
213x120
192kbps
64kbps
15fps
384kbps
400x300
390x220
320kbps
64kbps
15fps
512kbps
520x390
568x320
448kbps
64kbps
24fps
768kbps
640x480
730x410
640kbps
128kbps
24fps
1280kbps
800x600
920x518
1152kbps
128kbps
24fps
Table of suggested media settings designed for 2-pass VBR of Web media that contains both
video and audio
Photography
• Typical file formats include JPEG
(60% quality or better), PNG, and GIF.
• Dots per inch (DPI) should be 72 or above.
• Source image files or high-resolution files
should be provided when sending
to others for work.
• A quality guideline would be to ensure
that no “pixelation” occurs in an image
when it is viewed on screen.
Web Advanced Topics
Media
Bitrates
Audio
Media containing audio will have some
additional considerations:
•Ensure audio and video are synchronized.
•Ensure the audio is normalized and is at a
volume level acceptable for listening on
normal speakers.
•Bitrate affects audio, too. See the
Quality and Bitrates explanation above
for recommendations. If your media
contains only audio, you can use the
entire bandwidth available, but it is not
recommended to go above 192kbps.
Most modern codecs treat 192kbps as
near high fidelity/CD quality audio.
•Audio codec is often determined
automatically when video is also
part of the media. For times when
media includes only audio, you will
have to specify the codec to use. The
recommended codecs are MPEG 4
Audio Layer (.m4a), MPEG 3 (.mp3),
Advanced Audio Coding (.aac), and Audio
Interchange File (.aif ).
• RIT’s standard for video that goes online
is Flash Video encoded at 384kbps (video
at 320kbps and audio at 64kbps) with
400x300 resolution size and 15 frames per
second. This provides acceptable qualityto-performance and should be accessible
by the majority of users connecting to the
Internet.
• RIT’s standard for video that remains
internal to RIT or other fast intranets is
Flash Video encoded at 768kbps (video
at 640kbps and audio at 128kbps) with
640x480 resolution size and 24 frames
per second. This provides excellent
quality but requires high bandwidth
and processing power on the viewer’s
computer.
iTunes and YouTube
iTunes and YouTube have specific encoding
requirements to maximize the quality of
playback. Both will take virtually any kind
of video submitted, but their “on-thefly” encoders can yield very poor results,
depending on the original video.
In general, video for these outlets should
be created to their specifications to
minimize and/or eliminate on-the-fly
conversion and/or re-compression.
• iTunes has very specific requirements
for best compatibility. When using
Quicktime, Final Cut Pro, or Compressor,
user-modifiable options are prohibited
when exporting to iPod, iPhone, or
AppleTV formats. This ensures that files
made for Apple devices and iTunes are
optimized.
• YouTube lists general size and encoding
requirements at its website:
http://support.google.com/youtube/
topic/16547
There are other factors such as frame
rate, bit rate, and specific codecs that can
influence the quality of the uploaded
video. YouTube does support captioning in
the Subrip Format (.srt).
21
Captioning Resources
On Campus
Federal Communications
Commission (FCC)
http://www.fcc.org/encyclopedia/closedcaptioning-video-programming-television
Captioning Resources
Off Campus
The WGBH National Center for
Accessible Media (NCAM)
This is a highly recommended site if
you want to caption your own media.
(Information on Accessible Digital Media—
Check Guideline H for video on the Web.)
http://ncam.wgbh.org/invent_build/web_
multimedia/accessible-digital-media-guide
PEPNet
http://www.pepnet.org/resources/
tipcaptioning
The Wallace Center
Captioning for RIT Purchased Media
Romea Montanaro
475-2015
http://www.rit.edu/etc/video
Captioning for Credit Courses
Ian Webber 475-5084
http://wallacecenter.rit.edu/content/
course_media.php
Web Advanced Topics
Captioning
Captioning Guidelines and Standards
Captioning for Web-based assets can
be placed in several areas. Captioning
placement can be in the picture area
or below the picture area with various
applications. Captioning placed in the
picture area is often very difficult to read
and has the potential of covering up useful
or critical information.
There are numerous delivery methods
for Web-based video content. Each method
requires a different process to caption the
media. Your video could be a progressive
download file or a streaming media file. If
you use one of the Captioning Resources
Services listed below, your video will meet
or exceed the standards and guidelines
dictated by the FCC and by such organizations
as the National Center for Accessible
Media, PEPNet-Northeast, the National
Captioning Institute, and WGBH Boston.
Please reference the following websites
for information on captioning guidelines,
accessible digital media, and standards:
NTID Technical Services
Paula Hellaby
475-4369
[email protected]
ETC Production Services
at The Wallace Center
(Captioning for Non-Course-Related Media)
Claudia Stata 475-5121
http://www.rit.edu/etc/captioning
Media Access Group at WGBH-Boston
http://main.wgbh.org/wgbh/pages/mag/
National Captioning Institute
http://www.ncicap.org/services.
html?captioning
Automated Sync Technologies
Provides transcription and text-audio
synchronization services.
http://www.automaticsync.com/
captionsync/
National Captioning Institute
http://www.ncicap.org/
WGBH Boston
http://main.wgbh.org/wgbh/pages/mag/
services/captioning/faq/
22
Web Advanced Topics
Legalities
Outlined here are brief summaries of common issues related
to ownership and permissions for content use on the Web. If
you cannot make a reasonable determination of ownership
and the rights to use a content asset after reasonable
inquiries with the content creators and collaborators, you
may contact the RIT Office of Legal Affairs at 475-2426 for
more information.
Intellectual Property
RIT’s Intellectual Property Policy (C3.0) was adopted
to protect the rights of intellectual property creators
and should be reviewed by all content creators prior
to developing a website.
http://www.rit.edu/academicaffairs/Manual/sectionC/
C3.html
23
Copyright
Prior to the use of any copyrightable or
copyrighted works, you should always
first check to make sure that the work is
in fact subject to copyright protection.
RIT is developing a copyright policy that
is consistent with its intellectual property
policy. Next, the RIT personnel or student
should inquire whether permission
authorizing the use of the work has already
been obtained by RIT from the copyright
owner. If not, permission for use in the
website may be sought. Permission may
be authorized pursuant to the Fair Use
Doctrine, or under the Teach Act for certain
Distance Learning applications. A good
starting point for answers to copyright
and fair use questions can be found at
http://library.rit.edu/student-guidecopyright.html. If you are not sure about
interpretation of the copyright law to your
proposed website application, please
contact the RIT Office of Legal Affairs.
Student-Model Photo Release
A model release form must be signed by
anyone whose photo is to be published
in any media, granting permission to
publish that photo. This encompasses
all media, including digital, electronic,
print, television, film, and the like. News
articles do not require a model release.
http://www.rit.edu/academicaffairs/etc/
RIT_Model_Release.pdf
Web Advanced Topics
Privacy
RIT’s Privacy Policy was adopted to clarify
the legitimate expectations of privacy by
those individuals who are present at RIT
facilities or at official RIT events, or who
use RIT electronic resources. Please read
RIT’s privacy policy before you develop
content for your website.
http://www.rit.edu/privacy/
Laws on Accessibility
Title I of the Americans with Disabilities Act
of 1990 prohibits RIT from discriminating
against qualified individuals with
disabilities in job application procedures,
hiring, firing, advancement, compensation,
job training, and other terms, conditions,
and privileges of employment.
Section 508 requires federal agencies
to make their electronic and information
technology accessible to people with
disabilities.
See more information on best practices
and implementation of accessible websites
in Coding and Accessibility Guidelines.
24