User Experience Trends in College and University Websites

Over the last year or two, we’ve seen a lot of changes in website design. We’ve seen flash sites disappear, content become king, images that dominate the page and designs with mobile as a forethought instead of an afterthought. In higher education, we’ve seen some pretty big changes come our way as well. In this blog, I’ll touch on some of these trends, what they’re all about and whether you (or anyone, for that matter) should use them.

Big Images Are Even Bigger

Faster-than-ever internet speeds and expanding screen sizes have allowed for a huge increase in the size of images across the web. This trend is also found on many higher ed websites. As an example, let’s look at the University of Chicago’s website.

On the left, the feature image on Chicago’s website is approximately half the width of the page. On the redesigned website, the image spans the entire width of the page.

On some websites, images have gotten even larger. Oberlin College of Arts and Sciences has an image that takes up the width of the entire screen.

You might be asking yourself, “are big images a good idea?”.  The answer is a resounding “Yes!”. Here’s why we use them:

Big Images Reinforce a Sense of Place

Connecting with and converting prospective students especially undergraduates is as much about the experience of being at school as it is about the actual programs and academics. A great way to convey this experience is to create  a sense of place. Large, immersive photography helps create a better idea of what it is actually like to be on campus.

A Picture Tells a Thousand Words Which is Good, Because No One Actually Reads on the Web

People generally just don’t read much online, at least not without images to break up the content. Large images help ease users into content, break up the content into easy-to-digest chunks, and give the user a brief sense of the institution without needing to read. The best way to deter a prospective student from a website is to present them with a wall of text on the homepage.

Like any new trend, it’s important to understand how to use it effectively without diminishing usability. Here are a few tips we’ve picked up:

• A “skip to content” button allows users to know that there is content below the big image.
• Strong, on-brand photography is essential. Large images are usually the most dominant element on the page and the first thing the user notices. If an image doesn’t properly represent the institution, it can be very detrimental to the institution’s brand.
• Don’t forget accessibility. Keep in mind to follow accessibility guidelines with any dynamic sliders or moving images.

Content is King – A World of Brand Stories

As Google grows smarter by the day, a world once dominated by “black hat” SEO tricks is now home to real, honest-to-goodness content. Many colleges and universities are practicing the philosophy of “show, don’t tell” to reinforce their brand and differentiators. One trend that we’ve seen as a result of this shift is the use of brand stories. What we’re referring to are featured articles or news items that reflect the brand promise. Brand stories are an excellent vehicle to implement the “show, don’t tell” philosophy on a website.

Brand stories are a great tool to help reinforce an institution’s brand, but doing them well can be resource-intensive.

Do You Have the Content Resources Needed to Consistently Create Quality Content?

All too often, we see institutions implement a feature story section only to find that it becomes stagnant because of infrequent updates and out-of-date content. In order to strengthen the brand, make sure the content is always timely, relevant and relatable.

Quality Assets Are Necessary

If the featured stories are presented in a large image slider, engaging, high-quality assets are necessary. Before you commit to making large images a core part of your design, ask yourself if you have enough resources in place to make it happen. If the written content is available, but there are no quality assets, a different approach might be necessary that puts less emphasis on imagery.

Quick Note: Brand stories are select stories or articles that refer directly to the institution’s brand promise or differentiators, not generic recent news listings. We have started removing or greatly reducing the prominence of the recent news sections because we have found through user testing that users are rarely interested in it.

Dropdown Menus Are Growing Again

Five or six years ago, we saw the first mega menus. Well, the menus have gotten even bigger. Menus that span the width of the page and include not only links, but images, descriptions and promos are common now. There are many pros and cons to using these new mega (Mega!) dropdown menus:

Pros

• Users have quicker access to internal areas of the website.
• The addition of descriptions and images allow users to have a better idea of what’s included in the individual navigation items, especially if the nomenclature isn’t completely clear.
• The addition of promos and highlighted links within the promos allow for certain pieces of content such as events or initiatives to have a much stronger presence.
• The additional items in the dropdowns free up valuable space on the homepage.

Cons

• The large size of the dropdowns can be cumbersome for users.
• Dropdowns menus are difficult to use on touch devices like tablets and smart phones.

Responsive Design

Responsive design has become increasingly prevalent over the past few years, especially in the higher ed marketplace. In fact, we wrote an article on responsive design not too long ago.

Fancy and Trendy Minisites

Want even bigger videos and images, or maybe some fancy scrolling effects? Many higher eds have started to use minisites as vehicles for these things. Check out NC State’s Institutional Message minisite, which uses large imagery and video, as well as parallax scrolling.

Parallax scrolling refers to the effect where different elements of the page scroll at different speeds (or even directions sometimes), which can be used to create illusion of depth, change the pacing of the page, or highlight certain elements. The minisites are used to create a more customized experience, usually with the goal of being more immersive, telling the story more effectively or just to be plain cool.

On top of the examples above, we’ve seen parallax scrolling employed in situations like:

• Institutional messages and annual reports
• Why go here sites, usually linked to from admissions websites
• Undergraduate admissions sites
• Special Events such as commencement or homecoming

If used correctly, minisites are a great way to create an immersive and engaging experience for the users, which can be especially effective at engaging prospective students, or encouraging attendance at an event. Done incorrectly however, the mini sites can have a negative impact on website usability. If you’re planning on building a minisite in the near future, keep the following tips in mind to help make sure you get it right:

• Many of the special effects and large imagery may break from the standard interface users are used to working with on the main site. In case some users have trouble with the minisite, make sure necessary content such as important dates, policies, etc. should are easily accessible elsewhere.
• Keep mobile and tablet experiences in mind, especially regarding how scrolling works on those devices.
• Additional time and cost should be added for the custom development, content and design needs. If you’re on a tight budget, would a video or other medium bring you greater ROI?

Why All of This Matters

Understanding user experience trends for higher ed websites and how to use them is important. These trends help give insight into how people are using the web, and help shape how users understand and interact with your website. By keeping your nose to the ground for new and exciting ways to foster better user experience on your website, you’ll make connecting with your audience much easier.

We’ve covered many of the big trends we’ve seen, but there are plenty more. Drop a comment below or email us about trends you’ve seen. We’d love to hear from you.