New Template Features

You may have noticed a new design popping up across the UVU website. We're really excited about it because it provides some great new features and functionality that will make using and maintaining our sites easier than ever!

New Layout Options

OU Campus will now offer a variety of layouts to choose from when creating a new page.

  • One column template (big content area)
    One Column
  • Two column template (one big column and one small column or two equal columns)
    Two Columns, Equal WidthTwo Columns, Left SidebarTwo Columns, Right Sidebar
  • Three column template (one big column and two smaller columns or three equal columns)
    Three Columns, Right SidebarsThree Columns, Equal Width
  • When working with two- and three-column layouts, it is important to consider how your content will move and adjust based on the device on which it is being viewed. Find out how your content will shrink, grow, and rearrange by learning about "mobile-first thinking."

Built-in Slider

OU Campus now offers a new standard slider which can be used at the top of any page or in any column. Features of the slider include:

  • Transitions (fade or slide)
  • Upload photos in the easy 'multi-editor'
  • Add a title and descriptions to each slider photo
  • Link each slider photo
  • Set the delay time between slides
  • Custom CSS for more advanced users

Adaptive/Responsive Design

In the past, websites were intended to be viewed on desktop and laptop computers. But with advances in technology, cell phones and tablets make the web accessible on any number of devices. Web designers answered this new demand by making a separate mobile version of their desktop site. However, it is more practical and easier to maintain a single site that works equally well on a mobile device as it does on a desktop computer, which has led to the adoption of Adaptive or Responsive design for UVU websites.

An adaptive or responsive website is simply a website that can shrink and rearrange its content to fit on a mobile device. It's a single site, optimized to provide the best viewing experience regardless of what you're using to view the site. This way, site contributors will only have to update one site and have it look great no matter how it is being viewed.

This graphic gives an idea of how a single site adjusts according to the size of the device it is being viewed on:
Adaptive/Responsive Design

To get an idea of how adaptive/responsive design works, take a look at MediaQuieri.es for a gallery of more examples.