Download - One site to rule them all
![Page 1: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/1.jpg)
EDUWEB 2012
One Site To Rule Them All
Mobile and traditional sites can come together
![Page 2: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/2.jpg)
EDUWEB 2012
Responsive Design…Again?
Just give me more stuff to do and push me off the edge
![Page 3: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/3.jpg)
EDUWEB 2012
Beyond Responsive Design
Content, Behaviors, Design…
Oh My!
![Page 4: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/4.jpg)
EDUWEB2012
Introductions
Nathan Gerber@nathangerber
• Web IA, CMS consulting, Web IA experience
• Director, Web Development Services – 13 years
• Noel-Levitz Associate Consultant, Web Strategy Services team
![Page 5: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/5.jpg)
EDUWEB2012
We Will Be Discussing…
Mobile landscape
Implementation options
Content strategies
“Web apps”
Lessons learned – takeaways
12345
![Page 6: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/6.jpg)
EDUWEB2012
Can you find my son in this picture?
You Are Here
![Page 7: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/7.jpg)
EDUWEB2012
![Page 8: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/8.jpg)
EDUWEB2012
Anyone Else Feel Behind?
![Page 9: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/9.jpg)
EDUWEB2012
THE MOBILE LANDSCAPE (more stats and trends? please…we can’t take it anymore)
1
![Page 10: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/10.jpg)
EDUWEB2012
The Shifts/Trends…
![Page 11: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/11.jpg)
![Page 12: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/12.jpg)
EDUWEB2012
At UVU…
We are watching the trends on our campus
Allocated 4,000 IPs for connections on wireless
First two days of semester…
Over
31,000
devices attempted connection
(34,000+ students)
![Page 13: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/13.jpg)
EDUWEB2012
Your Mobile Phone… Not Really A Phone Anymore!!
What do you use your “phone” for?• Computer• GPS• Accelerometer• Camera• Video camera• Location services• Voice Calls
![Page 14: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/14.jpg)
More than two-thirds (67%) have regular access to a
mobile device• 20% are using tablets• 52% of college-bound
students have looked at a college Web site using a
mobile device
Site optimized for mobile?
35% of 4-yr privates39% of 4-yr publics7% of 2-yr schools
![Page 15: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/15.jpg)
EDUWEB2012
Mobile Email
![Page 16: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/16.jpg)
EDUWEB2012
IMPLEMENTATION OPTIONS(things to consider…)
2
![Page 17: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/17.jpg)
EDUWEB2012
Build A New Mobile Site?
“Mobilize, don’t miniaturize”… anon.- Anonymous
“… the mobile context is so different from the desktop one it deserves direct consideration vs. just mangling down a full-size site.”
- Drew Stevenson, University of Minnesota, 2010
![Page 18: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/18.jpg)
EDUWEB2012
Our Focus
“The user IS mobile, not just holding one.” - Justin Gatewood, Victor Valley Community College
“It is not about making our site work on a mobile device, it is about what our users need when they’re mobile”
- Mobile Web Team, Utah Valley University
![Page 19: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/19.jpg)
EDUWEB2012
Which “mobile” ?
…or maybe a combination of all three?
Native Apps
Mobile web
Adaptive Design
![Page 20: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/20.jpg)
EDUWEB2012
How To Decide…
• Time
• Cost
• Scalability
• Maintenance
• Your current resources
![Page 21: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/21.jpg)
EDUWEB2012
Native Apps
Advantages• Control user experience• Use hardware features• Off-line usage• Uses app code on device
Disadvantages• Develop for each platform • Differing experience by device• Cost/time to develop/deploy • Testing more difficult• Changes require download• Lag in “publishing changes”• App overload
70% of respondents said that they were happy to browse a school’s mobile site through their device browser, rather than
downloading a mobile app specific to that school.
![Page 22: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/22.jpg)
EDUWEB2012
Dedicated Mobile Web
Advantages• Cost less than native apps• Quick upgrades/updates• Available on all web devices• More discoverable
Disadvantages• No offline mode • Updating multiple sites• Content is typically limited • Content separate from “main” site• SEO issues
– Multiple URLs = link popularity issues– Sites compete with one another– Doesn’t have the authority and ranking of
one site
![Page 23: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/23.jpg)
EDUWEB2012
Responsive Design
Advantages• Most cost effective• One site• Content experts update once• Optimized for different mobile
devices• Adaptable for future shifts• Best long term ROI• Single URL, better for SEO
Disadvantages• Page bloat can become an issue• Third party systems adopting
adaptive/responsive design
![Page 24: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/24.jpg)
EDUWEB2012
Responsive Design
Advantages• Content strategies become
forethought • Multiple experiences become
part of the plan• Mobile first forces content
prioritization
Disadvantages• Content strategies become
forethought • Multiple experiences become part of
the plan• Mobile first forces content
prioritization
Your content experts will be learning principles in content strategies and user
experience
![Page 25: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/25.jpg)
EDUWEB2012
Why Responsive Design?
• Sites, pages, elements “adapt” to the viewer’s experience
• One site can serve all devices, optimized for experience (mobile, tablet, desktop, etc.)
• Accomplished through media queries, CSS, and HTML5
• Can really push content strategy and behaviors
![Page 26: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/26.jpg)
EDUWEB2012
How Many Devices?
UVU Site
292 unique devices
in last 30 days
![Page 27: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/27.jpg)
EDUWEB2012
How Many Resolutions?
UVU Site
2739 resolutions
in last 30 days
![Page 28: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/28.jpg)
EDUWEB2012
Notre Dame
![Page 29: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/29.jpg)
EDUWEB2012
Regent College
![Page 30: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/30.jpg)
EDUWEB2012
UCSD
Brett PollakEmily Deere
![Page 31: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/31.jpg)
EDUWEB2012
![Page 32: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/32.jpg)
EDUWEB2012
![Page 33: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/33.jpg)
EDUWEB2012
CONTENT STRATEGIES(more important than ever…)
3
![Page 34: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/34.jpg)
EDUWEB2012
Content = KING(and always will be on the web)
![Page 35: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/35.jpg)
EDUWEB2012
Give ‘em What They Want
![Page 36: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/36.jpg)
EDUWEB2012
Design and IA Considerations
Most valuable content:1. Academic program listing
2. Cost/scholarship calculators
3. Calendar of important dates and deadlines
4. Specific details about academic programs
5. An application process summary
6. Online application forms
The Mobile and Live Conversation Expectations of
College Bound Students
![Page 38: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/38.jpg)
EDUWEB2012
![Page 39: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/39.jpg)
EDUWEB2012
![Page 40: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/40.jpg)
EDUWEB2012
What Can We Eliminate?
• “Must not lose anything”
• “It is all vitally important”
• “We should have everything linked off the homepage”
![Page 41: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/41.jpg)
EDUWEB2012
Best Admin Testing Tool…
![Page 42: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/42.jpg)
EDUWEB2012
Content Choreography- Trent Walton -
![Page 43: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/43.jpg)
EDUWEB2012
Content Choreography
stacking vs. interdigitating
- Trent Walton -
![Page 44: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/44.jpg)
EDUWEB2012
Content Choreography
![Page 45: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/45.jpg)
EDUWEB2012
Shift Your Thinking
![Page 46: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/46.jpg)
EDUWEB2012
Mobile First
…forces content strategy
![Page 47: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/47.jpg)
EDUWEB2012
UVU Current Web Organization
Decentralized Content Experts
Decentralized Content Experts
Decentralized Content Experts
Decentralized Content Experts
Centralized ITStandard CMS
Templates
![Page 48: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/48.jpg)
EDUWEB2012
Two BIG Questions to Answer
• Can your content folks get “content choreography”?
• Do your current tools allow them to?
![Page 49: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/49.jpg)
EDUWEB2012
Choreography and Design
• Developers create, content experts can use
• Content elements become focus, not page
• Paradigm shift for developers and content experts
![Page 50: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/50.jpg)
EDUWEB2012
WEB APPS(feel the power…)
4
![Page 51: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/51.jpg)
EDUWEB2012
UVU Web Apps
• Use jQuery, CSS, HTML5, media queries
• Build in “features” based on device
• Creates more functionality on devices
• Build behaviors that can be reused on elements (microdata anyone?)
![Page 52: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/52.jpg)
EDUWEB2012
![Page 53: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/53.jpg)
EDUWEB2012
Content, Behaviors, & Design
![Page 54: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/54.jpg)
EDUWEB2012
LESSONS LEARNED(important takeaways…)
5
![Page 55: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/55.jpg)
EDUWEB2012
A Possible Approach
Develop in phases – evolving site
• Choose one area of your site• Start with responsive, fluid grid• Identify content “elements” and how to handle them• Add “web app” functionality where appropriate • Teach content strategies to area experts• Continue to fine tune
![Page 56: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/56.jpg)
EDUWEB2012
Key Takeaways
• Start with something small(Possibly email and landing pages, let analytics guide you)
• Content strategy/choreography for first phase
• Gather resources
• Learn about current CMSCan it utilize a responsive design?
• Get help, if needed
![Page 57: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/57.jpg)
EDUWEB2012
Lessons Learned
• Develop in phases – evolving site
• Content strategy must be top concern
• Keep your mobile users in mind
• Use your own mobile site – best testing
• Monitor your analytics
• Realize that everything is still changing
![Page 58: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/58.jpg)
EDUWEB 2012
Questions?
Nathan Gerber
@nathangerber
http://www.slideshare.net/nathangerber
Need info on E-Expectations or tools that we use?
Please see me after the session
![Page 59: One site to rule them all](https://reader034.vdocuments.net/reader034/viewer/2022051514/54b6bdd94a7959457f8b463d/html5/thumbnails/59.jpg)
EDUWEB 2012
THANK YOU