Getting Started with Mobile Websites

If You Don’t Know Code

Carli SpinaAccess By Touch:Delivering Library Services Through Mobile TechnologiesJune 8, 2012

Why Have a Mobile Website?

• 46% of American adults own a smartphone - Pew Internet

• Most cell phone users (70% overall and 86% of smartphone users) use phone for just-in-time information - Pew Internet

Mobile Website vs. Mobile App

•What platforms does your audience use?

•Will users use the app while offline?

•Will you be using features such as geolocation or the camera?

•Will you be making frequent updates?

So you want a mobile

website...what now?•Use a service to create and

maintain the site

•Use online tools to create a site with little or no code

•Customize an existing framework

•Learn how to create a site from scratch

No Code

Boopsie for Libraries

• Works on Android and iOS devices

• Multilingual

• Updated through Google Docs

• Standard and Optimum packages

• Integrates library locator, Ask a Librarian, catalog searching and one-click Overdrive access Seattle Public Library App

Your Library Phone• Available for all

smartphones

• Integrates with the library’s OPAC

•Works with RFID to facilitate self-checkout

•Overdrive integration is planned

•Uses technology from SOLUS and ISNG

SpringshareMobile Site Builder

•Compatible with all mobile platforms

• “Point and Click” interface

• Automatic redirect for mobile devices

• $299 per year for LibGuide & CampusGuide users

Limited Code

Wordpress

• Easy to add to an existing Wordpress site

• Compatible with any mobile device

• Lots of themes are available with both free and pay options available

• Can be customized if necessary

• Freemium service with multiple plans

•Drag and drop website prototyping with JQuery Mobile

• Emulates multiple iOS and Android devices

• Integrates seamlessly with ThemeRoller

ThemeRoller

• Freemium, though only paid plans can export HTML

•Drag and drop interface

• Supports iOS and Android devices

• Video tutorials are available

• Functionality and theme combined

•Mobile-optimized

•Made to fit a wide range of screens

• Easy to use

•Good option if you want a website for both mobile and non-mobile audiences

One-Pager by Influx

Full Site

More Code

iWebKit

• Easy to use framework and clear instructions

• Available free for non-commercial use

•New version under development

Mobile Frameworks by Jason Clark

• 3 available frameworks

• All highlight the key features of the library site

•Options for various types of libraries/patrons

Mobile Framework by Eric Phetteplace• Started with Jason

Clark’s framework

• Built using JQuery Mobile

•Web app - compatible with all mobile devices

• Available on GitHub

Learn To Code

Teach Yourself To Code

•Code Year from Codecademy

•Lynda.com

•Code School

•JQuery Mobile Resources

Tools/Services• Boopsie for Libraries - http://www.boopsie.com/library/

• Your Library Phone from SOLUS - http://yourlibraryphone.com/

• Mobile Site Builder by Springshare - http://www.springshare.com/mobile/

• One-Pager by Influx - http://influx.us/onepager (they also provide other web design & usability services)

• iWebKit - http://snippetspace.com/project/iwebkit/

• Wordpress - Obox (http://themeforest.net/item/obox-mobile-wordpress-mobile-framework/165736?ref=lvraa), Wordpress Mobile Pack (http://wordpress.org/extend/plugins/wordpress-mobile-pack/screenshots/), WPtouch Pro (http://www.bravenewcode.com/product/wptouch-pro/).

• Codiqa - http://codiqa.com/

• ThemeRoller - http://jquerymobile.com/themeroller/

• Proto.io - https://proto.io/

• Frameworks by Jason Clark - http://www.lib.montana.edu/~jason/files.php

• Frameworks by Eric Phetteplace - https://github.com/phette23/Chesapeak-College-LRC-Mobile-Site

Sources• Smith, Aaron, “Nearly Half of American Adults are Smartphone Users”,

Pew Internet, March 1, 2012. http://www.pewinternet.org/Reports/2012/Smartphone-Update-2012/Findings.aspx

• Rainie, Lee and Susannah Fox, “Just-in-time Information through Mobile Connections”, Pew Internet, May 7, 2012. http://www.pewinternet.org/Reports/2012/Just-in-time.aspx

• Alaska forest - trees (photo) by blmiers2 (CC License). http://www.flickr.com/photos/41304517@N00/6739112709

Learning Resources• Code Year from Codecademy - http://codeyear.com/

• Lynda.com Online Software Training tutorials - http://www.lynda.com/

• Code School Tutorials - http://www.codeschool.com/

• JQuery Mobile Tutorials and Articles - http://jquerymobile.com/resources/

Questions?

Contact me:@CarliSpinacspina@law.harvard.edu