Designing Responsive SharePoint site either Public internet facing or intranet is Complex one or easy . .
I feel now a days web desiging of your SharePoint application is playing important role for successful implementation .
Please sugggest pointers and any examples you have to start with responsive design for SharePoint.
Thanks in Advance.
Thanks Bastiaan for detailed information , it is very useful . Thanks Again ..
Best
M
Hi,
You can choose whatever you want of course, but our general best practice is creating a responsive Master Page for your publishing section on the intranet. Think of news, announcements, articles etc. The content that is ‘consumed’ is often required to be accecible on smaller devices.
For non-publishing sections like team sites but also system pages we use a non-publishing master that has the general custom styling but not the extra responsive markup that often clashes with OOTB SharePoint elements like calendars, task time line web parts, the term store setting screen etc.
So at the end you will have a:
1. publishing master page
2. non-publishing master page
Styling:
1. custom.css (for publishing master page and non-publishing master page)
2. responsive.css, media queries (for publishing master page)
3. non-responsive.css (for non-publishing master page)
Last but not least you have to tweak your Page Layouts for the responsive section to ‘behave’ responsive e.g.
<div class=”col-md-12″>
<div class=”col-md-6″>WEBPART ZONE</div>
<div class=”col-md-6″>WEBPART ZONE</div>
</div>
Hi Bastiaan ,
Thanks for reply . Are all pages convert into responsive site by using these codeplex fremework .
What about pages on Server (_layouts pages)
Hi,
I used this project multiple times in projects:
http://responsivesharepoint.codeplex.com/
This is for intranet sites. I made a short blog post about my experience implementing this:
http://bastiaanjacobs.nl/2014/01/30/sharepoint-2013-responsive-mpb-bootstrap/
Internet facing sites that use SharePoint as CMS can be created with the use of REST and OData especially Get.
For responsive design I see that a lot of people underestimate the behavior/customization for multiple resolutions and devices.
