Web Guidelines
Guidelines and procedures | Web color palette | Web logos | Web templates
- For more detailed information, including best practices, template samples, template change updates, content recommendations, and a Web development FAQ section, visit the Web Development Toolkit.
- To download university Web templates, go to the Web templates downloads section of the Web Development Toolkit.
Web guidelines and procedures
A great university website leaves a strong, positive first impression with website visitors, including current and prospective students, their parents, institutional partners, faculty, staff, or the many others seeking information from or about the university. For many, the website serves as their introduction to Virginia Tech, and Virginia Tech to them. It must communicate in a clear and consistent manner the university’s mission, vision, and outstanding characteristics. This is our goal for Virginia Tech’s Web presence.
The university’s website is an official publication of Virginia Tech. Our print publications utilize a consistent style–a “family” look and feel–and adhere to well-defined identity standards. Similarly, our websites need to use consistent “family” elements and adhere to similar kinds of guidelines for the Web. As the primary means by which the world learns about the university, the Virginia Tech website must reflect the university’s excellence in a consistent manner.
To meet this goal, University Relations has provided a catalog of Web templates and website elements for use by academic and administrative units. Samples of and information about using the templates and other elements can be found in the Web templates downloads section of the Web Development Toolkit.
University Relations also has established guidelines governing website design. These guidelines are based on industry best practices for navigation and usability and support Virginia Tech’s identity standards, which protect and project our unique brand.
Guidelines and procedures:
- University Relations has made available a catalog of family templates with multiple design options for use by academic and administrative units.
- We ask that primary administrative units use these templates to ensure a consistent user experience and to support the university’s brand.
-
Organizational units—colleges, vice presidents’ and vice provosts’ divisions, departments, institutes, and centers—that choose not to use these templates are asked to follow these design guidelines:
- On the organizational unit’s home page, the Virginia Tech logo, 160 pixels wide, should be placed in the upper left corner of the page. No other mark or logo may appear above or to the left of the Virginia Tech logo.
- On sub-level pages within their websites, units may move the Virginia Tech logo to the upper right corner within the header area and place their own logo or identity marker in the upper left corner of the page.
- Please use colors from the university’s Web color palette (see below) . Please note that maroon (hex #660000) is the university’s primary color, so please design your websites accordingly, to ensure consistency with family designs.
- The preferred locations for primary website navigation are either vertical in the left column or horizontal directly below the header. This will ensure consistency with family templates.
- The preferred page width is 758 pixels with a 3-pixel border for a total of 764 pixels, with the page centered in the browser window. (Please note that a print stylesheet will be required to resize a 758-pixel page to 650 pixels for printing in Internet Explorer.)
- The preferred font family for navigation and body text is Arial. The preferred font family for headers is Times New Roman.
- Commercial advertising is not permitted within the www.vt.edu domain or any of its sub-domains.
- All websites and Web pages attached to the vt.edu domain must adhere to the university’s Acceptable Use Guidelines.
Guidelines and procedures are subject to change as the university continues its Web development efforts. Please visit University Relations’ Web Development Toolkit for updated information.
Web color palette
The following web color palette has been created to help university Web developers design websites using the same color families as the www.vt.edu website. Web developers with questions about the use of color on their websites should contact webcomm@vt.edu.
Color usage and key
On the Web, as in print, the traditional university maroon should be used as a prominent design element enhanced by accents of the traditional university orange and the expanded palette of complementary or secondary colors listed here.
All Web colors are given in RGB (255,255,255) and hexadecimal (#ffffff) values. Designers looking for spot colors or CMYK colors for printed publications should refer to the About Our Colors page of this website.
Maroon
To be used as a prominent design element.
#660000 102,0,0
Orange
To be used as an accent.
#ff6600 255,102,0
Complementary / secondary colors
To be used as accents or backgrounds.
Blues
#93a7b3 147,167,179
#557082 85,112,130
#3c5b6f 60,91,111
#12252c 18,37,44
Reds
#980000 152,0,0
#7a0000 122,0,0
#5c0000 92,0,0
#4c0000 76,0,0
Greens
#9bb68f 152,182,143
#79946c 121,148,108
#516f43 81,111,67
#305020 48,80,32
Golds
#b47a1f 180,122,31
#a86107 168,97,7
#8c5206 140,82,6
#993300 153,51,0
Creams and Browns
#f5f5eb 245,245,235
#edeada 237,234,218
#dbd8bc 219,216,188
#9d9879 157,152,121
Grays
#c2c1ba 194,193,186
#646464 100,100,100
#404039 64,64,57
#333333 51,51,51
Web logos
The standard university logos have been resized and optimized for the Web. Several versions of Web logos available for download at www.unirel.vt.edu. All restrictions outlined in this manual for the standard logos apply to the Web logos, with the exception of size usage.
High-level pages within sites for colleges, departments, administrative offices, research centers, and outreach/Extension offices should include placement of an approved version of the university logo in the header* of the page. (This does not apply to personal student and personal faculty pages.)
With the introduction of this broadbased visual identity program, all previous logos are obsolete and should be replaced as Web pages are updated.
* The "unit headers" included as part of the university's Web Development Toolkit incorporate approved usage of the Web logo.
Web templates
University Relations has created templates for use by Web developers at the university. Templates and other website elements are available for download within the Web Development Toolkit.
Why use the templates?
Virginia Tech’s website templates give Web developers across the university an easy way to build pages that have the look and feel of the Virginia Tech homepage.
The university’s website templates also give developers a solid foundation for building websites that are Web-standards complaint, accessible to people with disabilities, and compliant with the university’s visual identity standards.
Who can use the templates?
The templates are intended for use by administrative, academic, and research offices of Virginia Tech. These templates may not be used by individual students, student organizations (with the exception of University Student Life Programs), or independent organizations without the approval of University Relations.
Best practices for the Web
As part of its Web Development Toolkit, University Relations maintains best practices and content recommendations for the Web. Some of the topics covered include:
|
|
|
These pages are updated often, so check the Web Development Toolkit for the latest information.
