Design Tips
The CMS templates make it easy to display and organize your content, so get creative!
Colors
Enjoy 8 colors.
Red
Grey
Dark Grey
Gold
Teal
Blue
Green
Dark Green
Repeat colors for important visual cues.
For example, a helpful links sidebar that appears across multiple pages could always be teal, or a grid containing statistics could always be gold.
Tips
- Your site will look better if you take our advice.
- That was our best tip.
Limit your color palette to improve user experience.
Use only one or two accent colors throughout your site. Visitors will familiarize themselves with your content and associate your color palette with your site. That's called brand recognition.
Links
Buttons & CTAs
Grids
Organize content with a grid.
- Use grids instead of bullet points. This is called irony.
- Distribute statistics or photos across a grid.
- Split a short story across columns.
Break vertical lines.
When stacking grids, alternate the number of columns to differentiate content. For example, if you have a 3-column grid below a 3-column grid, change one of them to a 2-column grid. This technique will create a visual stopping point for your readers by interrupting vertical lines between stacked grids.
Hero Images
Illusions
Use a photo that is white on top to give the illusion that the page header is floating in white space.
Macros
Show the fine details of tiny things by using macro photography.
Abstract
Show abstract art at large sizes for maximum impact.
People
Show real students, faculty and staff to express the humanity of the university.
Tables
Tables are meant to present data in columns and rows. If you'd like to present images or some other type of content in columns and rows, please use a grid. If you must use a table for layout, add role="presentation" to your table tag. This tells assistive devices that the table contains content that is not data.
Good
| CMU Milestone | Year |
|---|---|
| Andrew Carnegie emigrated from Scotland. | 1848 |
| Carnegie Tech merged with the Mellon Institute. | 1967 |
Bad
| A self-educated "working boy" who loved books, Andrew Carnegie emigrated from Scotland in 1848 and settled in Pittsburgh, Pa. |  |
| In 1967, Carnegie Tech merged with the Mellon Institute, a science research center founded by the Mellon family of Pittsburgh. |  |