Metro - Changing the Paradigm with Swipe

Lightening talk given at the WordPress VIP Developer Conference in Napa Valley May 2013.

Transcript

1. CHANGING THE PARADIGM WITH SWIPE
2. Metro.co.uk Swipe Editions 1 David Jensen (@elgrom) Head of Development Metro (metro.co.uk) UK’s third largest daily newspaper Migrated to VIP last December WHO AM I?
3. Metro.co.uk Swipe Editions 2 CSS transition that mimics the horizontal browsing animation commonly seen in apps. WHAT IS SWIPE
4. Metro.co.uk Swipe Editions 3 53% of readers of our tablet app that read past the 3rd page go on to complete the whole edition WHY SWIPE?
5. Metro.co.uk Swipe Editions 4 A set of posts that have been generated from the content we have on our category pages We saw much higher engagement when we moved from homepage only to one per category WHAT DO YOU SWIPE THROUGH?
6. Metro.co.uk Swipe Editions 5 HOW WE BUILT SWIPE Check browsers support for History API Initial content loads into the centre of three divs Next and previous pages are loaded via ajax into divs either side Older browsers gracefully degrade to work like a traditional site https://github.com/stephanfowler/responsive-swipe
7. Metro.co.uk Swipe Editions 6 As there is only one page we need to constantly adjust the height of adjacent divs to allow the swipe action to come in at the top of the next page CHALLENGES
8. Creating a single page Web App is exponentially more difficult than a traditional website Some third party JavaScript libraries don’t support refreshing due to Document Ready having already fired e.g. DFP Ad Words Cross browser support is patchy, Firefox has given us a lot of issues as has the stock Android Browser so we have had to disable swipe for both. Metro.co.uk Swipe Editions 7 CHALLENGES CONTINUED
9. Getting people to understand that you can swipe on a web page has been an ongoing challenge. Relevant content either side is key to this Metro.co.uk Swipe Editions 8 CHANGING THE PARADIGM
10. Metro.co.uk Swipe Editions 9 Average Page Views / Visit are 200% higher for swipe users Roughly 13% of our Page Views are now delivered by a swipe action Almost 7% of unique users are now engaging in some form of swipe action STATISTICS
11. Metro.co.uk Swipe Editions 10 Swipe or scroll? THE FUTURE?
12. Metro.co.uk Swipe Editions 11 Metro’s weekly unique mobile traffic growth since 2011 THE FUTURE IS RESPONSIVE 0 200,000 400,000 600,000 800,000 1,000,000 1,200,000 1,400,000 Feb 28, 2011 Mar 21, 2011 Apr 11, 2011 May 2, 2011 May 23, 2011 Jun 13, 2011 Jul 4, 2011 Jul 25, 2011 Aug 15, 2011 Sep 5, 2011 Sep 26, 2011 Oct 17, 2011 Nov 7, 2011 Nov 28, 2011 Dec 19, 2011 Jan 9, 2012 Jan 30, 2012 Feb 20, 2012 Mar 12, 2012 Apr 2, 2012 Apr 23, 2012 May 14, 2012 Jun 4, 2012 Jun 25, 2012 Jul 16, 2012 Aug 6, 2012 Aug 27, 2012 Sep 17, 2012 Oct 8, 2012 Oct 29, 2012 Nov 19, 2012 Dec 10, 2012 Dec 31, 2012 Jan 21, 2013 Feb 11, 2013 Mar 4, 2013 Mar 25, 2013 Apr 15, 2013 Responsive Theme Launched
13. Metro.co.uk Swipe Editions 12 THANKS FOR LISTENING