Go Mobile With WordPress       Dale Mugford :: BraveNewCode Inc.@bravenewcode | @dalemugford | bravenewcode.com
Go Mobile With WordPress
Dale MugfordCo-Founder, BraveNewCode,WordPress dev, plugin shopDeveloping for the web since 1997(15yrs!!)Have used WordPre...
BraveNewCode         est. 2008Co-founded with Duane Storey(@duanestorey), well-knownengineer and sorcererStarted as web de...
Early Mobile LifeThis Sony Clearnet phone wasmy first, in 1998. I didnt own              Ye olde "iPhone"another until the ...
Mobile Web Cusp(continued)Design and style of both                            Before iPhonehardware and software for the  ...
EMobile Data History1G - voice2G - "EDGE" some data, mostlyWAP transmissions (1.6mbps)                                    ...
Publishing ToolsMore and more, publishing content for WordPresswebsites is happening on mobile devices.
WordPress Native App (iPhone/iPad/            WebOS)
Mobile Apps for Publishing Content• Native WordPress apps:  — WordPress for iOS  — WordPress for Android  — WordPress for ...
Mobile StatsMobile browsing has exploded, and has been evolving and             changing on a monthly basis.
47% unlikely to         71% expect                                       return to a site they       websites to load     ...
Mobile Device Weather PatternsTablets                        Smartphones
Majority of Internet Use:  Mobile vs. Desktop     North America 2012               Both                9%   Mobile    31% ...
Market Share by Platform  North America, August, 2012          Other          13%        Android                      20% ...
Market Share by Browser Engine     North America, August, 2012                      Other                       8%        ...
Downloads of WPtouch          WordPress.org ~ Spring 2008 - Fall 2012                                                    3...
Going Mobile:There are plenty of options and solutions to take your    WordPress website mobile— many are free.
Key Considerations                  for Mobile Sites• Who comprises your audience?		 	 	 	  	 (geographically, demographic...
Solutions for Delivering MobileVersions of Your WordPress Website:    Mobile Themes & Plugins
Free ToolsAvailable• WPtouch (Pro)• WordPress Mobile Pack• Wapple Architect                       Wapple• WP Mobile Detect...
WPtouch Pro•   Pro versionof the popular free mobile    plugin for WordPress•   Not particularly designed for any one    t...
Mobify• Works  by proxy server— requests get sent to Mobifys servers and it handles the serving of the mobile views on you...
Key Considerations       Choosing a Mobile Theme/Plugin•   Type of website (blog, company, video, audio, photo, etc)•   De...
Alternatives: Desktop Themes +      Responsive Design
What Is Responsive Design?  A method of designing websites so that content flexibly            adapts to different screen s...
Responsive Design Strengths— Carries branding from desktop to mobile— When done right, the results are impressive— Designe...
Responsive Design Weaknesses— All desktop resources are sent, whether needed or not(slower)— Changes to theme require more...
Emerging Beliefs With Increasing           Mobile-Only Web Usage"Don’t build for mobile based onyour website. Build for mo...
Takeaways...
Summary• Mobile web browsing has exploded in the past 5 years• Great tools available to publish via mobile• Most mobile vi...
Thank you.       Dale Mugford :: BraveNewCode Inc.@bravenewcode | @dalemugford | bravenewcode.com
Upcoming SlideShare
Loading in …5
×

Go Mobile With WordPress (2012)

675 views

Published on

Slides from Dale Mugford's "Go Mobile With WordPress" WordCamp Toronto 2012 presentation.

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

No Downloads
Views
Total views
675
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • my focuses (design, UX UI)\n
  • my focuses (design, UX UI)\n
  • how i met duane\nwe have over 10,000 customers\n100% GPL products\nWe've made our business on WordPress, and are so happy about it\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Not about "copying" with Android, competitors would have to develop similar approaches anyways\n\nThose that didn't adopt the full screen, touch approach have been relatively left in the dust\n\nInteresting to see where Microsoft is going, Windows Phone 7.5 (Mango) looks very compelling\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • Tell the story of "if apple makes a phone"\n\nWorking with WAP anecdotes, Rogers, etc\n\nPainful development, restrictions and limitations\n\nMobile Safari offered "full web", though EDGE and even WiFi was pretty slow b/c of device, but it was miles ahead of where we were\n
  • \n\n
  • Offers pretty full-featured publishing...\n\nOffers comment moderation\n\nNot an access to admin panel settings\n\nCan add photos\n
  • These apps help you publish on the go, manage content, and moderate discussion\n\nReally useful for:\nshorter entries\nphotoblogs\nediting entries\n
  • \n\n
  • 57% had trouble... this is where we focus things on. If you're going to do things differently on mobile they should be things that improve the experience\n\nThat means thinking about:\n- what's truly necessary\n- what can you live without\n- navigation\n- speed\n- how are they accessing the content? Most access points are though other mobile apps like Twitter and Facebook, rss readers etc.\n\n\n
  • 57% had trouble... this is where we focus things on. If you're going to do things differently on mobile they should be things that improve the experience\n\nThat means thinking about:\n- what's truly necessary\n- what can you live without\n- navigation\n- speed\n- how are they accessing the content? Most access points are though other mobile apps like Twitter and Facebook, rss readers etc.\n\n\n
  • 57% had trouble... this is where we focus things on. If you're going to do things differently on mobile they should be things that improve the experience\n\nThat means thinking about:\n- what's truly necessary\n- what can you live without\n- navigation\n- speed\n- how are they accessing the content? Most access points are though other mobile apps like Twitter and Facebook, rss readers etc.\n\n\n
  • 57% had trouble... this is where we focus things on. If you're going to do things differently on mobile they should be things that improve the experience\n\nThat means thinking about:\n- what's truly necessary\n- what can you live without\n- navigation\n- speed\n- how are they accessing the content? Most access points are though other mobile apps like Twitter and Facebook, rss readers etc.\n\n\n
  • 57% had trouble... this is where we focus things on. If you're going to do things differently on mobile they should be things that improve the experience\n\nThat means thinking about:\n- what's truly necessary\n- what can you live without\n- navigation\n- speed\n- how are they accessing the content? Most access points are though other mobile apps like Twitter and Facebook, rss readers etc.\n\n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • some websites are really deserving of a mobile version, especially if they've got a lot going on\n\ndoes the mobile option offer a switch to your desktop theme? some users are more savvy on their mobile devices and are ok with panning and zooming\n\nif using responsive design (or a responsive theme) watch for changes and updates to your desktop theme, as they will affect mobile\n\n\n\n\n\n
  • some websites are really deserving of a mobile version, especially if they've got a lot going on\n\ndoes the mobile option offer a switch to your desktop theme? some users are more savvy on their mobile devices and are ok with panning and zooming\n\nif using responsive design (or a responsive theme) watch for changes and updates to your desktop theme, as they will affect mobile\n\n\n\n\n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • \n\n
  • Go Mobile With WordPress (2012)

    1. 1. Go Mobile With WordPress Dale Mugford :: BraveNewCode Inc.@bravenewcode | @dalemugford | bravenewcode.com
    2. 2. Go Mobile With WordPress
    3. 3. Dale MugfordCo-Founder, BraveNewCode,WordPress dev, plugin shopDeveloping for the web since 1997(15yrs!!)Have used WordPress since 1.0Currently living in Hamilton, ON—home to a burgeoning tech sceneLive with Roz & Parker, our two pugs,Chloe & Max
    4. 4. BraveNewCode est. 2008Co-founded with Duane Storey(@duanestorey), well-knownengineer and sorcererStarted as web design & dev studioCreated WPtouch, WordTwit,Piggy, Crossroads, BuddyPress Geoplugins for WordPressCurrently offer WPtouch Pro, BraveNewCode LogoWordTwit Pro, Piggy Propremium plugins
    5. 5. Early Mobile LifeThis Sony Clearnet phone wasmy first, in 1998. I didnt own Ye olde "iPhone"another until the iPhone wasreleased in 2007Early 2000s had WAP. (Morelike "CRWAP")— limitedXHTML, CSS, well behindwhere desktop web was atCharacterized by slowconnections, minimal content,poor means of accessing WAP Sitecontent
    6. 6. Mobile Web Cusp(continued)Design and style of both Before iPhonehardware and software for the Android designiPhone inspired mobilecompetitorsCapabilities of these devices,coupled with the ease of use forweb browsing led to an explosionin mobile web surfing between2008-2010 After iPhone Android designIn 2008, Google reported over50% of mobile search it saw wasfrom iOS, recently said its now2/3rds
    7. 7. EMobile Data History1G - voice2G - "EDGE" some data, mostlyWAP transmissions (1.6mbps) 2G3G - up to 14.4mbpsLTE - 21-100mbps 3 GToday - Pretty much the "full web"some limitations are device specific(CSS3, HTML5) or are related todevice performance capabilities LTE
    8. 8. Publishing ToolsMore and more, publishing content for WordPresswebsites is happening on mobile devices.
    9. 9. WordPress Native App (iPhone/iPad/ WebOS)
    10. 10. Mobile Apps for Publishing Content• Native WordPress apps: — WordPress for iOS — WordPress for Android — WordPress for Windows Phone 7 — WordPress for Blackberry — WordPress for WebOS — WordPress for Nokia• Other options: — iBlogger, BlogPress (iPhone) — wpToGo, moBlog (Android) — Wordmobi, Scribe, Wavelog (Nokia)
    11. 11. Mobile StatsMobile browsing has exploded, and has been evolving and changing on a monthly basis.
    12. 12. 47% unlikely to 71% expect return to a site they websites to load have trouble using quickly on mobile on mobile 43% said they wont return to a slow website on mobile… Yikes! 57% had trouble 34% said theyd with a website via prefer to use a mobile device website that has a mobile versionEquation Research 2011 survey
    13. 13. Mobile Device Weather PatternsTablets Smartphones
    14. 14. Majority of Internet Use: Mobile vs. Desktop North America 2012 Both 9% Mobile 31% Desktop 60% Pew Research Report
    15. 15. Market Share by Platform North America, August, 2012 Other 13% Android 20% iPhone 67% NetMarketShare.com
    16. 16. Market Share by Browser Engine North America, August, 2012 Other 8% Webkit 92% NetMarketShare.com
    17. 17. Downloads of WPtouch WordPress.org ~ Spring 2008 - Fall 2012 3,720,000 2,677,566 1,750,000 1,100,000300,000 2008 2009 2010 2011 2012
    18. 18. Going Mobile:There are plenty of options and solutions to take your WordPress website mobile— many are free.
    19. 19. Key Considerations for Mobile Sites• Who comprises your audience? (geographically, demographically)• Focus on important content to offer on mobile• Remove clutter & simplify (when in doubt, leave it out)• Consider desktop plugins + how theyll work (or wont)• What is your budget?
    20. 20. Solutions for Delivering MobileVersions of Your WordPress Website: Mobile Themes & Plugins
    21. 21. Free ToolsAvailable• WPtouch (Pro)• WordPress Mobile Pack• Wapple Architect Wapple• WP Mobile Detector• Mobify• DotMobi• Carrington (Mobile Edition)• Möbius Mobify WPto uch Pro• And more...
    22. 22. WPtouch Pro• Pro versionof the popular free mobile plugin for WordPress• Not particularly designed for any one type of site, generally handles most very well• Easy to setup and use (even just activating it is a good start!)• Works by detecting devices, and serving its mobile theme• Pro version offers significantly more control, customization, good for client sites• Pro version supports iPad and serves another theme
    23. 23. Mobify• Works by proxy server— requests get sent to Mobifys servers and it handles the serving of the mobile views on your site automatically• Limited free plugin for WordPress paid service is pricey, but very good• High-end clientele— if you have a large business or organization website or client, this is a good option
    24. 24. Key Considerations Choosing a Mobile Theme/Plugin• Type of website (blog, company, video, audio, photo, etc)• Device support• Speed• Customization & control• Ease of use, intuitive design• Content, theme curation and maintenance• Web-app, native app capabilities
    25. 25. Alternatives: Desktop Themes + Responsive Design
    26. 26. What Is Responsive Design? A method of designing websites so that content flexibly adapts to different screen sizes.Includes re-organizing content on webpages and/or removing or adding elements as necessary when screen sizes change.
    27. 27. Responsive Design Strengths— Carries branding from desktop to mobile— When done right, the results are impressive— Designed to handle different screen sizes & devices— Dev community is generally behind this direction, thatall sites should consider the responsive approach— More and more themes are including responsivecomponents, most good ones are premium though
    28. 28. Responsive Design Weaknesses— All desktop resources are sent, whether needed or not(slower)— Changes to theme require more development time— Usually no user choice; theyre forced in this view— May not be the best choice for WordPress, specifically,because WordPress users change plugins, update themes, etc.— Can be expensive in development, often requiresmaintenance contracts
    29. 29. Emerging Beliefs With Increasing Mobile-Only Web Usage"Don’t build for mobile based onyour website. Build for mobile as if websites never existed in the first place. Build for the person who has never used a desktop computer." ~ MG Siegler, TechCrunch Columnist
    30. 30. Takeaways...
    31. 31. Summary• Mobile web browsing has exploded in the past 5 years• Great tools available to publish via mobile• Most mobile visitors expect tailored content• Data shows mobile WebKit is still leading the browser pack• Can use mobile theme/plugins to offer mobile versions quickly and easily, often for free or a small fee• Responsive Design is also a viable method, but can be more expensive, time consuming and difficult to maintain
    32. 32. Thank you. Dale Mugford :: BraveNewCode Inc.@bravenewcode | @dalemugford | bravenewcode.com

    ×