Web Style Guide Overview
The UHCL Web Style Guide is provided to help designers, developers, content creators and publishers employed by the University maintain consistency across academic and administrative department web pages. The guide includes a comprehensive list of visual and functional components and their use throughout the site.
Introduction
About the Visual Style
The design of the University of Houston-Clear Lake website is based on the brand guidelines established by the Office of University Communications. Open-source typefaces have been used in place of brand fonts for ease of use and improved on-screen rendering. Colors have been used in accordance with WCAG 2.0 AA accessibility guidelines.
UI Components and Patterns
The site contains common user interface (UI) components designed to help users find specific information easily. Navigation sets, buttons, and iconography all follow established patterns that will be familiar to or easily learned by key audiences.
Responsive Web Design
- Responsive web design makes the UHCL website look good and function properly at any size and regardless of device.
- The HTML is constructed such that a single set of HTML works across all devices and screen sizes.
- The HTML avoids duplicating elements for display at different breakpoints and avoids using JavaScript to adjust the display for different breakpoints.
- When possible, spacing units are defined as rem or em units; rather than defining pixel sizes, this allows the elements to scale appropriately.
Browser Compatibility
The HTML is built to be viewed on the following browsers/versions:
- Internet Explorer: IE9 through IE11
- Safari: latest (as of November 2015)
- Firefox: latest (as of November 2015)
- Chrome: latest (as of November 2015)
- Microsoft Edge: latest (as of November 2015)