Responsive Web Design for SharePoint 2013 & SharePoint 2010
Recently I was interviewed by David Rubinstein of BZ Media regarding Responsive Web Design and SharePoint. If you do not know David, he is a great guy who you should meet at the next SPTechCon as he is the Event Organizer for SPTechCon held annually in San Francisco and Boston. Side note: PixelMill and I will be at SPTechCon this March 3rd-6th in San Francisco. Sign up before January 18th and save $400 and use the code “pixelmill” to save an additional $200.
Anyhow, back to the interview. David wanted to know more about Responsive Web Design and SharePoint. The conclusion he came to in his article, Going Mobile with SharePoint – Not so Fast was that SharePoint is not quite ready for mobile. I cannot disagree with David’s position and SharePoint 2010 and mobile had some major issues and although SharePoint 2013 includes Devices Channels, there are still holes that can be filled. In that regard, I and a few others are trying to help shore up certain aspects of SharePoint 2010 and SharePoint 2013 in regards to mobile.
Over the last few quarters I have been a big proponent of Responsive Web Design, and its parent theory Adaptive Design, to help provide an interface to SharePoint that is mobile friendly. With the release of the SharePoint 2013 Preview back in the middle of 2012 and then the subsequent release of SharePoint 2013 RTM a few months later we had the opportunity to see a new feature added to SharePoint 2013 to help with mobile interfaces, Device Channels. Device Channels look very promising for many users of SharePoint but with the need to create and maintain multiple interfaces for Device Channels to work well, and the fact that there are new mobile devices every month with different screen resolutions, Responsive Design still leads the pack in my opinion.
When I talked to David, I mentioned that Responsive Design and SharePoint (2010 and 2013) do not mix very well. There have been a few excellent examples of Responsive Design and SharePoint 2010 though including www.its.ms.gov, ariensco.com and www.gse.it/en/, but in general I see that Responsive Design principles will be difficult for many developers to implement in SharePoint.
I am happy to announce my latest CodePlex project that I started with D’arce Hess (@DarceHess and Gilda Spencer (@gildaspencer) to help solve this problem of Responsive Design and SharePoint! We just launched Responsive SharePoint (responsivesharepoint.codeplex.com) which has the aim of converting popular responsive frameworks such as Twitter Bootstrap and Zurp Foundation 3 to SharePoint 2010 and SharePoint 2013. By converting I do not mean just adding links to the frameworks within SharePoint, rather as complete an integration as we can so that SharePoint components such as the ribbon, navigation (metadata driven navigation in SharePoint 2013), page layouts, etc work in a Responsive manner. We also provide sample page layouts that already include responsive containers and web part zones as well. The documentation we have provided is pretty intensive as well. The idea is that any developer could take one of these converted frameworks and begin building a Responsive site in SharePoint 2013 or SharePoint 2010 today. Not bad huh?
As of now we have released Twitter Bootstrap with SharePoint 2013 and we are about to release Bootstrap for SharePoint 2010. We are halfway through Foundation 3 and SharePoint 2013 as well, you can expect that in a few weeks. We are also looking for more developers that want to help us out. I know there are pluses and minuses to each framework so if you have another framework that you want to convert to SharePoint, we would like to work with you so as to increase the CodePlex offering.
Download the CodePlex package and tell me what you think!