Replacing ProximaNova-Light on Windows-based computers

Replacing ProximaNova-Light on Windows-based computers

ProximaNova-Light, which is used for primary page headings on the university homepage and UChicago Sites, unfortunately does not render very well on Windows-based computers.

To address this problem, we use a little bit of jQuery and CSS to replace ProximaNova-Light with ProximaNova-Regular for site visitors browsing on a Windows-based computer.

The jQuery

Using the following jQuery snippet, we detect the operating system of the visitor's computer and add that as a class to the page's <html> element ("Win32" for 32-bit systems and "Win64" for 64-bit systems).

<script>
  $("html").addClass( navigator.platform );
</script>

The CSS

In our stylesheet, we've written an override rule that sets the font-family for our main page headers to ProximaNova-Regular when the page's <html> element has a class of either "Win32" or "Win64".

Default

h2 {
  font-family: 'ProximaNova-Light', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

With the override rule

h2 {
  font-family: 'ProximaNova-Light', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

html.Win32 h2,
html.Win64 h2 {
  font-family: 'ProximaNova-Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

With these two pieces in place, our site visitors who use Windows-based computers will see our main page headings in ProximaNova-Regular rather than ProximaNova-Light.

Downloads

Instantly download the logo, shield, and other visual elements.

Identity Guidelines Book

Download the Identity Guidlines
Download the Identity Guidelines PDF.

Connect and collaborate with communicators across the University.

Join the Campus Communicators to share updates and announcements with University colleagues via listhost, Facebook, and at workshops and biannual gatherings.

Find an array of UChicago new media sites, as well as contact information for their owners, in the Social Media Directory.

Create targeted communications campaigns and digital platforms.

Work with UChicago Creative’s team of designers, writers, and producers to develop compelling materials and comprehensive multimedia campaigns.

Enlist University experts to build, design, and support your web applications by partnering with Web Services.

Discover resources to enhance your communications platforms and outreach.

Follow social media and multimedia from across the University at UChicago Social.

Collect and disseminate our latest stories with print-on-demand news.

Capture the images and ideas of the University community.

Enlist UChicago Creative to produce expert videography.

Book the TV studio for broadcast interviews.

Book the sound booth for remote radio interviews.

Align the look and language of your communications with those of the University.

Find best practices for the use of our logo, typeface, color palette, and editorial style within our visual identity.

Build and refine social media sites using our social media guide, and find web writing tips in Web Services’ multimedia content guidelines.

Order print materials created for your audience and customized for your office.

Present a uniform look with University of Chicago business cards and stationery for your department, office, or position.

Purchase maps, calendars, and brochures to welcome your guests and visitors to the University.