Over the past several years more and more organizations are choosing to deploy public facing Internet sites using SharePoint 2010. Building on existing skills and experiences, designers and .NET developers can create amazing looking web sites, some of which can be seen here.
One question that comes up frequently is “what about mobile devices?” Organizations want to ensure that the sites they build can be viewed not only by desktop and laptop users but also on mobile devices such as phones and tablets. The answer to this question cannot be summed up in a single sentence or paragraph.
Out of the box SharePoint 2010 provides the ability to render mobile views of the default SharePoint templates. These mobile views are usually acceptable for an intranet or extranet deployment but they are not well suited for a public facing site. A blog post titled Configure SharePoint Server 2010 for Mobile Device Access written by the Microsoft Office product development group demonstrates the out of the box mobile rendering capabilities.
Just like any other project, the key to a successful implementation is planning. When building public facing SharePoint 2010 web sites you have complete flexibility in determining what HTML, style sheets and ECMAScript is used for rendering the site. A designer and developer can use basic web standards or they can utilize the latest HTML 5 constructs. Building a public facing web site with SharePoint that can be easily viewed on mobile devices requires a good understanding of mobile device capabilities, who your audience is, and what devices you wish to support.
Mobile devices such as the iPhone, iPad, Android and Windows Phone 7 have full feature-rich browsers that can render almost any content presented on the Internet today with the exception of plugins like Flash and Silverlight. There are also devices that have less featured browsers that would require a traditional mobile site in order for the user to have a positive experience.
Start your planning by evaluating why a user would be visiting your site with a mobile device and what content they would most likely be looking for. It is highly unlikely that every piece of content on a public facing site is important to mobile users. Chances are a mobile user will be looking for a specific piece of information such as directions, hours of operation, recent news, or weather conditions. The thought here is that a mobile user is just that… mobile. They are away from their home or office and they need to quickly view some information or accomplish a simple task using their mobile device. Mobile users are probably unlikely to be commenting on blogs, writing posts in a message forum, or trying to pay property taxes.
Once you have a good understanding or idea of why a mobile user would visit your site the next question should be who is visiting. Are you expecting adult visitors, teens, or children? Are they business professionals, home makers, or students? These questions will also help you determine the type of content and tasks you need to provide on your mobile site. If your site is primarily focused on teens having a mobile view of a message form or chat room may be necessary.
Now that you have determined who will be visiting your mobile site and what content they will be expecting, you now need to consider the likelihood of a specific mobile device viewing your site. Do you really need a specialized mobile only view or will the devices your visitors use have a full featured web browser? Do you expect visitors with older WAP only phones to be accessing the site or will the majority of your users be using a new Windows Phone 7?
While most focus on just the capabilities of the browser this may not be the most important factor. One must also consider the size of the screen. For example the iPhone and iPad have a very similar browser from a capabilities perspective but the experience of the user will be very different due to the screen size.
Example Planning Questions:
- Who is the audience?
- What information will they need or expect?
- How should the information be presented to this audience?
- What types of devices are likely to be used by the visitors?
- Touch screen or button navigation
- How will visitors navigate the site?
Once the planning process is complete and you have a good understanding of your audience, the information expected, how it should be presented and the devices you need to support, you can begin to design your solution. One possible option is that you are going to do nothing and your mobile visitors will just use the full version of your SharePoint 2010 internet web site. Another option is to create some form of a mobile only version of your site which caters to your expected visitors.
If you choose to create a mobile view of your SharePoint 2010 internet site you will next need to select one or more methods for building the site, and determine how a user will navigate it. As mentioned earlier SharePoint 2010 provides basic mobile views for lists and libraries, however, in most cases this would probably not be acceptable for a public facing site. Other options for building mobile sites include:
- Customizing the out of the box mobile home pages
- Creating mobile adapters for out of the box web parts
- Create custom field rendering controls for mobile pages
- Use SharePoint variations along with custom master pages and CSS for mobile devices
- Custom ASP.NET application that pulls content from SharePoint 2010
- Use a 3rd party solution to assist in the creation of SharePoint 2010 mobile sites
The mobile options listed above are not mutually exclusive. In many cases you will choose multiple approaches from the list to build out a complete SharePoint 2010 mobile site. Below we will briefly take a look at each of these options.
Customizing the out of the box mobile home pages
SharePoint 2010 has a mobile page rendering system that utilizes templates to determine how the header, contents and footer are displayed. By creating your own rendering templates you can change the default out of the box mobile home pages to meet your needs. For detailed information on how to customize the mobile home pages refer to the following MSDN article.
Creating mobile adapters for out of the box web parts
Many of the default SharePoint web parts have a basic mobile view that is displayed when a device accesses a mobile page. If you have your own custom web parts you will need to create a mobile adapter in order for them to properly display on a mobile page. For detailed information on how to create a mobile adapter refer to the following MSDN article.
Create custom field rendering controls for mobile pages
SharePoint 2010 allows developers to build custom field rendering controls for mobile pages. These custom field rendering controls gives the developer full control over how fields are displayed in the display, edit, and new forms of a list. For detailed information on how to create a custom field rendering control for mobile pages refer to the following MSDN article.
Use SharePoint variations along with custom master pages and CSS for mobile devices
A feature called Variations that was originally designed to enable multilingual sites could be used for managing a separate view for mobile devices. The Microsoft ECM Blog states “Variations is a SharePoint feature that facilitates the management and maintenance of content that can be served to multiple audiences. These audiences can vary in terms of different languages, countries, or regions, but they can also represent different brands or devices.” Using variations along with a custom mobile master page and CSS style could provide a mobile version of a public facing SharePoint site.
Custom ASP.NET application that pulls content from SharePoint 2010
Some organizations have decided to write a custom ASP.NET web application specifically for mobile devices. These web applications utilize the SharePoint 2010 server and/or client object model for retrieving content that will be rendered in the mobile view. This method of creating a mobile site is much more involved, but it does give a lot of flexibility in how the mobile site will render and function.
Use a 3rd party solution to assist in the creation of SharePoint 2010 mobile sites
There are multiple 3rd party solutions created by Microsoft partners that can be used to help build out mobile versions of public facing web sites. These solutions provide frameworks that can be used to build full featured mobile websites based upon content stored and managed in SharePoint 2010. One such solution is available from Mobile Entrée (see the additional references section below).
When designing your mobile website you will want to build a site navigation system that fits the capabilities of the devices your users are expected to use. Some mobile devices are touch screen and allow a person to navigate a web site just as if they were using a mouse on a desktop or laptop computer. Other mobile devices only have a series of arrow keys and a select button. These two different forms of navigation can have a significant impact on how you choose to design your mobile sites. Careful thought and planning is required here in order to ensure that all of your visitors have an enjoyable experience.
No matter which method you ultimately choose, you will need a way to get your mobile users to the mobile site. The most popular method is to perform browser detection on the main public URL of your web site and then redirect users with mobile browsers to the mobile specific site. Another option is to have a dedicated mobile URL that you can publish and market to your end users so they can directly access the mobile site easily. SharePoint 2010 provides a mechanism for identifying mobile browsers and performing the necessary redirections. Additional information on this feature can be found at http://msdn.microsoft.com/en-us/library/ms462572.aspx.
Planning is the key for any successful software development and implementation project. This holds very true for building mobile accessible web sites with SharePoint 2010. Ensure that you understand your users, the mobile devices they have, and their specific mobile information needs. Don’t try to be everything to everyone. Focus on key usage scenarios and build a site that is tailored to the person who is on the go.
Mobile Development with SharePoint Foundation
Mobile Development How Tos and Walkthroughs
Variations in SharePoint 2010