Retrofitting Adaptive Designs
Upcoming SlideShare
Loading in...5
×
 

Retrofitting Adaptive Designs

on

  • 848 views

 

Statistics

Views

Total Views
848
Views on SlideShare
738
Embed Views
110

Actions

Likes
0
Downloads
2
Comments
0

3 Embeds 110

http://lanyrd.com 106
http://www.linkedin.com 3
http://us-w1.rockmelt.com 1

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Retrofitting Adaptive Designs Retrofitting Adaptive Designs Presentation Transcript

  • Retro-fittingAdaptive DesignsMatt Machell - Multipack Presents November 2011 eclecticdreams.com / @shuckle
  • Meet Prism
  • • "Next generation bibliographic discovery interface"• 100+ instances - each with 10,000s of users• Software as a service• Completely theme-able…
  • 9 months ago…. “We want a solution for Mobile”
  • Problems• Technical debt in base stylesheets• Which customers have been built on• and can change at any point
  • Solutions• Adaptive layer that adjusts the layout for small screens• CSS media queries AND Javascript• Inject layout/colour preferences at build time.
  • Mobile after the fact
  • What does your site do? Really?
  • Whats absolutely essential? Keep it.
  • Not essential? Still useful? Hide it.Reveal as needed.
  • Hide anything else* *See if anybody complains
  • Things we learned
  • • Specificity is your friend• Hacks will burn you• !important isn’t
  • You need to cope with stubby fingers
  • Only use the bits you need!
  • Cache it!• Preprocess and Munge CSS/JS• Set far future expiry• Preload and cache in localStorage for speed
  • Landscape Android isbigger than you expect
  • window.scrollTo(0,1)
  • cursor:pointer;fixes iPhone click event delegation
  • Retro-fitting is Possible