Modern Intranet Development Best Practices on SharePoint Online and Office 365

2. About Me
• Solution Principal, Slalom Consulting, Chicago
• Current focus area Office 365 and SharePoint Platforms
Contact Info
• Email - patenik2@yahoo.com
• Blog - Office 365 and SharePoint with Nik Patel -
http://nikpatel.net/
• Twitter - @nikxpatel
• LinkedIn - linkedin.com/in/nikspatel
• Slideshare - slideshare.net/patenik2

3. 







5. 


Communicate
Corporate Portal
Department Sites
Resource Centers
Context
Personalized,
Contextual, and
Relevant
Information
Collaborate
Team and Project
Sites
Internal and
External
Collaboration
Converse
Likes, Comments,
and Open
Communication
Convey
Design for Mobile
and Touch Friendly
Applying
Organization brand
– look and feel
Customize
Business
Processes
Automation
Content
Current and
Frequently Updated
Information
Able to find and
search content
easily

6. 

•
•
•
•
•
•
•

7. 











8.  https://www.nngroup.com/reports/topic/intranets/
Features and Trends
• Emphasis on organization brand
• Responsive design over stand-alone mobile apps
• Flat and boxy layouts, simple and clean design
• Visual design – photos and videos
• Spotlights & news on home page
• Better employee profile pages & personalized home pages
• Blogs by both executives and regular employees
• Emphasis on search
• Use of pre-defined page layouts
• Content curators and training for site managers
• Mega menus and fat footers
• Social comments and likes
• Multi-language support
Top 10 Sites Platforms
2016 – 7 SharePoint 2013, 1 Office 365
2015 – 4 SharePoint 2013, 1 SharePoint 2010
2014 – 4 SharePoint 2010, 2 SharePoint 2013
2013 – 7 SharePoint 2010
2011 – 5 SharePoint 2007

10. 













11. What’s it Good At
• Sites Hierarchies & Taxonomies
• Branding - Look and Feel Customizations
• Lists as Data Storage
• Document Library
• Web Parts Architecture
• Sites and Pages Templates Architecture
• Wiki Pages, Web Part Pages, and Publishing Pages
• Granular Permission Support
• In-Built Search Engine
• Sites and Permission Management Delegations
• Customizations and extensibility support with App Model
and APIs
What’s it Isn't Good At
• Social, Gamification
• Multi-Language Support
• Web Analytics and Usage Analytics
• Enterprise Video Streaming
• OOB Responsive Design Support
• Accessibility Support
• Mobility Support

13. 2013
Refresh (New)
Cold Fusion ->
SharePoint 2013 On-
Premises
2014
Divesture (New)
SharePoint Online 2013
2015
Refresh (New)
Cold Fusion -> SharePoint
2013 On-Premises
2012
Divesture (New)
SharePoint Online 2010

14. 










15. Architectural Details
Hosting Platform SharePoint Online 2010 (Initial version of Office 365)
Application Development
Frameworks
No full trust code, No CSOM across site collections, Apps Model wasn't even released, Sandbox with Code still
considered as best practice for the online.
Data Storage Architecture SharePoint Lists and Pages Library
Information Architecture
Site collections per department due to content size - client wanted to use both as collaboration team sites and
communication platform, designed root site collection for corporate home and other corporate applications like news
center & policy center but each department had dedicated site collections
Branding and Experience
Multiple master pages - search, my site, and intranet, no requirements for mobile & touch friendly, no requirements
or needs for responsive UI, there was no trend of responsive UI
Navigation SharePoint List in Root Site based navigation, used SP Services for cross-site data retrieval
Site Templates
Manual approach for creating department sites, save as site template doesn’t work publishing sites, no site
collection provisioning APIs available in SPO at that time.
Content Pages Templates
Custom publishing page layouts for events, news, and leadership message articles, Wiki pages for quick article
authoring. Web part pages for structured pages.
Custom Widgets Custom sandbox web parts for departments and custom content query web parts for home page
Rollups and Categorizations
Some of the features required rolling up news & events & leadership messages from departments. Content Query
web parts for root site collection rollups for news, Custom web parts using SPServices for cross-site collection rollups
for events, Search based rollups for forms & policies, used content type hub to standardize the content types
Code Packaging and
Deployment
No full trust but sandbox with code was still a best practice, used sandbox feature & solutions framework to package
up artifacts and deployed in site collection galleries - style library, content types, web parts etc.

16. Architectural Details
Hosting Platform SharePoint 2013 Online
Application Development
Frameworks
No full trust code, No CSOM across site collections, Apps Model wasn’t matured, used OOB features
Data Storage Architecture SharePoint Lists as data storage.
Information Architecture
Architecture was single site collection with root site and multiple department sub sites - client wanted separate
collaboration team sites from communication platform, designed root site for corporate home and other corporate
applications like news center & policy center and each department sites with dedicated permissions to delegate
permissions as sub sites
Branding and Experience
Created multiple master pages with supported device channels to support multiple form factors. Created application,
search, and my site master pages.
Navigation Managed metadata based navigation. Limited to single site collection.
Site Templates Manual approach to deploy site collections.
Content Pages Templates Custom page layouts for article pages.
Custom Widgets
Custom content query web parts. Couldn't write any custom code using CSOM C# since Sandbox with code wasn't
allowed instead used CSOM with JavaScript or REST API at places whenever data retrieval logic required.
Rollups and
Categorizations
Custom Content Query web parts for root site collection rollups for news, forms, and policies, Content Search web
parts wasn't available in SharePoint Online at that time
Code Packaging and
Deployment
No sandbox with code but sandbox with declarative was still supported, used sandbox feature & solutions framework
to package up artifacts and deployed in site collection galleries - style library, content types, web parts etc.

17. Architectural Details
Hosting Platform SharePoint 2013 On-Premises
Application Development
Frameworks
No full trust code, No Sandbox, both were supported but isn't a best practice for cloud readiness anymore.
Data Storage Architecture Used SharePoint lists as data storage, there was no need for SQL for complex data entities.
Information Architecture
Architecture was single site collection with root site and multiple department sub sites - designed root site for
corporate home and other corporate applications like news center and each department sites with dedicated
permissions to delegate permissions as sub sites
Branding and Experience Created custom master page with responsive UI, used Codeplex solution with Bootstrap
Navigation Used managed metadata based navigation due to single site collection architecture.
Site Templates Used custom site provisioning tool and deploy features necessary using Provider hosted model.
Content Pages Templates Used standard SharePoint publishing pages. Designed these pages as responsive.
Custom Widgets
Used content editor, script editor web parts to design widgets to show data from SharePoint lists – Major
benefit here is home page would be functional even if Search is down.
Rollups and Categorizations
Used content by search web parts to show rollup data - Major issue with this is rollup data view is delayed
due to search crawl lag time.
Code Packaging and
Deployment
Provider hosted high trust model used to deploy the artifacts as remote provisioning rather than feature-
solutions framework.

19. 









21. 


 On-Premises (Codeplex) Online (Office 365 PnP)











22. 










23. 













24. 













25. SharePoint
Online and
Office 365
As a Service
SharePoint
Online and
Office 365
As a Platform

26. Host Web
App Web
Add-in
Hosting Servers
CSS
png
aspx
master
js
Web Services
Databases
Office 365 and
SharePoint Online
• Design Intranet on SharePoint
Online Platform
• Use either Database or
SharePoint Lists as Data Storage
• Plan to use Office 365 workloads
in your intranet application in
addition to SharePoint Online
goodness - Delve, NextGen
Portals, Video/KM Portal
• Have Azure hosted Provider
hosted low-trust Add-ins as
customizations and deployment
framework.
• Plan to use content search and
script editor web parts rather than
App parts.
• Same URLs for both
administrative and end-user UI,
making maintenance quicker

27. Add-in
Hosting Servers
CSS
png
aspx
master
js
Web Services
Databases
Office 365 and
SharePoint Online
• Design Intranet as Standalone
ASP.NET MVC or other
development platforms
application.
• Use either Database or
SharePoint Lists as Data Storage
and SharePoint sites hierarchy
for sites architecture.
• Have Standalone application
using Azure AD Consent
framework to access Office 365
workloads (Yammer, Delve etc.)
and SharePoint Online data.
• Multiple URLs - SharePoint UI for
administrators (sites and lists
structure & content storage) and
standalone ASP.NET MVC
Intranet application

29. 






30. 















32. 





