• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Responsive Design For Publishers: What it takes to make Mobile-Friendly, Future-Friendly Websites.
 

Responsive Design For Publishers: What it takes to make Mobile-Friendly, Future-Friendly Websites.

on

  • 3,473 views

Responsive Design alone doesn't create great mobile experiences. We need to combine other ideas together to make mobile friendly, future friendly websites. This "code free" presentation outlines how ...

Responsive Design alone doesn't create great mobile experiences. We need to combine other ideas together to make mobile friendly, future friendly websites. This "code free" presentation outlines how ideas like mobile first, progressive enhancement, Structured Content, and Performance budgets are all important components for building websites that support current devices along with future ones.

---
Originally Presented at Magnet 2013 - Canadian Magazine Publisher's Conference. "Responsive Design - One website for Many Devices"
---

Video recording of the session: http://www.slideshare.net/afoster0/responsive-design-for-publishers-what-it-takes-to-get-mobile-friendly-future-friendly

Statistics

Views

Total Views
3,473
Views on SlideShare
994
Embed Views
2,479

Actions

Likes
5
Downloads
0
Comments
0

5 Embeds 2,479

http://responsivedesign.ca 2405
http://sharingroom.spade.be 52
https://twitter.com 10
http://www.responsivedesign.ca 10
http://translate.googleusercontent.com 2

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

    Responsive Design For Publishers: What it takes to make Mobile-Friendly, Future-Friendly Websites. Responsive Design For Publishers: What it takes to make Mobile-Friendly, Future-Friendly Websites. Presentation Transcript

    • magnet.magazinescanada.ca | @MagNetCanada | #MagNet13@finteractivelinkedin.responsivedesign.caDG6: Responsive DesignOne Website for Many DevicesAidan Foster - Project Manager & Responsive Design SpecialistFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveWHY MOBILE?WHY RESPONSIVE?Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivesource: comScore 2013 - “Canada Digital Future In Focus”Canadian Internet UsageFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivesource: comScore 2013 - “Canada Digital Future In Focus”Canadian Internet UsageFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivesource: comScore 2013 - “Canada Digital Future In Focus”Canadian Internet UsageAvg 41.3 hrs / month#2 world wideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivesource: comScore 2013 - “Canada Digital Future In Focus”Canadian Internet UsageAvg 3731 pages / month#1 World WideAvg 41.3 hrs / month#2 world wideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveSales: Q1 2013 vs Q1 2012Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveIDC - http://www.idc.com/getdoc.jsp?containerId=prUS24065413#Global PCshipments-18.3%Sales: Q1 2013 vs Q1 2012Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveGlobaliPhone Sales+29%IDC - http://www.idc.com/getdoc.jsp?containerId=prUS24065413#Global PCshipments-18.3%Sales: Q1 2013 vs Q1 2012statista - http://www.statista.com/statistics/12743/worldwide-apple-iphone-sales-since-3rd-quarter-2007/Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivesource: comScore Q1 2013 - “Mobile Future In Focus”Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive1 in 3 minutes Spent Onlineis on a Mobile Devicesource: comScore Q1 2013 - “Mobile Future In Focus”37%63%Desktop MobileFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive“Mobile-Only” Internet Access (US)source: Harvard Business Review / PEW Research 2012http://blogs.hbr.org/cs/2013/05/the_rise_of_the_mobile-only_us.htmlAccess Cellular Internet (All)Primarily Use Mobile (All)Primarily Use Mobile (18-34)30% 60%45%34%55%Friday, June 7, 2013
    • Multi Device Usagesource: http://www.google.com/think/research-studies/the-new-multi-screen-world-study.htmlFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive?Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveNative AppsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveNative AppsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProsChimeNew ContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProsChimeNew ContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProsChimeNew ContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveConsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive$$$ConsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive$$$ $$$Cons$$$Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive<www>?Native AppsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractive<www>?Native AppsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivem.website.comDedicated Mobile SitesFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITE<Safari 6.1 on OSX>Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITE<Safari 5 on iOS>Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITEFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveServer SideDESKTOPSITEMOBILESITE<IE 11 on XBOX ONE???>?Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivePros: Dedicated MobileCan have a highly optimized UIPerformancerelated: http://www.queness.com/post/13899/which-is-better-dedicated-or-responsive-mobile-designaFriday, June 7, 2013
    • ConsBad for SEO: GoogleDoesn’t like multipleduplicated contenthttp://wtfmobileweb.com/Content Parity withDesktop can be hardCost (multiple sites)Friday, June 7, 2013
    • ConsBad for SEO: GoogleDoesn’t like multipleduplicated contenthttp://wtfmobileweb.com/Content Parity withDesktop can be hardCost (multiple sites)Friday, June 7, 2013
    • Responsive DesignBostonglobe.comFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEDEVICE CHOOSESBEST LAYOUTALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive DesignFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive Design“Default” ApproachLeast expensive way tosupport more devicesFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMOBILE FRIENDLYFUTURE FRIENDLYFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveHOW DO WEBUILD FOR THEFUTURE?Friday, June 7, 2013
    • RESPONSIVEDESIGNFriday, June 7, 2013
    • RESPONSIVEDESIGNPROGRESSIVEENHANCEMENT(coding structure)Friday, June 7, 2013
    • RESPONSIVEDESIGNPROGRESSIVEENHANCEMENT(coding structure)MOBILE FIRST(design strategy)Friday, June 7, 2013
    • RESPONSIVEDESIGNPROGRESSIVEENHANCEMENT(coding structure)MOBILE FIRST(design strategy)CONTENT STRATEGY(structured content)Friday, June 7, 2013
    • RESPONSIVEDESIGNPROGRESSIVEENHANCEMENT(coding structure)MOBILE FIRST(design strategy)CONTENT STRATEGY(structured content)PERFORMANCE BUDGET(core value)Friday, June 7, 2013
    • RESPONSIVEDESIGNPROGRESSIVEENHANCEMENT(coding structure)MOBILE FIRST(design strategy)CONTENT STRATEGY(structured content)PERFORMANCE BUDGET(core value)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivePROGRESSIVEENHANCEMENT(coding structure)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEDEVICE CHOOSESBEST LAYOUTALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIASHARED LAYOUTSTEXT CONTENTFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIASHARED LAYOUTSTEXT CONTENTDEVICE CHOOSESBEST LAYOUTFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveResponsive: Client SideWEB SITEALL LAYOUTSALL MEDIASHARED LAYOUTSTEXT CONTENTDETECT FEATURESDEVICE CHOOSESBEST LAYOUTFriday, June 7, 2013
    • Responsive: Client SideWEB SITEALL LAYOUTSALL MEDIASHARED LAYOUTSTEXT CONTENTDETECT FEATURESDEVICE CHOOSESBEST LAYOUTFriday, June 7, 2013
    • Responsive: Client SideSITEBig PicturesSmall PicturesTouch Controlsxbox styledlayoutYOUTSMEDIALAYOUTSONTENTDETECT FEATURESBig PicturesLOAD ONLYWHAT’S NEEDEDDEVICE CHOOSESBEST LAYOUTFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveProgressive EnhancementExample: Slide Showhttp://abitgone.github.io/jQuery-Plugins/Carousel/Friday, June 7, 2013
    • Old Blackberry:(No Javascript)Basic ExperienceSmall ImagesFriday, June 7, 2013
    • Large ImagesEnhanced w/ AnimationExtra UI ElementsFriday, June 7, 2013
    • Large ImagesEnhanced w/ AnimationExtra UI ElementsFriday, June 7, 2013
    • Add Touch / SwipeRetina ImagesFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMOBILE FIRST(design strategy)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMobile First - Design Strategyhttp://abookapart.com/products/mobile-firstvideo (60min) https://vimeo.com/64313805Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOAL(Task / Content)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOAL(Task / Content)ClutteredUIFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOAL(Task / Content)ClutteredUIMultipleStepsSiftingContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOAL(Task / Content)ClutteredUIMultipleStepsSiftingContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMY GOAL(Task / Content)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMY GOAL(Task / Content)ClutteredUIFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMY GOAL(Task / Content)ClutteredUIMultipleStepsSiftingContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMY GOAL(Task / Content)ClutteredUIMultipleStepsSiftingContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOALFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOALClean UI Tasks IdentifiedFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveUSER GOALClean UI Tasks IdentifiedFriday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveCONTENT STRATEGY(structured content)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMobile DesignDesktop DesignFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMobile DesignDesktop DesignContent FirstDesignFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured ContentFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStructured Content1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivehttps://vimeo.com/47171001#at=0http://responsivedesignworkflow.com/Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivehttp://karenmcgrane.com/2012/09/04/adapting-ourselves-to-adaptive-content-video-slides-and-transcript-oh-my/http://www.abookapart.com/products/content-strategy-for-mobileFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivePERFORMANCE BUDGET(core value)Friday, June 7, 2013
    • Page Load TimeSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1Seconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1Seconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1 InstantSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1 InstantFreely MovingSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1 InstantFreely MovingMind WandersSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1 InstantFreely MovingMind WandersNo Longer Able to Focus on TaskSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • Page Load Time0 2 4 6 8 1010410.1 InstantFreely MovingMind WandersNo Longer Able to Focus on TaskSeconds“Breaking the 1000ms Time to Glass Mobile Barrier” http://www.youtube.com/watch?v=Il4swGfTOSMFriday, June 7, 2013
    • http://www.gomez.com/thank-you/what-users-want-from-mobile-infographic(2011 Stats)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivehttp://gigaom.com/2012/05/23/the-growing-epidemic-of-page-bloat/Website Obesity Is GrowingFriday, June 7, 2013
    • Friday, June 7, 2013
    • PICK APERFORMANCEBENCHMARKFriday, June 7, 2013
    • PICK APERFORMANCEBENCHMARK3G 3-4sFriday, June 7, 2013
    • Performance BudgetFriday, June 7, 2013
    • Performance BudgetTotal File SizeNumber of AssetsFriday, June 7, 2013
    • Performance BudgetTotal File SizeNumber of AssetsCash in AccountFriday, June 7, 2013
    • Performance BudgetTotal File SizeNumber of AssetsCash in Account# of TransactionsFriday, June 7, 2013
    • Performance BudgetTotal File SizeNumber of AssetsCash in Account# of Transactions(Horrible extrafees over limit)Friday, June 7, 2013
    • CHEAP EXPENSIVEFriday, June 7, 2013
    • CHEAPTextEXPENSIVESmall ImageVideo(no auto-play)Friday, June 7, 2013
    • CHEAPTextEXPENSIVESmall ImageBig ImageLots of SmallImages3rd party WidgitsVideo(no auto-play)Friday, June 7, 2013
    • Don’t Spend Your Budget onLow Priority ContentFriday, June 7, 2013
    • Don’t Spend Your Budget onLow Priority ContentFriday, June 7, 2013
    • Don’t Spend Your Budget onLow Priority Content$$$$Friday, June 7, 2013
    • Don’t Spend Your Budget onLow Priority Content$$$$$ $ $Friday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority Content$$$$$ $ $Friday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority Content$$$$$ $ $Friday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority Content$$$$$ $ $Friday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority ContentFriday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority ContentFriday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority Content$$$$Friday, June 7, 2013
    • 1. Navigation2. News / Products(2-3 products w/ call to action)3. Promoted Content(New Pricing, New Series,Download APP)4. Wishlist: Products5. Account Functions6. Social FollowDon’t Spend Your Budget onLow Priority Content$$$$Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveNot Just a Development ProblemDesigners Control theDeveloper’s RequirementsFriday, June 7, 2013
    • 12sDon’t Ignore the budget! (Fix the design)Friday, June 7, 2013
    • 12sDon’t Ignore the budget! (Fix the design)Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractivePROCESSFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveStrategies For Implementationhttp://implementingresponsivedesign.comVideo (5 min) http://www.youtube.com/watch?v=fd_T8i0uQ2QFriday, June 7, 2013
    • Conventional “Waterfall” WorkflowFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchConventional “Waterfall” WorkflowFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchSite Architect / Project ManagerFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchSite Architect / Project ManagerFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchSite Architect / Project ManagerFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchUX / Design TeamFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchUX / Design TeamFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchUX / Design TeamFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchUX / Design TeamFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchUX / Design TeamFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchDevelopers / QAFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchDevelopers / QAFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchDevelopers / QAFriday, June 7, 2013
    • DiscoveryVisual DesignCodingLaunchConventional “Waterfall” WorkflowFriday, June 7, 2013
    • Friday, June 7, 2013
    • Friday, June 7, 2013
    • HomeFriday, June 7, 2013
    • HomeCase StudyFriday, June 7, 2013
    • HomeCase StudyBlog ListFriday, June 7, 2013
    • HomeCase StudyBlog ListBlog PostFriday, June 7, 2013
    • HomeCase StudyBlog ListBlog PostResourcesFriday, June 7, 2013
    • Friday, June 7, 2013
    • Let’s Make that shadeof blue a bit darkerFriday, June 7, 2013
    • Let’s Make that shadeof blue a bit darker$!@&$@#!Friday, June 7, 2013
    • TIME.COM Responsive RedesignFriday, June 7, 2013
    • TIME.COM Responsive Redesign200+ PS CompsFriday, June 7, 2013
    • TIME.COM Responsive Redesign200+ PS CompsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveTIME.COM Responsive Redesignhttp://www.youtube.com/watch?v=X7YZXgGs6oA&list=PLAcXjRKDmFScQ6LdW_oDvcnvMGgweMRd3Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveDesign 1-2 pages“Just enough to get to code”Friday, June 7, 2013
    • Friday, June 7, 2013
    • DiscoveryLaunchFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReviewFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReviewFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReviewFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReviewFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • DiscoveryVisual Design CodingLaunchReview1. Navigation2. News / Products(2-3 products w/ call toaction)3. Promoted Content(New Pricing, NewSeries, Download APP)4. Wishlist: Products5. Account Functions6. Social FollowFriday, June 7, 2013
    • Get Team’s Feedback on real devicesFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveAgile Software DevelopmentVideo (15 min)http://www.youtube.com/watch?v=502ILHjX9EE&list=FLJrbylC1-rtzJ1emF8EsNwAFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMany Smaller IterationsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveBreak Down SilosMany Smaller IterationsFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveBreak Down SilosMany Smaller IterationsDeliverables will not be “perfect”Friday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveI UNDERSTAND THESE PROCESSCHANGES ARE A LOT TO TAKE INIT WAS HARD FOR ME TOOFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveLet’s Wrap it upFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveCoder’s have it easyFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveDesign(ers) Need to ChangeFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveAbandoning 20 years of websitepublishing practices is not easyFriday, June 7, 2013
    • magnet.magazinescanada.ca @MagNetCanada #MagNet13aidan foster - @finteractiveMost difficult changes areorganizational - Stakeholders &Management TeamsAbandoning 20 years of websitepublishing practices is not easyFriday, June 7, 2013
    • Weekday SundayUS News Distribution Oct 2012-April 2013Friday, June 7, 2013
    • -1.4%-0.7%0%Weekday SundayUS News Distribution Oct 2012-April 2013Friday, June 7, 2013
    • -1.4%-0.7%0%-0.7%Weekday SundayUS News Distribution Oct 2012-April 2013Friday, June 7, 2013
    • -1.4%-0.7%0%-0.7%-1.4%Weekday SundayUS News Distribution Oct 2012-April 2013Friday, June 7, 2013
    • Weekday circulation April 2012-April 2013Print Digital TotalFriday, June 7, 2013
    • -20%-10%0%10%20%30%40%50%Weekday circulation April 2012-April 2013Print Digital TotalFriday, June 7, 2013
    • -20%-10%0%10%20%30%40%50%-13%Weekday circulation April 2012-April 2013Print Digital TotalFriday, June 7, 2013
    • -20%-10%0%10%20%30%40%50%-13%45%Weekday circulation April 2012-April 2013Print Digital TotalFriday, June 7, 2013
    • -20%-10%0%10%20%30%40%50%-13%45%8.9%Weekday circulation April 2012-April 2013Print Digital TotalFriday, June 7, 2013
    • Friday, June 7, 2013
    • magnet.magazinescanada.ca | @MagNetCanada | #MagNet13@finteractivelinkedin.responsivedesign.caTHANK YOUQuestions?Friday, June 7, 2013
    • magnet.magazinescanada.ca | @MagNetCanada | #MagNet13@finteractivelinkedin.responsivedesign.caTHANK YOUQuestions?(In case something comes up later...)Friday, June 7, 2013