Designing SharePoint 2010 for Business
Upcoming SlideShare
Loading in...5
×
 

Designing SharePoint 2010 for Business

on

  • 2,872 views

 ...

 
Abstract - Designing SharePoint 2010 for Business
A business owner nowadays needs to be able to attract and engage people to their website. In this session, learn to implement your company's brand on SharePoint 2010. During this session, we'll use the right tools to take a design from concept to a fully functioning SharePoint 2010 site. Based on real world experiences, this session is sure to give you some practical tips, tricks, and advice you can use immediately. Learn to leverage SharePoint 2010 tools to customize your experiences, and make them unique. You will be able to take this knowledge and deliver the best end to end experiences to your customers.
 
Bio - Kanwal Khipple, is a SharePoint Most Valued Professional (MVP) and Principal SharePoint Architect for BrightStarr. Kanwal focuses on designing adoptable solutions using SharePoint. In the past 7 years, he has developed, implemented and architected hundreds of SharePoint solutions from small single server deployments to globally dispersed SharePoint server farms that can handle 120,000+ users. Kanwal lives in Toronto, Canada and you can find him tweeting, buzzing and blogging on his personal blog. Connect with him on LinkedIn to learn how you can quickly start getting ROI for your SharePoint Intranet.

Statistics

Views

Total Views
2,872
Views on SlideShare
2,856
Embed Views
16

Actions

Likes
3
Downloads
79
Comments
1

2 Embeds 16

http://paper.li 12
http://www.linkedin.com 4

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Nice presentation. Let me introduce you Bind Tuning http://bindtuning.com a tool that comes to revolutionize the way how SharePoint sites are branded, with a lot of themes that are fully customizable you can give to the sharepoint site a unique design in just a few clicks.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  •  Abstract - Designing SharePoint 2010 for BusinessA business owner nowadays needs to be able to attract and engage people to their website. In this session, learn to implement your company's brand on SharePoint 2010. During this session, we'll use the right tools to take a design from concept to a fully functioning SharePoint 2010 site. Based on real world experiences, this session is sure to give you some practical tips, tricks, and advice you can use immediately. Learn to leverage SharePoint 2010 tools to customize your experiences, and make them unique. You will be able to take this knowledge and deliver the best end to end experiences to your customers. Bio - Kanwal Khipple, is a SharePoint Most Valued Professional (MVP) and Principal SharePoint Architect for BrightStarr. Kanwal focuses on designing adoptable solutions using SharePoint. In the past 7 years, he has developed, implemented and architected hundreds of SharePoint solutions from small single server deployments to globally dispersed SharePoint server farms that can handle 120,000+ users. Kanwal lives in Toronto, Canada and you can find him tweeting, buzzing and blogging on his personal blog. Connect with him on LinkedIn to learn how you can quickly start getting ROI for your SharePoint Intranet.
  • how many developers do we have in the room?How many are famiiliar with html / css ?
  • Please feel free to interrupt at any time to ask questionsIn this session, we are going to brand a SharePoint site from start to finish. We will use SharePoint Designer, HTML and custom CSS to design a site how not to look like SharePoint. We'll touch upon themes, page layouts as well as master page design. As well as learn how to upgrade a SharePoint 2007 design to SharePoint 2010. This session is focused on designers well versed with HTML and CSS but might not have the SharePoint development experience. Within the session, we'll also look at usability, accessibility and best practices on branding SharePoint public facing sites.AUDIENCE: Developers - Power UsersTOPICS: Information Architecture - Case Studies - Tools and Technics100 - Introductory Track
  • Level 1Level 2
  • Placeholders the same between content and application pagesMaster Page changes apply to Application (_layouts) pagesGreater use of DIV/CSS layouts -> Fewer TablesXHTML Strict document typeMuch better support for AccessibilityCross-Browser supportWhat has not changed from SharePoint 2007Complex nested page structuresLots and lots of stylesMostly same list of content placeholdersInconsistent Web Part markup injectionSame default and custom master page tokensCustom Master Pages:Copy V4.master and tweakStart with Minimal or the *Starter* Master Page
  • This ismicrosoft’s brand image. Looking at sharepoint makes you think of microsoft.When employees view your intranet or visitors view your public facing site, they should be thinking of your company’s brand not microsoft’s
  • 1 Create a new site2 Activate Wiki Page home page feature site settings > manage site features > enable Wiki Page Home Page3 Change Permissions – allow anonymous access Site settings > Users and Permissions > Site Permissions >
  • Hawaiian Air Website http://www.hawaiianair.comCase Study: How we did it http://is.gd/gvbo
  • I have taken some samples from Ian Morrish’s WSS Demo Top 100 Best Looking Public SharePoint sites. My intention of putting these slides in is to give you a feeling that anything is possible. However, it’s not to say that every sharepoint site should have a wiz and bang effect.It really depends on the user base and how the site is going to be used.You would not want to put a 600px high header in a corporate internal website for 120 thousand users who really just care about getting access to their project documents.
  • Observation that in many (if not most) cases only a very small amount (the 'tip') of information is available or visible about a situation or phenomenon, whereas the 'real' information or bulk of data is either unavailable or hidden. The principle gets its name from the fact that only about 1/10th of an iceberg's mass is seen outside while about 9/10th of it is unseen, deep down in water
  • In this session, we are going to brand a SharePoint site from start to finish. We will use SharePoint Designer, HTML and custom CSS to design a site how not to look like SharePoint. We'll touch upon themes, page layouts as well as master page design. As well as learn how to upgrade a SharePoint 2007 design to SharePoint 2010. This session is focused on designers well versed with HTML and CSS but might not have the SharePoint development experience. Within the session, we'll also look at usability, accessibility and best practices on branding SharePoint public facing sites.AUDIENCE: Developers - Power UsersTOPICS: Information Architecture - Case Studies - Tools and Technics100 - Introductory Track
  • Wireframes are NOT designsWireframes are NOT final layoutsWireframes are NOT prototypes
  • http://blogs.msdn.com/b/sharepointdesigner/archive/2010/04/09/working-with-the-sharepoint-theming-engine.aspxhttp://hermansberghem.blogspot.com/2010/04/2010-how-to-apply-corporate-branding.htmlhttp://blogs.msdn.com/b/sharepointdesigner/archive/2010/04/09/working-with-the-sharepoint-theming-engine.aspxhttp://mosshowto.blogspot.com/2010/06/sharepoint-2010-registering-css.html
  • Site actions > site settings > site themepreview changes applied with Graham theme
  • Now that pages are the topic of discussion, master pages and a little branding fits in too. SharePoint 2010 ships with a number of master pages. Important topics to discuss on this slide is how application pages can now also make use of branded master pages, and how there is a default.master that ships the (non-fluent) v3 UI for backwards compatibility.SharePoint 2010 brings a few new master pages that you may want to know about.  There are additional master pages to accommodate both the old and new versions of UI.  There are also some simplified pages to take note in.The first master page we will talk about is v4.master.  This is the default team site master page used with version 4 (obviously) of the UI.  This will be the master page you typically use. It provides the ribbon bar and all of the other new visual UI changes such as the site actions menu on the left side.If you did an upgrade to SharePoint 2010 and haven’t transitioned to the new UI yet, the old master page is still in default.master.  This looks just like the master page you use in SharePoint v3 today.  It doesn’t have the ribbon bar and the site actions menu is still on the right side.The search pages by default now use minimal.master.  This is a really slimmed down master page with next to nothing on it.  It doesn’t even have navigation.  I’m not sure why they opted to use this page in Search Center, but I think it provides and issue with people trying to leave the search center.  The Office Web Applications also use this master page but that makes a little more sense because it provides more screen real estate.The last page I will mention is simple.master.  This page is used for login and error pages.  From what I understand, it can’t be customized (I have no idea why), but it can be replaced.I hope this helps if you were curious about the new master pages.  I’ll also remind you again that application pages can also now make use of any branded master pages you might have created.  I’ll also point out that the master pages all use properly formed XHTML although I am not sure about default.master.  I will check that when I get a chance.Types of SharePoint 2010 Master Pages This section was largely derived from Quick Overview of Master Pages in SharePoint 2010 by Corey Roth v4.masterDefault team site master page. Provides ribbon bar and other UI changes.Characteristics·         Site actions are updated for 2010 and appear on left.·         Ribbon bar is availabledefault.masterSites upgraded from SharePoint 2007 use this unless they are changed to use a v4 version.Characteristics·         Site actions on right side and are same as SharePoint 2007 version·         No ribbon bar.minimal.masterMaster page contains almost nothing. It is used by the Search Center and Office Web Applications. This master should not be confused with minimal master pages from 2007 which were trimmed down custom master pages developed by users. The minimal.master is now an out-of-the box master page. These trimmed-down custom master pages are commonly referred to as Starter Master Pages in SharePoint 2010. Characteristics of minimal.masterNo navigation includedStarter Master PagesCommonly referred to as “minimal master pages” in SharePoint 2007, these quick start pages are created by developers to better enhance their ability to quickly create and customize a functional master. Sources for Starter Master PagesStarter Master Pages for SharePoint 2010 by Randy Drisgrillsimple.masterThis master is used by login and error pages. To customize these pages, a replacement page must be created and stored in the _layouts directory on the server. For more information see Default Master Pages in SharePoint  on MSDN.Pages using simple.master·         Login.aspx·         SignOut.aspx·         Error.aspx·         ReqAcc.aspx·         Confirmation.aspx·         WebDeleted.aspx·         AccessDenied.aspxOther Master PagesOther miscellaneous master pages are generally not manipulated when branding a site. These include:·         application.master·         applicationv4.master·         dialog.master·         layouts.master·         layoutsv3.master·         pickerdialog.master·         rtedialog.master·         simple.master·         simplev4.master·         mwsdefault.master·         mwsdefaultv4.master·         admin.master·         popup.master
  • Master Pages & Page Layouts---------------------------6 Launch SharePoint Designer and open website7 Create a new master page Browse to Master Pages library Copy and paste v4.master code into custom.master Create a new blank master page (custom.master)8 Set custom.master as site master Right click on custom.master Select “Set as Default Master Page” Select “Set as Custom Master Page”cant do this via UI -? ???? question to audiencewe are going to continue using SPD as this would apply to foundation, as well as sp in the cloud.Change page layout to Three columns with header-----------------------------------------------move image to headercopy content into three columns - show rich text editing and how it changes the html9 Create custom.css file in SiteAssets folderAdd link to css before Change Width------------ /* fix the width of the workspace, center it and turn off its scrollbar. Also add a default padding to the top to cope with the ribbon in its standard form */ body #s4-workspace { background: transparent; height: auto; margin: 0 auto; padding: 0px; width: 980px; overflow: auto;}width is not maintained. whats going on?/* Aligns the Top Bars */ .ms-cui-ribbonTopBars { width: 980px !important; margin-left:auto; margin-right:auto; } /* turns off the border on the bottom of the tabs */ .ms-cui-ribbonTopBars > div { border-bottom:1px solid transparent !important; } 11 Hide Quick launch--------------------- body #s4-leftpanel { display: none; } quick css solution. this allows you to manage via css when to show / hide contentplaceholders.NOTE: this hides the quick launch but we still have spacemargin via iedev toolbar.s4-ca { margin-left: 0px; }Change Top Navigation-----------------------copy images to site assets / images directory.s4-tn LI.static > .menu-item {color: #fff;height : 26px !important; border: 0px; margin: 0px; padding: 10px 0px 0px0px; text-align: center; width: 102px !important;}.s4-toplinks .s4-tn A:hover, .s4-toplinks .s4-tn A.selected { background: #757575 url('http://sp2010/companya/SiteAssets/images/topnav-on.png') repeat-x; color: #fff !important; text-decoration: none !important; }.s4-toplinks { background: #757575 url('http://sp2010/companya/SiteAssets/images/topnav-off.png') repeat-x; }12B Change search /** search area */.s4-search { padding: 5px 10px 0px 0px !important; text-align: center; }.s4-search TABLE { margin: 0px; width: 137px;}.s4-search INPUT.ms-sbplain { color: #000; border: 0px !important; float: right; width: 110px !important; }13 Cosmetic Changes /** Remove padding */ .ms-rte-layoutszone-inner { border: 0px; margin: 0px; padding: 0px } /**Hide logo / title */ .s4-titletable { display: none; } /** Hide Help button */ .s4-help { display: none; } /** remove border on title area */ .ms-titlerowborder { border-right: none; }8C Add items to Top Link Bar Store, Mac, iPod, iPhone, iPad, iTunes, Supportadd sponair.png imagemention you too can run Sharepoint 2010 on macbook air just like duxpadding on image launch site in google chrome/*** float ribbon */body.v4master { overflow: auto; }change master page / css body #s4-workspace to body #s4-myworkspaceadd overflow: hidden; to cssbody #s4-myworkspace { background: transparent; height: auto; margin: 0 auto; padding: 0px; width: 980px; overflow: hidden; }
  • In this session, we are going to brand a SharePoint site from start to finish. We will use SharePoint Designer, HTML and custom CSS to design a site how not to look like SharePoint. We'll touch upon themes, page layouts as well as master page design. As well as learn how to upgrade a SharePoint 2007 design to SharePoint 2010. This session is focused on designers well versed with HTML and CSS but might not have the SharePoint development experience. Within the session, we'll also look at usability, accessibility and best practices on branding SharePoint public facing sites.AUDIENCE: Developers - Power UsersTOPICS: Information Architecture - Case Studies - Tools and Technics100 - Introductory Track
  • http://support.microsoft.com/default.aspx/kb/931509
  • H1.ms-rteElement-H1Blue { -ms-name:Blue Heading 1; color: blue;}H3.ms-rteElement-H1Blue { -ms-name: SharePoint Fest Blue; color: blue;display:inline-block; padding-left:20px;background:transparenturl(http://sp2010/test/SiteAssets/images/spfest.png) center left no-repeat;}
  • - Hide Ribbon before s4-ribbonrow before s4-myworkspaceShow this in internet explorer - authenticated userShow this in google chrome – anonymous user
  • http://www.sharepointnutsandbolts.com/2009/06/my-checklist-for-optimizing-sharepoint.html
  • Observation that in many (if not most) cases only a very small amount (the 'tip') of information is available or visible about a situation or phenomenon, whereas the 'real' information or bulk of data is either unavailable or hidden. The principle gets its name from the fact that only about 1/10th of an iceberg's mass is seen outside while about 9/10th of it is unseen, deep down in water
  • http://spbuzz.it/cpspmp
  • http://spbuzz.it/prosp2010ui
  • In this session, we are going to brand a SharePoint site from start to finish. We will use SharePoint Designer, HTML and custom CSS to design a site how not to look like SharePoint. We'll touch upon themes, page layouts as well as master page design. As well as learn how to upgrade a SharePoint 2007 design to SharePoint 2010. This session is focused on designers well versed with HTML and CSS but might not have the SharePoint development experience. Within the session, we'll also look at usability, accessibility and best practices on branding SharePoint public facing sites.AUDIENCE: Developers - Power UsersTOPICS: Information Architecture - Case Studies - Tools and Technics100 - Introductory Track
  • Nielson norman group do a study every year on what the top 10 best intranets in the world are and writes a report for what makes that successful.At the end of the session, I’ll share with you on how to make your site the best it can be – they are my secrets to successful branding.
  • These secrets have less to do with the what tools you are using and more to do with the how you are going to achieve and knowing your audience

Designing SharePoint 2010 for Business Designing SharePoint 2010 for Business Presentation Transcript

  • Designing
    SharePoint 2010
    for Business
    Kanwal Khipple
    BrightStarr
  • About Me
    Kanwal Khipple
    Passionate about branding and optimizing SharePoint sites
    SharePoint MVP (2009-Present)
    Canadian
    Twitter
    @kkhipple
    @sharepointbuzz
  • About You
    The SharePoint Person in your company
    Designer Experience (200)
    • HTML
    • CSS
    • SharePoint Designer 2010
    Developer Experience (100)
  • Agenda
    Why Brand SharePoint?
    Tools for Branding
    Advanced Tips & Tricks
    Secrets to Successful Branding!
  • TWEET CONTEST
    Follow & RT 2 win @balsamiq mockups - the best #sharepointwireframing tool
    @kkhipple
  • What is branding?
    6
  • SharePoint Branding Overview
    Branding is more than adding a pretty header to your site and making it another color besides SharePoint blue
  • What’s New
    SharePoint 2010
  • 10
    Browser Market Share
  • Browser Resolutions & Market Share
  • Supported Browsers
    Internet Explorer 9
    Coming in SharePoint 2010 Service Pack 1
    Internet Explorer 7-8 (32-bit)
    IE Dev Toolbar (embedded in IE8+)
    Mozilla Firefox 3.6
    FireBug (addon to Firefox)
    Safari 4.04
    Google Chrome (Service Pack 1)
    Coming in SharePoint 2010 Service Pack 1
    http://spbuzz.it/sp2010browsers
  • WCM Features
    Status Bar
    Themes
    Server Ribbon
    Tagging & Rating
    Client OM
  • Here’s What You Get Out of the Box
    14
    Make It Not Look Like SharePoint
    Consistent User Experience
  • DEMO
    NEW INTERFACE
  • What Do Your Users Want?
  • 17
  • 18
  • 19
  • http://spbuzz.it/sptopsites
    http://spbuzz.it/bsdesigns
  • What’s Involved?
    Information Architecture
    Design
    Wireframes
    Branding
    Page Layouts
    Master Pages
    HTML, CSS, JavaScript
  • Ice Berg Principle
  • Sites
    SharePoint is a Platform
    Communities
    Composites
    Content
    Insights
    Search
  • General web principles and their relation to SharePoint
    F & Z reading patterns
  • General web principles and their relation to SharePoint
    Design follows same principles as other WCM’s like:
    • Fibonacci principle 0,1,1,2,3,5,8,13,21
    • Golden ratio 1.618
  • Agenda
    Why Brand SharePoint?
    Tools for Branding
    Advanced Tips & Tricks
    Secrets to Successful Branding!
  • Customization Options
    Change Site Logo, Format, Parts
    Browser
    easy
    Change Colors, Backgrounds, Fonts
    Edit CSS files
    Change Page Layout and Content
    Edit Master PagesEdit Page Templates (SharePoint Server only)
    SharePoint Designer
    complex
    Share Your Customization with Others
    Build Themes and Site Definitions
    SPD + Visual Studio
  • Start with a Wireframe
  • BalsamiqMockup
    DEMO
  • TWEET CONTEST
    Follow & RT 2 win @balsamiq mockups - the best #sharepointwireframing tool
    @kkhipple
  • Wireframes
    Balsamiq Mockups
    http://spbuzz.it/bmockupsdemo
    Microsoft Visio Wireframe
    http://spbuzz.it/sp2007visiotemplate
    Adobe PDF Wireframe
    http://spbuzz.it/sp2007pdftemplate
    Photoshop PSD file
    http://spbuzz.it/sp2007psdtemplate
    http://spbuzz.it/sp2010psdtemplate
    Balsamiq Mockups wireframe
    http://spbuzz.it/sp2010bmockupstemplate
  • Themes
    SharePoint Terminology
  • Themes
    12 colors, 2 Fonts
    Control look and feel of your site
    Uses Office theme (.thmx files)
    Create theme via PowerPoint
  • 34
  • New CSS Registration Property
    Conditional Expression
    <SharePoint:CSSRegistration Name=“1.css” ConditionalExpression=“lt IE 8” runat=“server”/>
    <!--[if lt IE 8]>
    <link rel=“stylesheet” type=“text/css” href=“NonIE8.css”/>
    </![endif]-->
    After
    <SharePoint:CSSRegistration Name=“1.css” After=“corev4.css” runat=“server”/>
    <SharePoint:CSSRegistration Name=“2.css” After=“corev4.css” runat=“server”/>
    <link rel=“stylesheet” type=“text/css” href=“/_layouts/1033/styes/core.css?rev=…”/>
    <link rel=“stylesheet” type=“text/css” href=“2.css”/>
    <link rel=“stylesheet” type=“text/css” href=“1.css”/>
  • Custom Theming Options
    Theme colors override your CSS
    /* [ReplaceColor(themeColor:"Dark2")] */ color:#3b4f65;
    Recolor images – Blending, Tinting, Fill/* [RecolorImage(themeColor:"Dark2-Lightest",method:"Tinting")] */ background:url("/Style Library/images/image.png") no-repeat;
  • SharePoint 2010 Themes
    DEMO
  • MASTER PAGeS & Page LAyouts
    SharePoint Terminology
  • Master Page
    Master Page
    Page Layout
  • Master Pages
  • SharePoint Frontend – how the site is built
  • 42
    http://spbuzz.it/sp2010dcph
    <asp:ContentPlaceholder ID="PlaceHolderLeftNavBar" runat="server" />
  • Master Pages & Page Layouts
    DEMO
  • Agenda
    Why Brand SharePoint?
    Tools for Branding
    Advanced Tips & Tricks
    Secrets to Successful Branding!
  • Use a Favicon
    Easily show a Favicon in SharePoint 2010
    SharePoint 2007 approach
    <link rel=“shortcut icon” href=“/Style Library/images/favicon.ico”/>
    SharePoint 2010 approach
    <SharePoint:SPShortcutIconrunat=“server” IconUrl=“/Style Library/images/favicon.ico”/>
  • Handling Legacy Browsers
    Warn users when they are using an unsupported browser
    <SharePoint:WarnOnUnsupportedBrowsersrunat="server"/>
    http://spbuzz.it/ie6-upgrade-warning
  • Hide Design Elements from Dialog Boxes
    Add s4-notdlg for HTML elements that you don’t want to show in the dialog boxes
    <div class=“customFooter”>
    <div class=“customFooters4-notdlg”>
  • Handling the Name.dll ActiveX Control
    You can turn off the message on the General Settings page of the Manage Web Applications section of Central Administration. Set Enable Person Name smart tag and Online Status for members to No.
    <script type="text/javascript">
    function ProcessImn(){}
    function ProcessImnMarkers () {}
    </script>
    http://spbuzz.it/mskb931509
  • Custom Ribbon Fonts & Styles
    Blue Background
    .ms-rteStyle-BlueBackground {-ms-name: “Blue Background”; background-color: blue; color: white;}
    Blue Heading 1
    H1.ms-rteElement-H1Blue {-ms-name:”Blue Heading 1”; color: blue;}
  • Advanced Tips & Tricks
    During Visual Upgrade, show content based on UI version
    <Sharepoint:UIVersionedContent ID="myContentIDv3" runat="server" UIVersion="3">
    <ContentTemplate>
    <p>This content displays only when UIVersion=3.</p>
    </ContentTemplate>
    </SharePoint:UIVersionedContent>
    <Sharepoint:UIVersionedContent ID=" myContentIDv4" runat="server" UIVersion="4">
    <ContentTemplate>
    <p>This content displays only when UIVersion=4.</p>
    </ContentTemplate>
    </SharePoint:UIVersionedContent>
  • Advanced Tips & Tricks
    Remove specific content from Search Results
    <div class=“footer noindex”/>
    <!--- footer content --->
    </div>
    http://spbuzz.it/msdnspbasepermissions
    Security controlled content
    <Sharepoint:SPSecurityTrimmedControlrunat="server" Permissions="ManageWeb">
    <!--- content here --->
    </Sharepoint:SPSecurityTrimmedControl>
  • Float Ribbon
    body { overflow:auto; }
    Remove scroll="no" from the <body> tag
    body #s4-workspace {left:0;overflow:visible;position:relative;}
    html.ms-dialog body #s4-workspace {overflow-x:auto;overflow-y:scroll;}
    52
  • Advanced Tips & Tricks
    Performance Goals
    • Reduce page weight
    Techniques
    • Output Caching
    • Blob Caching
    • CSS Sprites
    • Consolidate JS and CSS files
    • Cache JS, CSS and image files in browser
    • Minification of JS and CSS
    • Anonymous access for CSS, JS and image files
    Tools
    • Yslow
    • Fiddler
    • Wireshark
  • Design Considerations
    Be easy on the portal home page
    Use F / Z pattern
    Make sure colors do not clash
    Avoid anything unnecessary
    Think like an end user
    Show quick wins
    Test SharePoint even on Windows 7
    Cross browsers and Accessibility
    Change is the only Constant
    Ask for feedback
    Keep it fresh
  • Advanced Topics
    Content Query Web Part
    Data view web part in SharePoint Designer
    XSLT templates
    JQuery
    SPServices
    ClientOM
    55
  • http://spbuzz.it/jGZIuB
    Tools for Branding?
    Take Baby Steps
  • Ice Berg Principle
  • 58
    SharePoint Master Pages
    http://spbuzz.it/cpspmp
  • Professional SharePoint 2010 Branding and User Interface Design
    Provides expert tips, techniques,
    and insights from the author team of
    SharePoint 2010 and branding experts
    • CSS
    • master pages
    • page layouts
    • SharePoint themes
    • XSLT
    • jQuery
    • Silverlight
    http://spbuzz.it/prosp2010ui
  • Agenda
    Why Brand SharePoint?
    Tools for Branding
    Advanced Tips & Tricks
    Secrets to Successful Branding!
  • 50% Of Top Intranet’s Use SharePointSource: Nielsen Norman Group
    61
    Secrets to Successful Branding
  • Secrets to Successful Branding
    Organize your content
    End users are more likely to use search then navigation
    Follow Web Standards
    Optimize and accessibility and standards
    Listen To Your Users
    http://spbuzz.it/iYKom7
  • Designing SharePoint 2010 for Business
    Thank you!
    Submit Feedback
    CloudShare - http://spbuzz.it/mQbInb
    http://www.brightstarr.com
    http://www.kanwalkhipple.com
    @kkhipple
    @sharepointbuzz