140 likes | 297 Views
Ektron Brown Bag: USF Mobile Website. Marlene Tom August 7 &16 , 2013. Agenda. USF Mobile Strategy Demo of Mobile Website Layout Example Page Formatting Fixes. Growth in Mobile Device Use. 87% Americans own a cell phone 81 % Growth of smartphone usage in 2012
E N D
Ektron Brown Bag: USF Mobile Website • Marlene Tom • August 7 &16, 2013
Agenda USF Mobile Strategy Demo of Mobile Website Layout Example Page Formatting Fixes
Growth in Mobile Device Use • 87% Americans own a cell phone • 81% Growth of smartphone usage in 2012 • 70% Growth of global mobile data traffic in 2012 • 45% Americans own a smartphone • 31% Americans own a tablet computer • 12-foldMobile traffic in 2012 vs. entire Internet in 2000 • 2013 Mobile-connected devices will exceed the world's population • Source: EdTechMagazine.com
USFCA.EDU Mobile Traffic • Mobile traffic: 16% in July, 13.78% in S’13, 10% in F’12 • 50% iPhone users, 23% iPad users
Mobile is a priority for USF • Communicate our USF mobile strategy • Oversight, request, and assessment process • Define mobile areas and technologies • USF websites • Official USF mobile app umbrella • Mobile publications • Roadmap and priorities set • Mobile app: Admission content and campus tour • Mobile publications: Admission and Development publications
USF Mobile Websites • The long-term solution is responsive web design
Next Steps for the Mobile Website • Secure funding in FY 2015 for a full web redesign • Revise all web content thinking about mobile firstImportance of mobile optimization: • 74% of consumers will wait 5 seconds for a web page to load on their mobile device before abandoning • 46% of consumers are unlikely to return to a mobile site if it didn't work properly during their last visit • 71% of mobile browsers expect web pages to load almost as quickly or faster as web pages on their desktop computers Source: Gomez
Summer 2013 Mobile Website Project • A web-friendly presentation of the website launched in July 2013 for mobile devices • This is a short-term fix, not a real solution. This will primarily optimize an iPhone experience, but does not account for all other mobile devices • Content is not optimized for a mobile experience
What’s Changed in the Mobile Layout? • Same layout/templates! Css& Javascriptalter the layout view for a mobile experience. • Certain elements had to be hidden • Banner 150 boxes are not viewable • Right-hand contents, except for navigation menus • Slideshow captions will not appear • Optimized for iPhone portrait view & iPad • iPhone landscape will still default to a desktop view • Larger mobile phone screens will have an extra 20 padding of white-space
How Can You Optimize Your Pages? • Review your web pages from a smartphone. Can you see the essential information? • Formatting: • Don’t use inline styles. Use the styles in the Ektron WYSWIG menus. Adding in your own font tags, colors, and sizes will not reformat in size for a mobile screen • Don’t use tables for layout • Don’t specify widths in your images • Reduce, reduce, reduce content. What is essential to read?
Formatting Examples • Remove extra space above the page title • Change the Quick Link menu name • Remove odd, inline text styles View the Web Communications & Services blog to see more postings on formatting fixes for mobile devices. If you need help fixing any of your web pages, just send the page name to webservices@usfca.edu and we will be more than happy to help make the fix for you!