There are two major configurations for the required branded header: full-width and demi.
Full-Width Header Guidelines
Click image for full size.
A: Utility Bar
This area serves as a location for links to frequently accessed campus services and resources, and social media channels. Default height: 45 pixels (px). Background color: White (#FFFFFF). Text and graphics colors: Dark gray (#545454).
Font Awesome Icons linked to your relevant social media accounts.
B: Branding Strip
This area serves as a location for the primary logo and tagline or site subtitle. Default height: 90px. Default color: light black (#262626) with no transparency, or RGBa black with 85 percent transparency.
Combined logos with a descriptor line in smaller text are not recommended for this application. Instead, crop out or otherwise remove the small text and use the site subtitle area to display the unit identifier or other qualifying text as needed.
The height of the Campanile element within the logo/brand mark is 60px.
Combined with a top and bottom padding of 15px, the total logo height is 90px, with a left and right padding of 20px.
In mobile views, the logo should maintain a proportional width and height, with the height of the Campanile shrinking to no smaller than 30px tall.
If using the GT Theme, the logo must be between 188px and 700px wide.
4. Site Subtitle (Optional)
The subtitle should be set in Buzz Gold (#eeb211), right justified, and vertically centered within the branding strip (which is 40 percent of the width).
By default, the text is set in Roboto Light at 20px.
When no site subtitle is required, use of this area for the Creating the Next tagline is recommended.
C: Primary Navigation
This area includes: the main menu, action links, and a site search form. Default height: 36px.
5. Main Menu
Set links in a light black (#262626) text on a Buzz Gold (#eeb211) background.
The hover state should be set in white text with a light black (#262626) background.
Dropdown links are acceptable and recommended for larger sites.
Third-level items, if used in the main menu, should have a lighter gold background (#FFE08B) and use light black (#262626) text.
6. Action Links (Optional)
Set links in uppercase and include a chevron icon.
Links should be light black (#262626) with a background color of light gray (#E6E6E6).
On hover, link color does not change.
In the mobile view, the background changes to white (#FFFFFF) and the text to dark gray (#545454).
It is recommended that no more than three action links be included.
7. Site Search
The link should be set in light gray with a dark gray background field and include a search icon.
The search link should trigger the reveal of an input field, and users should have the option to search the current site or the campus Google Appliance index (i.e., “All of Georgia Tech”).
D: Breadcrumb Area
Default height: 36px.
8. Breadcrumb Links
By default, the breadcrumb is set as a white (#FFFFFF) field with dark gray (#545454) links.
On hover, the link color does not change.
Include a chevron icon separator between the links.