Making the most of mobile
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Making the most of mobile

on

  • 2,334 views

From WebContent 2011 in Chicago, with Jeff Eaton

From WebContent 2011 in Chicago, with Jeff Eaton

Statistics

Views

Total Views
2,334
Views on SlideShare
2,319
Embed Views
15

Actions

Likes
6
Downloads
30
Comments
0

4 Embeds 15

https://twitter.com 7
http://twitter.com 4
http://www.linkedin.com 3
http://a0.twimg.com 1

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

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
  • \n
  • \n
  • \n
  • Early days of the web, browser wars, costly custom code to make sites work across browsers and platforms\nThis started with dialup BBS, moved to online services, should you develop for web or AOL?\n
  • Eventually the browser wars settled down, web standards arose, and businesses became able to develop more consistently \nThis was a solution FOR FRONT END DEVELOPERS. Solved the code problem, not the content problem.\n\nAny time you put yourself in a position of building for two different platforms, you are back in that world.\n
  • On the content side, still have clunky, static content management. \nInformation that used to be locked up in print documents is now locked up in “web pages” or PDFs\nContent creators still think about text as documents, in pages\n
  • crazy diversity of screen sizes, platforms, OSes\nhaving the same arguments all over again\n“most users on AOL” “but if we do it on the web, everyone can see it”\ndifferent input styles\n
  • Diverse screen sizes is a problem that is not going to go away. It is going to get worse.\nDifferent device capabilities across OSes\n
  • \n
  • \n
  • One way people talk about how to prioritize is by talking about what people want to do when they’re “mobile”\n
  • Mobile supports different contexts, not just 'on the go or in your office.'\nMobile supports contemplative, thoughtful interactions as much as it does fast-paced, on the go\n\n
  • iPad on the couch\n\n
  • Laptop on crap hotel wifi\n\n
  • TV browsing (via Xbox, for example)\nThis, perplexingly, also needs to be thought about under the guise of “mobile”\n
  • Smartphone on the train\n\n
  • \n
  • There is no mobile version\n•Thinking about a "mobile version" of your website is already outmoded\n•Always going to be a new device, platform, new behaviors, interactions\n•Just like adding a few "share" links to your news site is not a solution to a fundamentally non-interactive model\n•Building "a mobile site" or "a mobile app" isn't going to help if you're not thinking about you content as a store to deliver in different ways\n•You need to treat your content as a pool that a given design or app can draw on, rather than puzzle pieces that fit into the 'blank spots' in a fixed design or designs.\n\n
  • \n
  • Three things\n
  • Every generation thinks that its problems are the big ones\nEvery generation on the web thinks that its transformation is THE BIG ONE\n
  • \n
  • Separation of content and form. For real this time.\n•Breaking down what you have and decoupling it from the design is the way you avoid desperate rebuilding when a new device or a new use model emerges\n•If you don't do the groundwork, design/app decisions and maintenance will be punishing. Like publishing another tiny little magazine\n•Isolate slices of content that make sense for a given use case. Local recipe guide? Martha Stewart? They have a huuuuuge archive of content in the form of recipes, stuff, etc. Spin uses their most popular content in the iPad app.\n\n
  • Web standards don’t protect you from yourself, like pasting a Dreamweaver page into your content input form\n“We just want to copy a document in from Word with all the formatting intact”\nYou can use web standards to make something that will break as soon as you try to redeploy it in another channel\n
  • \n
  • Lives at the design level, not your content\nEthan Marcotte’s book, Responsive Web Design, comes out tomorrow\n
  • \n
  • \n
  • ▼❑1Are apps the answer?\n•❑1.1Is it primarily content? Or actions/behaviors?\n•❑1.2hard to share, takes a lot of investment\n•❑1.3But... it's also easier if you're really device agnostic and serving data\n\n
  • \n
  • \n
  • More like an ad buy than selling the publication\n
  • What the who now?\nCMS vs. API - Why doesn’t it do that already?\nMost CMSs manage and present, an API exposes your content before the ‘present’ part.\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Editorial issues\n•Shift from "pages" to "reusable content chunks" is difficult for people to grasp, even people who use the CMS\n•Metadata, taxonomy, content model — snooze\n•How do we educate content creators about what it means to have different atomic chunks of content\n
  • \n
  • \n
  • \n
  • \n
  • Ad sizes, formats across different devices\nAlready not making enough online\nMobile is worse\n
  • Ad sizes, formats across different devices\nAlready not making enough online\nMobile is worse\n
  • \n
  • \n
  • \n

Making the most of mobile Presentation Transcript

  • 1. Jeff Eaton Karen McGrane@eaton @karenmcgrane 1
  • 2. Hi, I’m Jeff Eaton from Lullabot @eaton 2
  • 3. Hi, I’m Karen McGranefrom Bond Art + Science @karenmcgrane 3
  • 4. WEB STANDARDS ISYOUR NEW BICYCLE 5
  • 5. 7
  • 6. iPad 768x1024 iPhone 4 640x960 Motorola Droid 480x854 Samsung Moment 320x480LG Incite CT810 240x400 8
  • 7. TIME TO PRIORITIZE! 9
  • 8. “When you are working with a 320x480 pixelscreen, 80% of the screen space you had at1024x768 is gone.That means 80% of the content, navigation,promotions, and interactions needs to go. —Luke Wroblewski http://www.lukew.com/ff/entry.asp?1117 10
  • 9. 11
  • 10. THERE IS NO MOBILE CONTEXT 12
  • 11. 13
  • 12. 14
  • 13. 16
  • 14. 17
  • 15. THERE IS NO MOBILE VERSION 18
  • 16. “Fragmenting our content across different “device-optimized” experiences is a losing proposition, orat least an unsustainable one. —Ethan Marcotte, Responsive Web Design 19
  • 17. SO, NOW WHAT? 20
  • 18. BUILD FOR FLEXIBILITY,NOT FOR THE LATEST TREND 21
  • 19. REUSABLE CONTENT STORE _ Does our CMS support EMAIL HANDSETS creating reusable content chunks that can be TABLETS displayed across channels? _ How will our approvalSOCIALMEDIA processes and governance models need to change? CONTENT PRINTMICROSITES .COM SITE INTRANET 22
  • 20. SEPARATION OF CONTENT FROMFORM.(FOR REAL THIS TIME.) 23
  • 21. WE’VE GOT ISSUES._TECHNOLOGY_CONTENT_GOVERNANCE_ANALYTICS_ADVERTISING 25
  • 22. RESPONSIVE DESIGN?_Solves at the design level, not the content level_Design adapts to device capabilities_Means you have ONE website 26
  • 23. 27
  • 24. RESPONSIVE DESIGN CAVEATS_Still have to prioritize_Easy to overwhelm mobile browsers_Bandwidth considerations still important_Complex designs don’t get easier (they get harder!) 28
  • 25. ARE APPS THE ANSWER?_Great for tools and regular tasks_Total control over design (within OS guidelines)_Access to device capabilities (geolocation, address book, maps, camera)_Better for offline use_All the cool kids are doing it 29
  • 26. 30
  • 27. 31
  • 28. APP CAVEATS_App as revenue source looks grim (at least for high- profile publications)_iOS and Android are the new Netscape and IE_Findability in app stores is a nightmare (most apps are shared by word of mouth) 32
  • 29. TRANSITION TO AN API?(AND OTHER PERPLEXING ACRONYMS) 33
  • 30. TRANSITION TO AN API?(AND OTHER PERPLEXING ACRONYMS)_COPE: Create once, publish everywhere_Never seen anyone regret having flexibility in how they deploy content_May help solve problems you already have_Like a force multiplier for the effectiveness of all your other decisions_Democratize innovation with your content: put it into the hands of your users 34
  • 31. Website Tablet App Phone App Phone Website 35
  • 32. Website iOS Integration Mobile Website iPad App 36
  • 33. API CAVEATS_Easy to disappear down rabbit holes_Technical side (as communicated through acronyms) doesn’t matter as much as strategy_Is this an experiment or your foundation?_Is it for your staff, partners, the public?_How will you measure value? 37
  • 34. WE’VE GOT ISSUES._TECHNOLOGY_CONTENT_GOVERNANCE_ANALYTICS_ADVERTISING 38
  • 35. HOW DO YOU PRIORITIZE? 39
  • 36. NAVIGATIONSEARCHRELATED ARTICLESSAVED SEARCHESTOOLSGRAPHICSADVERTISING
  • 37. 41
  • 38. 42
  • 39. 42
  • 40. 44
  • 41. TASKS VS. TAXONOMY 45
  • 42. WE’VE GOT ISSUES._TECHNOLOGY_CONTENT_GOVERNANCE_ANALYTICS_ADVERTISING 46
  • 43. http://culturalsemanticweb.files.wordpress.com/2006/10/pic_fivea.JPG 47
  • 44. WE’VE GOT ISSUES._TECHNOLOGY_CONTENT_GOVERNANCE_ANALYTICS_ADVERTISING 48
  • 45. REUSABLE CONTENT STORE _ Will our current analytics EMAIL HANDSETS tools allow us to evaluate our content, wherever it TABLETS appears?SOCIALMEDIA CONTENT PRINTMICROSITES .COM SITE INTRANET 49
  • 46. 50
  • 47. WE’VE GOT ISSUES._TECHNOLOGY_CONTENT_GOVERNANCE_ANALYTICS_ADVERTISING 51
  • 48. Website Tablet App Phone App Phone Website 52
  • 49. Website Tablet App Phone App Phone Website 53
  • 50. Website Tablet App Phone App Phone Website 53
  • 51. 54
  • 52. BUILD FOR FLEXIBILITY,TO SUPPORT MORESPECIALIZATION 55
  • 53. Thanks!@eaton & @karenmcgrane 56