University of Vermont

University Launches Device-Friendly

responsive snapshot--across three devices
A glimpse of the UVM homepage across several devices

Users might not realize that has drastically changed, that is unless they are looking on a tablet or mobile device where they'll see a more streamlined, easily navigable and appropriately-sized site (device-dependent). The Web Team launched a responsive on Jan. 7 after concluding that the higher ed web landscape was on a precipice.

"Institutions are increasingly aware that the public front door of their university -- their website homepage -- is being accessed from any number of devices now: smartphones, desktop computers or tablets -- all of varying screen sizes," says Tatjana Salcedo, Web Team strategist. "In order to provide the best possible user-experience, we opted to rebuild the site in a responsive way."

"Responsive web design" is a method of web design developed by Ethan Marcotte that uses CSS and other techniques to allow the layout and content of pages on a website to respond according to the screen resolution and orientation of the device viewing the site. This means making your design and images shrink and grow to the browser window and altering the layout (often the number of columns) at specified resolution thresholds. Additionally, responsive web designs allow easy interaction when using a touchscreen and contain video and audio that plays across a wide range of devices. The result, when implemented well, is a highly functional and attractive website that scales elegantly, regardless of the device used to access it.

The project -- completed in-house by the Web Team -- had to consider every aspect of the homepage, from buttons better sized to fit fingertips to navigation appearance and behavior to content prioritization.

"Responsive design keeps the visual integrity of a page as it changes shapes and rearranges content. This allows the user to have a better experience on any device," says Deb Goller, Web Team graphic designer.

Enrollment management implications

Of the many audiences who visit, there's one audience in particular whose mobile usage is skyrocketing.

A 2012 E-Expectations Report* conducted a survey of 2,000 college-bound juniors and seniors about their expectations for college websites, mobile usage, e-mail, and social media. The report indicates that 67 percent of college-bound students have access to a mobile device. Fifty-two percent of college-bound students have looked at a college site on a mobile device while 20 percent of them have looked at a college site on a tablet.

The Jan. 7 responsive launch included the undergraduate admissions web pages.

Bringing your unit into responsive design

Starting Monday, Jan. 14, the UVM Web templates offered online will be responsive upon download. Retrofitting an existing site is a different story, although if a site has stayed true to the offered publishing system features, the transition to responsive should be fairly simple. Webmasters can view online documentation and make appointments with the team for support. In addition, the Web Team will host an open info session on Monday, Jan. 28, 2013 from 9-10 a.m. in the 113T Waterman computer lab. Highly customized sites, such as the colleges, will be addressed one at a time with a great deal of assistance from the Web Team.

"The more customized a site, the more complicated the transition," says Megan Hack, team developer. "We'll plan to tackle those sites one at a time."


*E-Expectations Report conducted and published by Noel-Levitz, OmniUpdate, CollegeWeekLive, and NRCCUA® (National Research Center for College & University Admissions).