On Pictures, Webmail, Scrolling and Why the Redesign Looks the Way it Does

Christian Knoebel

The first reaction visitors have to the new princeton.edu is how different it looks. Pages on the new site are filled with lots of big, bold images and the pages themselves are deep and airy. The old site is very much the opposite of that: content is a densely packed mix of text and links. Here's a comment we received that sums up changes to the home page:

"The new version provides far fewer links and displays merely one news story picture that takes up almost the whole screen! One has to scroll way down to reach everything else."

In interpreting the changes, you might think we’re turning our gaze away from the university and to the wider world. Consider this comment:

"[The redesigned site] comes off as one giant viewbook ad."


"This will make the homepage much less convenient."

Why did we make such fundamental changes?

Let's look at what we didn't do. We didn't redesign the site by putting a bunch of people in a room, closing the door and guessing what our users needed. Instead, in the spirit of collaboration and inclusion, we asked them.

First we asked, "Who uses our site and what are they doing on it?" We turned to analytics for the answers. It ends up that 80% of our page views in 2016 were from off-campus visitors. To find out what they are doing, we created a site survey that asked visitors to self-identify their audience group. Through analytics we tracked each group for the pages they actually use.

Next we spoke with actual users from the most active groups to find out how the site could help them better. We learned that to serve our actual visitors the site has to do more to help people not affiliated with Princeton learn about the university.

We also learned that our next design has to look more like the sites we all use. Like it or not, we are conditioned by Amazon, Facebook, Uber, Google and the many other sites we use every day. They set our expectations on how a site should perform, look and feel. They also influence how we perceive other sites on the Internet.

Consider diversity, a key value for Princeton. If you work or study here, you know Princeton to be a diverse place and the influence diversity has on what we do. On the old site, could you tell we are diverse? Does this page really tell the story? How do you validate its message?

Telling with a wall of text written in an institutional style or simply listing links aren't helpful. Showing is the better way, and today showing through images and video is how stories are told online. For the prospective student or prospective employee, seeing with their own eyes helps them know if they'll fit in.

Not everyone who uses princeton.edu is from outside the university. For employees and students we put the most-used links to Princeton sites onto one page. Look for it in the header under "Links for ..." (there's one page for faculty and staff, another for students). This menu item replaces the Shortcuts drop-down on the old site and each page has a link to web mail. Can't find what you want there? Our new search knows where it is.

One final thing about scrolling: How do we know people will scroll?

On the old site users were scrolling to read news pages. We know from our own experience that few websites can be read without scrolling. Studies over the last 20 or so years have found without question that people scroll. Of course if you are reading this blog post on a mobile device, you know how useful your thumb is to navigate the Web. (As I write this on a N.J. Transit train, I see people around me scrolling on their phones.) Scrolling is what we do.

Recent items

PDF on the Web: Best Practices

How We Used a Meta Tag Strategy and Drupal to Look Our Best on Social Media

Where is Webmail?

An Appetizer of Cake and Broccoli

On Pictures, Webmail, Scrolling and Why the Redesign Looks the Way it Does

How Many People Does it Take to Build a Website?

What Happened to A-Z?

Public Beta Launches

Happy 30th Birthday, princeton.edu

"Done Is Fun"

Subscribe to Blog