Mobile Drupal A hands-on guide to mobile theming2011.01.27 - SW Drupal Summithttp://swdrupalsummit.com/sessions/mobile-dru...
Goals of Mobile‣   Focus on content‣   Reduction of complexity‣   Straightforward use
Different Approaches‣   CSS only‣   Browser Detection + Mobile Themes‣   Separate subdomain / path‣   External Service (ex...
CSS Media Queries‣   Please read and bookmark (game changer)    http://www.slideshare.net/bryanrieger/rethinking-    the-m...
CSS Media Queries ‣   No media query support = a media query     ‣   Target the lowest level capability first     ‣   Filte...
CSS Examples‣   http://colly.com/ - The example in the slideshow‣   http://www.stpaulsschool.org.uk/‣   http://kickawesome...
Drupal Modules‣   Browser Detection    ‣   Browscap: http://drupal.org/project/browscap    ‣   Mobile Tools: http://drupal...
Drupal Themes‣   Mobile Garland - http://drupal.org/project/mobile_garland‣   Nokia Mobile - http://drupal.org/project/nok...
Helpful Links‣   User-Agent Switcher - Firefox Add-on for quick    mobile testing. Always try the real thing.
The end chris@fourkitchens.com twitter.com/rupl http://drupal.org/user/411999http://swdrupalsummit.com/sessions/mobile-dru...
Upcoming SlideShare
Loading in...5
×

Mobile drupal

2,779

Published on

This is somewhat outdated. Read these slides instead: http://www.slideshare.net/rupl/responsive-drupal-beyond-the-media-query

---------------------------------------------------------------

A brief summary of the options available to Drupal themers looking to build mobile websites, mobile apps, or websites with mobile versions.

Published in: Technology, Business
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,779
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
15
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Mobile drupal

    1. 1. Mobile Drupal A hands-on guide to mobile theming2011.01.27 - SW Drupal Summithttp://swdrupalsummit.com/sessions/mobile-drupal
    2. 2. Goals of Mobile‣ Focus on content‣ Reduction of complexity‣ Straightforward use
    3. 3. Different Approaches‣ CSS only‣ Browser Detection + Mobile Themes‣ Separate subdomain / path‣ External Service (example)
    4. 4. CSS Media Queries‣ Please read and bookmark (game changer) http://www.slideshare.net/bryanrieger/rethinking- the-mobile-web-by-yiibu
    5. 5. CSS Media Queries ‣ No media query support = a media query ‣ Target the lowest level capability first ‣ Filter for more functional versions from there ‣ More compatible than when you start with desktop styles and filter for mobile version ‣ Easy to cachehttp://j.mp/rethink-mobile
    6. 6. CSS Examples‣ http://colly.com/ - The example in the slideshow‣ http://www.stpaulsschool.org.uk/‣ http://kickawesome.tv/
    7. 7. Drupal Modules‣ Browser Detection ‣ Browscap: http://drupal.org/project/browscap ‣ Mobile Tools: http://drupal.org/project/mobile_tools‣ Other ‣ Semantic Views: http://drupal.org/project/semanticviews Allows you to clean up your Views output ‣ Mobile Theme: http://drupal.org/project/mobile_theme Simple but may cause caching problems
    8. 8. Drupal Themes‣ Mobile Garland - http://drupal.org/project/mobile_garland‣ Nokia Mobile - http://drupal.org/project/nokia_mobile‣ Mobile Example - https://github.com/rupl/mobile_example Demo today: CSS-based responsive theme that delivers both the mobile and desktop experiences without theme switching.
    9. 9. Helpful Links‣ User-Agent Switcher - Firefox Add-on for quick mobile testing. Always try the real thing.
    10. 10. The end chris@fourkitchens.com twitter.com/rupl http://drupal.org/user/411999http://swdrupalsummit.com/sessions/mobile-drupal
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×