6.  A “new-ish” web design methodology  Addresses growing number of Internet devices  Tailored experience to any device  Limits resizing, panning and scrolling  The Key: All devices load the same page*

7. Progressive Enhancement Graceful Degradation Adaptive Web Design Responsive Web Design Desktop First Mobile First

11.  New to SharePoint 2013  Interfaces tailored and mapped to specific device(s)  Custom Master Pages per Channel  Custom DeviceChannelPanels  Yes, but?

14. A fluid grid

15. Flexible media  Flexible Images  Flexible Video  Proportional Text

18.  Build and code mobile interface first  Helps control some resources  Forces us to concentrate on content  *Caveats for IE8

20.  How will your navigation adapt to different viewports  Responsive navigation may require thought  Consider real estate required for navigation  Multi-level SP OOTB Navigation relies on hover

25.  What will be a part of the Master Page  How will Page Layout content be defined  How will you handle navigation?  Will you include the quick launch on all pages?

27. A HTML Prototype

28.  Pre-built responsive and fluid grids  Saves time and resources  Many includes extras  i.e. collapsing navigation

30. And so many more

33.  Distill page into Master Page and Page Layout(s)  Fix framework to work with SharePoint  Or use pre-converted RWD framework for SharePoint  Add SharePoint controls, snippets and navigation

36.  IE8- does not recognize CSS3 Media Queries  Will only load mobile view  Common fixes:  IE8- stylesheet  JavaScript Libraries such as CSS3 Media Queries  http://pxml.ly/zcw2jb2

39.  Use a prebuilt framework (SharePoint ready)  Set project budget, deliverables and expectations accordingly  Develop for the real world (will mobile users need to edit pages?)  Don’t break SharePoint!*  Mobile first (with caveats)  Be sure you are very comfortable with CSS/HTML  Test, and test, and test some more  Train content authors! RWD relies on groomed content.

42. Sponsored by