Chapter 1: What is Sharepoint Branding?

Wrox SharePointR 2010 Branding and User Interface Design

Branding for SharePoint includes the creation of master pages, page layouts, Cascading Style Sheets (CSS), Web Parts, and eXtensible Stylesheet Language Transformations (XSLT).

Technically speaking, themes can be thought of as changes that are applied to the existing look and feel through the use of CSS. In SharePoint 2010, themes are created with the Microsoft Office client software (2007 and above), using either Word or PowerPoint to create .THMX files
that describe the 12 theme colors and two fonts available in the new SharePoint themes. Once created with Office, they can be loaded into SharePoint 2010 and applied to any site by site owners. Server version of SharePoint 2010 enables site owners to modify the themes — i.e., the colors and fonts — directly in the SharePoint Web user interface

Theme – comparable to paint the wall

Master page – comparable to alter the physical structure of the house

SharePoint comes with a few out-of-the-box master pages that can be used for website branding right away:

(1) v4.master: default master page that is used for many of the site templates
(2) nightandday.master: accessible only in a SharePoint Server 2010 site that has the Publishing Feature enabled.

(3) minimal.master: this master page is not intended to be the starting point for branding, as it lacks several common SharePoint controls.

3 main types of content pages:

(1) Publishing pages
(2) Web part pages
(3) Wiki pages

Publishing pages:

Publishing pages are available only in SharePoint Server 2010 on sites where the Publishing Feature is enabled. The Publishing Feature enables authors to (1) create pages that have an approval workflow so that (2) content can be reviewed and approved before being published.

Publishing pages are created by using page templates called page layouts. If master pages create the outer shell of a SharePoint page, then page layouts define the body of a page. They enable content authors to create pages that contain text, HTML, graphics, rich media, and more.

Several out-of-the-box page layouts can be used right away in a SharePoint Server site, but also remember that designers and developers can always create their own custom page layouts.

The function of Web Part pages is fairly obvious by their name. They are pages that contain Web Part zones.

The word “wiki” is Hawaiian for quick. Wikis are a great way to collaborate with others on a project. They are also very useful for creating knowledge bases or other repositories for storing and sharing information.

CSS


CSS is pervasive in SharePoint branding. Almost every aspect of SharePoint is styled by CSS. All the SharePoint controls that are loaded by a master page are styled by CSS, as well as many Web Parts — even SharePoint themes apply to specially commented CSS fi les in SharePoint 2010. Because of the importance of CSS in SharePoint, a sound understanding of it is crucial to becoming skilled at branding in SharePoint.

CSS is longer just a designer’s tool! As a developer you need to be familiar with it too.

Unlike SharePoint 2007, which had essentially one large core CSS file that was loaded for each page, SharePoint 2010 splits its default CSS across several smaller CSS files that are loaded according to what controls are available on a given page; however, much of the main CSS for SharePoint still resides in one core CSS fi le named corev4.css.

Important: The intent of this new division of labor is to load only the CSS that’s necessary
to render a given page.

Advertisements
Post a comment or leave a trackback: Trackback URL.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: