Clean Catalog 2.0 — New Designs for Our Course Catalog Software

June 26, 2019

This is the first in a series of posts on the new features we’re rolling out with Clean Catalog 2.0.

With Clean Catalog 2.0, we’re rolling out a new base style for all of our student handbook and course catalog software. Of course, all of our front-end design and organization is fully customizable — we always use your college or university’s brand fonts and colors, and all front-end elements can be adjusted as needed.

That said, we’ve found that it’s best to start with a tested front-end design, and customize from there. We want our software to be easy to adopt, and part of that is minimizing the number of decisions that stakeholders have to make, while still allowing them to customize anything unique to their organization.

So with our updated designs — which you can see a sample of at Gadsden State Community College’s Catalog — we built a flexible, elegant design that maximizes readability and emphasizes your college or university’s branding.

Focus on Typography and Readability

Because catalogs are primarily text-based, our designs focus on typography to emphasize hierarchy and organization. We put a lot of thought into things like font size, letter spacing, and margins and padding around text; we want the document structure to be intuitive to anyone who views it.

For pages with large blocks of text — like policies, student handbook content, or anything that’s not a course or degree — narrowed the content body to an easy-to-digest line length that makes even long blocks of text readable. See here for an example. For courses, we divided up the text information and the smaller lines — like credits, program, etc. — into easy-to-scan blocks. See here for an example.

Emphasize the College or University’s Branding

Across the board, all of the colleges we work with have excellent brand packages, and we’re able to rely on those to make sites look distinctive and great. Using the college’s brand colors in the header, an accent color for links, and their primary brand font throughout, the site is clean and easy to read, but still conveys the college’s identity.

We also added a place for an alternate logo or seal in the footer, as another subtle way to emphasize the college’s brand, an easy-to-use link back to the homepage

Prioritize Accessibility

Meeting accessibility requirements — usually WCAG AA 2.0 — is a must for any digital product in higher education. Achieving high enough contrast is often one of the trickiest parts of web accessibility — often you can only use a few very specific combinations of brand colors for text and backgrounds. With that in mind, we built our designs to use the brand’s heartiest color as a background for any reversed-out text and one accent color, if possible with contrast. We think we came up with something that looks great, is readable, and meets strict accessibility requirements for contrast.

If you have any questions about how Clean Catalog can help you transition to a digital catalog solution, use the form below or email us at [email protected].


More Posts