Downloaded 35 times
Uploaded byMatt Machell
Web Apps and Responsive Design for Libraries
This document discusses responsive web design for libraries. It argues that responsive web design, which creates a single website that adapts to different screen sizes through flexible grids and media queries, is the best approach for libraries to take for their mobile presence. Native apps, separate mobile sites, and other approaches each have drawbacks, as they require more maintenance and do not allow for a unified experience across all devices. The document advocates for a responsive design that can provide a quality experience on any device using existing web skills.
More Related Content
Similar to Web Apps and Responsive Design for Libraries
Web Apps and Responsive Design for Libraries
- 1. Responsive Web Design for Libraries Matt Machell, Capita Libraries blogs.capita-libraries.co.uk/prism matt.machell @ capita.co.uk eclecticdreams.com / @shuckle
- 2. Themes • What isresponsive web design? • Web apps vs other mobile solutions
- 3.
- 4.
- 5. Apps are theonly way
- 6.
- 7.
- 8. We’ve done this... •Prism Mobile • Adaptive layout • Released Sept 2011
- 9. Before all that •Who has a smartphone? • What do you actually do with it?
- 10. Quick Exercise • Getout your phones • Discuss which apps and websites you use on them • Come up with list of top 3
- 11. Big question • Didanybody use a library web site? • Their institutional site? • Anybody say the phonecall app?
- 12. • Among allU.S. adults, only one in three report using any apps on their cell phone on a regular, weekly basis. http://www.pewinternet.org/~/media/Files/Reports/2011/PIP_Apps-Update-2011.pdf
- 13.
- 14. What is responsive webdesign anyway?
- 15. Who redesigned their websitein the last five years?
- 16. Which devices did youtarget?
- 17.
- 24. “Fragmenting our contentacross different “device- optimized” experiences is a losing proposition, or at least an unsustainable one. “ ―Ethan Marcotte, Responsive Web Design
- 25. You have nocontrol of the device somebody will access your site on.
- 26. Responsive Web Design •A flexible grid • Flexible media and images • media queries http://www.alistapart.com/articles/responsive-web-design/
- 27.
- 29. Building multi-device productin 2012...
- 30. 1- Single responsiveor adaptive website http://library.duke.edu/ http://prism.talis.com/mmu/ http://www.lancs.ac.uk/ http://www.eastsussex.gov.uk/default.htm
- 31. 2 - Website and a distinct Mobile website
- 32. 3 - Nativeapp that calls web APIs http://itunes.apple.com/gb/app/worcestershire-county-council/id465947187?mt=8 http://www.ombiel.com/campusm.html
- 33. 4 - Webwrapped in app Http://phonegap.com http://www.appcelerator.com/
- 34. • Who hasan app for their library? • Who has a separate mobile website? • Who has a single adaptive or responsive site? • Anybody use Phonegap?
- 35. Exercise • Get intogroups • Pick an approach • Discuss pros and cons of approach
- 36.
- 37. Native Apps -Pros • Faster rendering of graphics • Smoother interactions • Feels part of OS • You can charge to download it
- 38. Native Apps -Cons • Which platform? • App store terms and control • An app is a relationship • Costly to develop • Promoting it...
- 39. Targeting Platforms • iOS5 captured approximately 75% of all iOS users in the same amount of time it took Gingerbread to get 4% of all Android users.” http://thenextweb.com/apple/2012/03/06/why-do-developers-prefer-ios-over-android- try-75-adoption-of-ios-5-while-ics-is-stuck-at-1/
- 40. • 99% ofImangi's customer support emails are people complaining their Android device is not supported. Imangi supports 707 Android devices. http://thenextweb.com/mobile/2012/03/30/the-shocking-toll-of-hardware-and-software-fragmentation-on-android-development/
- 41. Phone Gap &Similar
- 42. Phone Gap &Similar • Write once, deploy to lots of devices • Use existing web skills
- 43. Phone Gap &Similar • App store terms • Non-native look and feel • Promoting it... • Can be slower than equivalent native app
- 44.
- 45. Separate Sites -Pros • Smaller download / Faster • All platforms • You control it
- 46. Separate Sites -Cons • Different sites get out of sync. • Twice the management overhead. • How many sites do you have? • Device detection is unreliable • Multiple uris
- 48.
- 49. Responsive Web App •One site that works on any device • Maintainable • One set of uris • You control it
- 50. Responsive Web App •Hard to retrofit • Requires modern web thinking • Sometimes send larger media than needed
- 51. If we wanta usable solution, that's maintainable across a wide customer base, makes use of existing skills and that we control...
- 52.
- 53. Almost... • Retrofitting ishard • Especially when you have 80 customers • ..whose design you don’t control
- 54.
- 55.
- 58. Adaptive All the content,differently presented
- 59.
- 60.
- 61. What can’t youdo in a web browser? • Add to home screen • Audio manipulation • Access the file system • Detect location • Use the device’s camera • Fullscreen video • Store data on the device • Drag and Drop for later • Make a phone call • Work offline • Scan a barcode • 3D graphics • Send notifications • Image manipulation
- 62.
- 63. “The future isalready here, it's just not very evenly distributed” - William Gibson
- 64. Boot to Gecko http://www.youtube.com/watch?v=OAaH5vikEOM
- 65.
- 66. Responsive Web Design •Maintainable • one web • multi-device solution
- 67. Web Apps • Willsoon do anything native apps do
- 68. Question your assumptions about “mobile”