About UNLedu 4.1, Codename: "Rust Never Sleeps"

Intro: Didn't we just do this?

It's tempting to invoke the concept of "dog years" in explaining why it is that we keep changing the code and design that supports the UNLedu website. But not all people, alas, are dog people. We have it on good authority, however, that pretty much all people are Neil Young people. So we're calling this one, UNLedu 4.1, "Rust Never Sleeps." 35 years ago, on the release of that groundbreaking album, Young declared his commitment to continued reinvention and his intolerance of complacency.

The web is like that, too. The technologies that underlie it have been completely reinvented and rearchitected in the 20 years of its existence. And that quiet revolution continues. It's filled out the 'stack' of open technologies like HTML5 and eliminated dependencies on proprietary browser plug-ins (some of which actually were so power-inefficient that killing them off has had a meaningful impact on environmental sustainability). It's opened new possibilities like responsive web design, which UNL has fully embraced. UNL's site is to our knowledge more broadly mobile-compatible than the website of any other large university. That's part of the reason eduStyle judged UNL 2014's "Best Overall Website" in higher education. But that's history. It's time to move forward.

UNLedu 4.1 "Rust Never Sleeps" quietly aligns with continuing refinements in University branding. It refines and increases discoverability of some of our unique user interface solutions as a "mega-site." By explicitly dropping support for several old browsers (don't worry, they're hardly ever used anymore and it's easy and free to upgrade), it opens 'green fields' for university developers to embrace new technologies like Flexbox and WebSockets. Some of the most important changes you'll see this fall in testing and 'live' for Spring 2016 are described below.

Header

4.1 header (user logged out) at desktop screen width

'University of Nebraska–Lincoln' will link back to the UNL splash page.

The logo lockup includes the Academic 'N', an optional Context Line, and the Site Title. Use of the Context Line will be encouraged wherever applicable.

Better integration between Site Title, Breadcrumbs, and Navigation has been requested and discussed many times. In 4.1, the whitespace around the breadcrumb of the current section is on the same cream, visual plane as the Site Title, better connecting the two. The red arrow extending from the Navigation points to the breadcrumb of the current section.

Rather than flanking either side of the navigation outside of the page's inner wrapper, the menu and share icons have been moved inside the wrapper. The move away from a 960px max-width inner wrapper to a fluid, percentage-based wrapper should help offset the loss of horizontal space.

4.1 header (user logged in) at desktop screen width

The current user avatar isn't much more than the size of a favicon. In the 4.1 update, it's been enlarged to the size of a postage stamp. The user name has been simplified to first name only.

4.1 header with 'mega menu' navigation open at desktop screen width

Here, the header is shown with the "mega menu" navigation open at desktop screen width.

4.1 header at mobile screen width

No one seemed particularly fond of the breadcrumbs included above the menu at mobile screen widths…

4.1 header at mobile screen width (breadcrumbs removed)

…so they've been removed. We will explore ways to improve their presentation in the mobile navigation "drawer."

Footer

4.1 footer at desktop screen width

4.1 separates footer content into two distinct areas: local and global.

Local footer content will be user-modifiable. Some developers have tried to place bold tags around the name of the unit under Contact Us in 4.0. Since there is no bold weight of Gotham in use in the framework, some browsers will apply faux bold or, worse, add space in between letters. Taking this as an indirect request from the WDN community for more emphasis on the unit name, 4.1 makes the name a heading instead. Under this heading, developers will be able to include contact info and links to social media outposts. Related Links will also be included in this local section.

Global footer content will be University-centric and not modifiable by site developers. The 'easter egg' social media outposts currently hidden behind a mouse hover in the 4.0 Academic 'N' flag will be moved to a dedicated University social media section in the global footer.

4.1 footer for top level pages at desktop screen width

Since the University's social media outposts will already be included in the global area of the footer, there will be no need to list them again in the local area. Instead of Related Links (many of which will be included in the global footer), Affiliates can be listed instead.

4.1 footer at mobile screen width

The footer content will stack at mobile screen widths