mobility: development strategies in sharepoint 2013
DESCRIPTION
SharePoint 2013: Why Mobile Friendly Options in SharePoint 2010 SharePoint 2013 Features Limitations EnhancementsTRANSCRIPT
![Page 1: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/1.jpg)
Mobility: Development Strategies in SharePoint 2013
![Page 2: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/2.jpg)
Amol AjgaonkarSr. Technical Architect
• Working in SharePoint since 2003• WCM / ECM • Focus: Custom Development / Tech.
Design
Introduction
![Page 3: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/3.jpg)
Objective
• Why Mobile Friendly• Options in SharePoint 2010• SharePoint 2013 Features• Limitations• Enhancements
Mobility
![Page 4: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/4.jpg)
68 percent of smartphone users who use the Internet every day
25percent of smartphone users who use the Internet exclusively on their smartphone
4.6
percent of all Internet traffic that originates from smartphones
One in four Americans own a smartphone, a number that grew by 60% in 2011.
Source: 2011 Pew Internet Study
![Page 5: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/5.jpg)
Mobility
SharePoint 2010
![Page 6: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/6.jpg)
• Device ChannelsTarget different devices through user agents
• Master PagesAssign master pages to device channels
• Mobile Panels in Page LayoutsTarget content to device channels
• Image Renditions• Display Templates
Create content templates.
SharePoint 2013 Features
![Page 7: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/7.jpg)
Image Renditions
![Page 8: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/8.jpg)
Display Templates
• HTML Snippets with JavaScript
List Control Template(<ul>,<div,> etc.)
Group Control Template
Item Template (E.g. <li>, <div>…)
![Page 9: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/9.jpg)
Demo
• Device Channels• Image Renditions• Display Templates• Content Authoring (Catalogs)• Master Page Assignment
![Page 10: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/10.jpg)
Limitations / Issues
• Maintain user agent strings in Device Channels.
• No web part zones in Mobile Panels.• Authoring experience could be better.• OOTB web parts cannot target device
channels.
![Page 11: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/11.jpg)
Demo
• OOTB Content Authoring• Mobile Channel Panel with WP zones• Mobile Channel Panel w/o WP zones• Cannot target OOTB web parts to
channels
![Page 12: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/12.jpg)
• Custom Mobile Panel• Allow web part zones in Mobile
Panels• Better authoring experience• Tabbed content authoring.
• OOTB web parts targeting device channels.
Enhancements
![Page 13: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/13.jpg)
Demo
• Custom Mobile Channel Panel• Target OOTB Web Parts to Channels• Authoring experience using Tabs• jQuery and twitter bootstrap
framework
![Page 14: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/14.jpg)
Design considerations
• Responsive Design• Device Channels
![Page 15: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/15.jpg)
Responsive Design
Device Channels
Hybrid Approach
![Page 16: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/16.jpg)
• Define device channels.• Create master pages for different
channels.• Frameworks• jQuery mobile• Twitter Bootstrap
• Create display templates • Enhancements to overcome limitations.• Define images renditions• TEST, TEST, TEST
Process
Responsive Design + Device Channels = Better experience.
![Page 17: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/17.jpg)
Questions
![Page 18: Mobility: Development Strategies in SharePoint 2013](https://reader035.vdocuments.site/reader035/viewer/2022070301/546621a6af795969338b50e5/html5/thumbnails/18.jpg)
• Twitter: @SharePointLife
• Blog: http://bit.ly/sharepointblog
• Profile: www.amolajgaonkar.com /http://bit.ly/spamol
• Email: [email protected]
Thank You