BPC: Cathy Dew Answers the Question, ‘SharePoint Branding – Where Do You Even Begin?’

Cathy Dew presenting at #BPC10Cathy Dew, one of the founders of Women in SharePoint (with whom Bamboo Nation is proud to share media sponsorship responsibilities on behalf of the BPC), delivered the first of many SharePoint branding-centric sessions scheduled to take place at the conference this week.  As it was the first branding-related session, it centered, appropriately enough, Cathy focused on answering the question, "Where do you begin?"

Cathy explained that branding and design are terms that are used interchangeably, and that they're "concepts that go together," but clarified the point by saying that, "User-centered design is really what SharePoint branding is about."  Cathy said that not only should a site be visually pleasing and feature a usable UI, but that ultimately, even the success or failure of end user adoption is related to branding since, if a user leaves your site saying, "I'm never going there again," that represents, at least in part, a failure of branding.

Cathy said that when approaching branding, the first things you need to understand are the content and its intended audience.  "What is the one thing [users] need to walk away with" if they only see your home page, Cathy suggests, is a valuable question to ask in terms of beginning to understand the content and intended audience.  Cathy also said that an understanding of the site content will help you to plan your taxonomy.  For example, if content will reside in lists or libraries, you need to know if there are special branding considerations that will need to be taken into account as a result.  As well, you need to understand your navigation since "consistent navigation elements will give your end users a consistent experience."  As Cathy pointed out, these considerations are the "road map for your branding development."

By way of explaining how SharePoint branding works, Cathy showed an image of a target, with each of the concentric rings labeled to represent SharePoint branding.  In the bullseye was content (again, everything is centered around content), surrounded by functionality, the content design layer, and finally as the final wrapper, the site creation layer.

In discussing some of the changes in branding between 2007 and SharePoint 2010, Cathy said that there are three principal areas of change: themes, alternate CSS, and Master Pages.  Themes are now treated the same as other Office themes, and can be imported to SharePoint accordingly.  Themes change the colors and fonts of your site (but not placement of items), and a key improvement in 2010 themes is that you can now preview your theme prior to applying it to the site.  Alternate CSS allows you to extend the theme engine, and to "build and make grander changes than a theme will make."  Cathy pointed out that while 2010 allows you to use CSS for positioning, corresponding changes to the Master Page will still be required.  Ultimately, "you can change what styles are affected by the SharePoint theme engine by creating a custom CSS file."  Regarding Master Pages, Cathy explained them as allowing you to make global changes across your site from one location, and providing a consistent, streamlined navigational experience for end users.  New considerations with Master Pages in SharePoint 2010 that Cathy pointed out include the Ribbon, which given its position on pages throughout sites can affect header placement and, depending on the resolution your users have set, can take up a lot of real estate on their screen.  Another new consideration with Master Pages in SharePoint 2010 are dialogue boxes, which use the Master Page … for example, custom CSS will be required if you don't want your header pulled into those dialogue boxes.

In choosing your options in creating your branding plan, Cathy recommends the following steps as being essential: examine taxonomy and branding plan; make your determinations and roadmap for a basic timeline; and plan for the future.

Cathy also pointed out several SharePoint design "gotchas," including: fluid versus fixed width (particularly problematic with intranet sites including lists and libraries if you're using fixed width); rounded corners and different backgrounds for Web Parts (workarounds are required in both cases); text in dynamic navigation (no images of buttons in the navigation if you're using out-of-the-box navigation); and font faces used across the site (if you want to change the font, allocate extra time to make it happen).

Cathy concluded by sharing a couple of best practices recommendations for branding in SharePoint 2010.  First, you should never edit the out-of-the-box files because not only will service packs overwrite them, but doing so will also render your service contract with Microsoft (if you have one) null and void.  Second, store your styles in a single stylesheet, because it's easier to maintain custom CSS if all customizations are in one file.  As a final note, regarding SharePoint Designer or Visual Studio, and which one to use, Cathy suggested that you should "use the tool that is best suited to you," but mentioned that you may very well end up using a combination of the two (as she does herself).

 

Check out ourfull coverage of Best Practices Conference 2010: