Top Tips For Branding Share Point

WHITE PAPER
BRANDING SHAREPOINT 2007

BRIGHTSTARR LIMITED
Author: William Saville
Date: 17th June 2009
BrightStarr Limited, The Old Dairy, Peper Harow Park, Godalming, Surrey, GU8 6BQ
|t: +44 (0)1483 239240 | f: +44 (0)1483 239249 l e: info@brightstarr.com
Registered in England Company No: 05654147
Contents
Summary ........................................................................................................................................... 3
Platform differences and effects on UI............................................................................................... 3
Branding Development Techniques ................................................................................................... 3
Themes ......................................................................................................................................... 3
Master Pages ................................................................................................................................. 4
Page layouts .................................................................................................................................. 4
SharePoint User Interface General observations ................................................................................ 4
Top five tips for developing a branded interface in SharePoint 2007 .............................................. 4
Deploying custom branding using the feature framework.................................................................. 5
Uploading Branding Elements ........................................................................................................ 5
Applying Branding ......................................................................................................................... 5
Feature Stapling ............................................................................................................................ 5
Packaging Features into Solutions .................................................................................................. 5
Recommendations for a successful SharePoint UI project .................................................................. 5
Understanding the portal .............................................................................................................. 5
User Centred Design ...................................................................................................................... 6
Ensure the design is functional ...................................................................................................... 6
Prototyping ................................................................................................................................... 6
Appendix 1 How SharePoint renders a page ...................................................................................... 8
Appendix 2: User Centred Model identifying areas for consideration when extending SharePoint User
Interface............................................................................................................................................ 9
Summary
This paper discusses the issues around changing the user interface in SharePoint 2007. It outlines
the different ways in which SharePoint can be rebranded and some of the techniques that can be
used. It suggests best practice methods for deploying a new interface to SharePoint and finally
makes some helpful recommendations for a successful SharePoint User Interface (UI) Project.
Platform differences and effects on UI

SharePoint 2007 is available in two different versions; Windows SharePoint Server (WSS) 3.0 which
ships with Windows server and Microsoft Office SharePoint Server (MOSS) 2007. There are technical
considerations that should be taken into account for each version.
In terms of branding the biggest difference between the two versions is the publishing infrastructure
available in MOSS 2007.
Publishing is provided in MOSS to enable Web Content Management and advanced branding
features that enable users to change the user interface in a variety of different ways.
Although WSS has no functionality in the web application to access these features the hooks are still
present in the API and can therefore be built to enable some of the publishing feature.
WSS, out-of-the-box, has no concept of page layouts. This means it is not suitable as a content
management tool without a fair amount of custom development.
Branding Development Techniques

SharePoint separates content from presentation and it’s therefore possible to rebrand SharePoint
completely using standard web development techniques. SharePoint uses the following languages
to create a presentation layer:
 HTML
 CSS
 JavaScript
 XSL
Themes
Themes are the most basic form of SharePoint UI customisation and are effectively CSS files that are
stored on the Web Front End server. Their limitations are as follows:
 Screen colours only should be changed using a theme. It’s not recommended to
fundamentally change page layout via the CSS.
 Themes have to be situated in each individual sub-site and therefore there is no concept of a
child site inheriting the theme of a parent which in some cases can be limiting.
 There are certain issues within SharePoint around updating themes; the major problem
being that to update a custom theme you have to reapply it. You would have to reapply it on
every site that uses your custom theme. The reason for this is that when you apply a theme
in SharePoint a copy of that theme is then added to the content database and the only way
to update it is to reapply it.
Master Pages
Master pages are the main templates which control the common look and feel across an entire
SharePoint portal. Every SharePoint portal uses a combination of Master pages in different areas as
follows:
 Site Master page – this is used on all front end web pages with a SharePoint portal
 System Master page –used on list and document library web pages
 Application Master page – used on all site setting web pages
 MySite Master page – used on an individual’s MySite
Whilst all of these master pages can be customised and branded, caution should be taken when
attempting to customise the Application master page and the MySite master page. Achieving
customisation of these master pages requires the development of SharePoint features to set them in
the application programmatically. The site master page and system master page are configurable in
the web application when the publishing feature is activated. Only the site master page is
configurable without the use of a SharePoint feature in WSS 3.0
Page layouts
Page layouts are a concept used in the publishing infrastructure in Moss 2007. They enable users to
select a layout when creating a new page in a portal. When creating page layouts it is possible to
use page fields which are stored in the SharePoint page library with the page. This means that page
content is effectively stored in the SharePoint list itself rather than within the contents of a content
editor web part for example. This is the fundamental way that MOSS 2007 manages content in a
WCM and ensures a consistent branded experience in a publishing portal.
SharePoint User Interface General observations

The GUI in SharePoint 2007 is essentially rendered HTML and CSS, which is used on every website. It
uses a table-based approach to layout and has a complex way of rendering a single webpage. Due to
the dynamic nature of SharePoint, single web pages can be very heavy and contain a large amount of
JavaScript; however the overall weight of a page is largely affected by the context of the portal and
its functional requirements.
Top five tips for developing a branded interface in SharePoint 2007

1. Understand the portal context
2. Don’t mix divs and tables for page layout; it will break somewhere and eventually drive you
to insanity
3. Don’t remove any controls on the master pages, hide them in an ASP panel if necessary
4. Only use themes where basic branding is required
5. Consider creating a CSS framework for SharePoint including a reset CSS. (Don’t use standard
CSS frameworks like BluePrint, they will cause all sorts of bugs)
Deploying custom branding using the feature framework

The SharePoint feature framework and solution framework allow for the easy deployment and
application of custom branding to both WSS V3 and MOSS 2007.
Uploading Branding Elements

Branding resources can be deployed as physical files within the 12 Hive or uploaded into SharePoint.
When utilising features the uploaded branding resources remain ghosted to their relevant files
within the 12 Hive giving a performance gain over uploading these files manually.
Applying Branding
Features can be used to apply the correct settings that tell SharePoint what branding files to utilise.
This is especially useful in WSS 3 based deployments as there is no way to achieve this through the
standard UI.
Feature Stapling
Feature Stapling allows the attachment of feature activations on site creation without the need to
modify the Site Definition. This provides a powerful way of controlling the branding across a
SharePoint farm.
Packaging Features into Solutions

By using the Solution framework to package features and branding resources into single, easily
deployable solution files allows for the easy deployment to both a standalone server and a farm
environment. The advantage within a farm environment is that when a new web front end is
attached to the farm it will automatically fetch the installed solutions it needs from the existing
servers in the farm.
Recommendations for a successful SharePoint UI project
Understanding the portal

There are a number of considerations that must be taken into account before a best approach can
be recommended for rebranding SharePoint. It’s important to understand what the overall goals
and objectives of the portal will be as well as understanding who will be using the portal. Typically
SharePoint portals will fall into the following categories and a different approach should be taken in
each case:
 Public Facing Website
 Information portal
 Collaboration portal
User Centred Design

The information and evidence gathered as a part of a user centred design process can be used to
determine the best approach for branding a SharePoint portal.
User centred design is a development approach that balances user needs and preferences alongside
business requirements. UCD includes the end customer or user at every stage in the project. It
generally involves:
Requirements gathering - User needs analysis, market insights and business data are
brought together at the beginning of the project as a starting point for design and
development. User workshops, brain storming sessions and use other diagnostic tools to
ensure requirements are teased out.
Information architecture (IA) - a site structure is mapped out which supports the natural
journeys and requirements of users. Our approach is based on established principles for user
experience design and a real world understanding of how people use digital environments.
Ensure the design is functional

The dynamic nature of SharePoint invariably means that most portals allow users to interact with it,
complete user tasks and operations. It is therefore important that any design created is functional
by nature. Designers and developers should bear the following guidelines in mind when creating
branded environments for SharePoint portals:
1. Consider the portal’s goal.

2. Consider the user base.
3. Consider what the audience intends to do with it.
4. Is it engaging to your users?
5. Does it make good use of screen space
Prototyping
Prototype testing early in the design process allows concepts to be validated, and usability problems
to be dealt with, before entering into the more expensive later phases of design and build.
Appendix 1 How SharePoint renders a page
Appendix 2: User Centred Model identifying areas for consideration
when extending SharePoint User Interface

Top Tips For Branding Share Point

Загружено:

Сведения о документе

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Top Tips For Branding Share Point

Загружено:

Авторское право:

Доступные форматы

WHITE PAPER

BRANDING SHAREPOINT 2007

Author: William Saville

Date: 17th June 2009

Platform differences and effects on UI

Branding Development Techniques

SharePoint User Interface General observations

Top five tips for developing a branded interface in SharePoint 2007

Deploying custom branding using the feature framework

Uploading Branding Elements

Packaging Features into Solutions

Recommendations for a successful SharePoint UI project

Understanding the portal

User Centred Design

Ensure the design is functional

1. Consider the portal’s goal.

Вам также может понравиться