OverviewMobile Strategy  Content – top library tasks, info pages are secondary, social media Design - accessibility first, must work on all devices, not just the iPhone Sites vs Apps

Design Process

Vendor vs In-house development Accessing your data Deciding on content Integrating with your full site, Drupal Which devices? Mobile detection Mobile layout Testing (emulators, native devices) Promotion Maintenance

Mobile StrategyMobile is a core service, not a frillContent – top library tasks, info pages are

secondary, social mediaDesign - accessibility first, must work on

all devices, not just the iPhoneSites vs Appshttp://yiibu.com/articles/rethinking-the-

mobile-web/Only Apple users browse the web?

Identify contentMobile sites are another degree of task based

designIdentify tasksIdentify productsMinimal organizational info or static info

Page Pageviews – March 2010 to March 2011

/en/main/overview 7486225

/en/main/find 443970

/fr/main/overview 430815

/en/main/library 370425

/en/main/find/catalog/search/all/about 268408

/en/main/find/download 162844

/en/main/program 111021

/en/main/find/online 103624

/en/main/interest 80412

/en/main/library/card 64233

/en/main/about 63336

/en/main/library/location/central 59022

/en/main/about/contact 52688

/en/main/library/card/using/borrow/help 33801

/fr/main/find 32206

Top content1. Catalogue Search / My Account2. Locations3. Digital Media4. Programs5. Databases6. Subject guides / Readers’ Advisory7. Contact

Mobile designAfter content, then…..Which devices?Sites vs AppsMobile detectionLayout and resizing

Mobile sites vs mobile appsBiggest issue with creating apps is the

problem of creating an app for every mobile OS

The idea of creating websites as apps is a step backwards – web apps

More difficult to updateApps should be created when you actually

need an application

Mobile Traffic - Catalogue

Mobile Traffic - Website

Benefits of Apps• Speed: JavaScript performance has increased dramatically in the past few

years, but as an interpreted language, it will never be as fast as compiled code that runs directly on the processor. In a mobile environment where processors run slower to conserve power, every clock cycle counts.

• Data Management:  Core Data on the iPhone provides a much more sophisticated system where relationships between your data objects are managed automatically.

• Animation: CSS3 and Javascript provides ways to animate page elements, but much more sophisticated effects are possible when you access the underlying Core Animation framework with native code.

• Resources: Mobile developers never have enough memory, network speed, or CPU power. These limited resources are much harder to control when they’re being managed by JavaScript or the browser. It’s easier for native applications to detect these situations and adapt the user experience accordingly.

• Usability: iPhone users feel most comfortable when they’re using the standard controls they’ve become accustomed to in Apple’s built-in apps.

• Integration: An iPhone has many capabilities that are beyond the reach of the web browser. Some simple examples are the user’s contacts, the photo library, voice recording, and device movement.

In-house vs Vendor DevelopmentIn-house development requires mobile

programming expertise, site is easier to build as it uses more common programming languages

Our setupNeed access to your data – APIEvery new application requires maintenanceDrupal modules

Vendor optionsBoopsiePopular mobile solution for your catalogue

and gives you some static pagesIntegrates with every major ILSKey prediction, live integrationDrawbacks – different search query, not

completely live synchingGood reviews

BookMyneSirsi DynixFor the iPhoneBarcode scanning capabilitySocial recommendation engine powered via

GoodreadsFor non-iPhone users, all SirsiDynix library

technology is supported on Android, Blackberry and other smartphone browsers for mobile-friendly access.

We don’t have iBistro so not an option

Community DevelopmentApps4OttawaAPI access vs Flat filesMaintenance? Control over design?Great secondary option and way to stimulate

development, engage communityLibraryBooks, Ottawa Library Find, Libraries

Ottawa, WordPress Plugin

Our current implementationPartnered with other Bibliocommons libraries

to develop a complete mobile solutionEPL funded an iPhone appOPL funded a mobile siteBibliocommons developing an Android appAnnual subscription gives you access to all

three, includes maintenance, development

Mobile DesignMobile DetectionUser agents, @media queries (CSS3)User Agent API - http://user-agent-

string.info/apiNo perfect system for all devicesAny different than testing regular content for

browsers?Progressive EnhancementBandwidth

Mobile Layout“As a long-time proponent of non-fixed layouts,

I’ve long felt they were more “future proof” simply because they were layout agnostic.”

- www.alistapart.com/articles/responsive-web-design/

Fluid Layout In a fluid website layout, also referred to as a liquid layout, the

majority of the components inside have percentage widths, and thus adjust to the user’s screen resolution.

The amount of extra white space is similar between all browsers and screen resolutions, which can be more visually appealing.

If designed well, a fluid layout can eliminate horizontal scroll bars in smaller screen resolutions.

It will also be more compatible with alternate screen resolutions. With cleaner code and design, compatibility problems are more easily prevented, found and dealt with.

http://www.alistapart.com/articles/fluidgrids/

TestingEmulators -

http://mobiforge.com/emulators/page/mobile-emulators“This underscores a general rule of the utmost

importance to web developers: There is no unified WebKit on mobile. I tested nine mobile WebKit-based browsers and they all behave differently. Not wildly so: Baseline CSS support is good, and JavaScript is definitely workable. Still, each one has its problems and strong points.”

- http://www.alistapart.com/articles/smartphone-browser-landscape/

- Emulators vs Native devices

PromotionMobile services can be a great promotional

tool for your libraryConsidered newsworthyGenerates social media traffic