New Davidson College Homepage

New Homepage Design

Davidson's new homepage design is the culmination of months of work on project discovery and research, strategy, information architecture, and user experience. The design was the near unanimous choice of alumni and student focus groups.

Read More

Responsive Design - Desktop, Tablet, and Mobile

Tablet and Mobile Designs

Site visitors who access the new site on a tablet or mobile phone will see a slightly different design that is optimized based on screen size. Known as responsive design, the site will adjust automatically to the resolution of the device.

Read More

Lower Level Page Design

Lower Level Page Design

Lower level pages are designed with flexibility in mind featuring two- and three-column layouts, multiple masthead, callout, and main content area options, as well as news, events, and social media feeds.

Read More

Homepage Wireframes

Homepage Wireframes

Before any design work begins, wireframes are created for every iteration of the homepage and lower level page types. Since Davidson is doing a responsive design, wireframes need to be completed for desktop, tablet, and mobile views.

Read More

Inside Davidson Upgrade

Inside Davidson Gets an Upgrade

Over the summer Information Technology Services and College Communications have been working on an upgrade and design refresh of Inside Davidson, the college's intranet site.

Read More

Subscribe

Sign up to receive Web Redesign Project updates by e-mail whenever we post something new to this blog.

Project Update and Content Meetings With Departments

I write this post to ask administrative and academic department directors/chairs for assistance with the redesign project. After months of work gathering input and time spent on strategy, user experience, and design, the redesign project has shifted its focus to departmental Web content.

As noted previously in this blog, the new website will offer many new features, including the ability to display department news, events, profiles, callouts, masthead stories, and images. College Communications will ask you for your assistance in identifying department or program stories, students and alumni to profile, photos, and other content. A College Communications writer will work with you to develop this content.

Department Content Meetings

In the next few weeks you can expect to be contacted by a College Communications staff member to schedule meetings to discuss your department website content.

Update 1/24/13 – With 19,000 pages currently in the CMS, it has taken longer for us to plow through department Web content. We are still continuing to review department Web content and take an initial pass at editing, rewriting, and reorganizing content before meeting with offices and departments. We have hired several freelance Web writers to assist us with this process. We will begin scheduling appointments with departments in the next few weeks to discuss your site. We appreciate your patience as we continue our work. 

It is critical that as department director or chair that you make time in your schedule to meet with College Communications to discuss your department Web site and to respond to requests in a timely fashion so that we can stay on track with the project. We understand that this is a very busy time of year, so we will do our best to accomodate everyone’s busy schedules.

No Major Site Changes After November 1, 2012

After November 1, College Communications digital staff will focus their full attention on the redesign project. No new content management system (CMS) sites or significant content changes or upgrades to our current site will be made by College Communications after November 1.

The content of the current website will continue to be updated and maintained and all administrative and academic departments are expected to keep their Web pages up to date during the transition. Departments are encouraged to track any content changes they make to CMS pages in Word files on their computer.

We appreciate your attention to this and for making this a priority for your department.

Lower Level Tablet and Mobile Designs

Davidson Three Column Tablet Design

Tablet View

Here is a look at the different screen presentations for lower level pages on tablet and mobile devices. As noted in previous posts, we are undertaking a responsive design approach for the homepage and lower level pages on the new site. The content on the site stays the same across desktop, tablet, and mobile devices, but the layout of the pages adjusts to the screen size of a given device.

Tablet Design View

This is a view of a three-column webpage layout that has responded to a smaller tablet screen size and changed to present the page in a two-column layout. The top navigation area of the page (area in red) has change to a narrower presentation where “Admission & Financial Aid,” “Student Life,” and Offices & Departments” now wrap to a second line. All of the right column callouts (shown in gold, red, and brown) have automatically adjusted and moved to be displayed under the social media area in the middle of the page. For optimal display on a tablet, all of the text links in the super footer at the bottom of the page are displayed in drop-down menus.

Mobile View

In the mobile view—what you might see on an iPhone or Android phone—the original three columns on the page have been automatically combined into a single column and presented in a narrower view. The site navigation has changed to be optimized for a mobile device and is also repeated at the bottom of the page so visitors don’t need to repeatedly scroll up the page to access pages within a given section of the site.

Lower Level Page Desktop Designs

Lower Level Department Homepage (View 2 - 3 column)We are currently working on designs for lower level pages below the homepage. This work is still ongoing at this point, but we are far enough along in the process to show you the direction we are heading.

Pages Designed for Flexibility

Based on what we heard during project discovery we are designing pages to be very flexible. We will have the ability to choose a two or three column layout and a variety of masthead options. The main part of the page will allow for the display of news, events, and social media feeds. The right column will allow for several different callout options, including profiles, general highlights, among others. Outlined below is a brief overview of each area of a page.

Masthead

The masthead is the area of the page located just below the primary navigation (site-wide links area with red background). Several mastheads will be available that will allow us to tell stories, highlight people and programs, and provide a better sense of place by featuring campus photography. The options available in this area are included below.

  • Scrolling masthead showing multiple stories with images or videos (stories expand to the left and right to fill the entire browser window)
  • Single masthead image with text story area and image or video
  • Scrolling photos with captions (photos expand to the left and right to fill the entire browser window)
  • Single photo with caption
  • Single photo with caption that can expand to fill the browser window from left to right
  • Option to feature no masthead

Three-Column Layout

  • Left column will feature section navigation, department contact information, and a page share button allowing pages to be e-mailed or shared on Facebook, Twitter, and other social media sites
  • Main content area will display department content as well as news, events, and social media feeds in an accordion-tab style
  • Right column will feature a variety of callout options, including profiles (in gold), general callouts (in brown), event announcement/registration (in red), or related links (in white)

Two-Column Layout

  • Wider page for displaying longer content
  • Accordion-style tabs at bottom of page for displaying content like frequently asked questions
  • Callout area at the bottom of page

 Design Gallery

Page 4 of 10« First...«23456»...Last »