Webmaster's Blog

I’ll be dissecting various other mobile sites from higher ed institutions, possibly to an excruciating degree. Starting with the list from .EduGuru’s blog post on Best of the Mobile Higher Ed Web and branching out from there…

Virginia Tech

The “Structure” and “Observations” sections will be the most interesting to non-geeks.

Doctype

XHTML Mobile 1.0

Viewport

width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;

CSS Files

1. mobile.css served with media="screen"
2. smartPhones.css served with media="only screen and (max-device-width: 176px)"
3. touchMobile.css served with media="only screen and (max-device-width: 480px) and (min-device-width: 320px)" and !IE conditional comment
4. ipad-portrait.css served with media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" and !IE conditional comment
5. ipad-landscape.css served with !IE conditional comment and media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" or media="all and (min-device-width: 1025px)"

Structure

• Local Weather
• Navigation (List Style)
  • Events
    • Today’s Events
    • Upcoming Events
    • Link to Full Events Calendar
  • People Search
  • Maps
    • Accordion Menu of Locations
      • Campus Destinations
      • Performing Arts Venues
      • Athletics
      • Campus Landmarks
    • Google Map
• News & Notices
  • Recent Headlines (6)
  • Link to More News
  • Campus Notices (10)
  • Link to More Notices
• Police/Safe Ride
  • Emergency #
  • Safe Ride #
  • Crime Hotline #
• Visitors
  • Directions to Campus
  • Visitors Center (GPS Section is cool)
  • Directory Assistance #
• Admissions
  • “Dates, deadlines and forms can be found on the full admissions website.”
  • Location, Phone, Email
  • Directions to Admissions Office (not the same as Directions to Campus above)
  • Hours
  • Pod Tours (this is so awesome!)
    • Downloadable MP3s (8)
    • Map with locations numbered 1–8
  • Information Sessions
• Main Phone Number
• Link to Full Site

JavaScript

• Google Analytics
• Google Maps
• jQuery

Observations

• At the time of writing the iPad specific styles just @import touchMobile.css
• Telephone #s use href="tel:#" syntax
• Assuming a lot of content is pulled in via RSS parsing on the server side
• Selecting a location from the menu on the map page “jumps” the user down to the map, link just above map “jumps” the user back to the menu
• “Parking Services” and ”Places to Eat” links exist in the source code but are currently commented out
• Most pages provide a link to the “full” version of a relevant site or just the vt.edu home page
• Breadcrumb style menu is built as you drill down but currently most content areas only go down 1 level
• From a pure user satisfaction standpoint, there are too many blatant “go to the full site for info X, Y, or Z” particularly in the Admissions area
• But I also see the bit “BETA” up top
• Overall the info that is there is well reasoned and well organized