Thursday, March 31, 2011

SharePoint 2010 Branding - Tips 1

These group of tips which are related to SharePoint 2010 Branding which I gathered from Pro SharePoint 2010 Branding book - Wrox publishing and my experience so maybe these tips will benefit anyone read this article.
  • We have to reduce the gap between the designer and developer because many times the developer does some designing tasks in SharePoint 2010 and vice versa.
  • Branding of SharePoint different from Branding and designing of custom web application because it's not just CSS ,images and HTML but it's also include XSLT , MaterPage and Web Parts.
  • SharePoint Designer 2010 setup available for free from Microsoft download site (32 bit or 64 bit).
  •  Having some knowledge in ASP.NET help you to get comfortable to work with SharePoint Branding components like Master page and Content place holders.
  • Branding means create your site which reflects your standards or schema and colors so for example your colors and fonts of your company site inherent form Your Logo.
  • Some feature of branding available in SharePoint Server 2010 not available in SharePoint foundation like publishing features.
  • Branding of Your site can be different based on the type of your environment which can be intranet, internet or extranet (combination of intranet and internet).
  • In SharePoint 2007, custom theme can be apply by creating CSS, images and XML in 12 hive folder then applies these changes to master page but in SharePoint 2010 the task now easier so just we can apply a custom theme by creating .thmx file by using Office software 2007 or later version to customize your theme with 12 colors and 2 fonts then applies these changes to any site by uploading one file only from site settings.
  • Out of the box master pages available in SharePoint 2010 as the following:
    • V4.master – like default master page in SharePoint 2007
    •  Nightandday.master – this master page used with publishing site
    •  Minimal.master – less functionality master page and used with search site but it's not a minimal master page like in SharePoint 2007 so can't be used as starter master page as previous version.
  •  Wiki pages enable the user to create the page on the spot just when he enter a link for the page by using [[ in edit mode.
  •  In SharePoint 2007 the core.css was a file which contains all css useing with SharePoint so when you browse a page the sharepoint load this file which has thousands of lines and this produce the performance issues but in SharePoint 2010 the concept changes so the main file now coreV4.css and just the needed style will be load it when you request the page for example if load the search page so just css needed for search page will be load it.
  • We can divide the supported browser by SharePoint 2010 :
    • Fully supported like IE 7 or 8 32 bit
    • Supported with some limitations like Firefox 3.6 , IE 7 or 8 64 bit and chrome
    • Not supported like IE 6
  • SharePoint 2010 output cleaner HTML code more than SharePoint 2007
  • You can customize the Media Player web part which is sliver light control with using Microsoft expression blend.
  • Multi-lingual User Interface (MUI) enable the user to have multiple language feature for one site not like the variation which create separated site for each language.
    Note: Variation and MUI can be used together.
  • SharePoint 2010 has been designed to follow more closely (not 100%) the XHTML standard which enables Web Content Accessibility Guidelines WCAG 2.0 of W3C.
  • Application Pages (which are under _layouts folder ) can be now customize their master page from site settings not like SharePoint 2007 you have to customize application.master (this master page lives under layout folder directory and all web application read from this master page unless you have a separate layout folder for each web application) or assign a new master page by using custom code (not supported by Microsoft specially when you apply hot fix or service back).
  • If any an error occur in custom master page for application pages SharePoint will fall back automatically to v4.master to make sure all application pages still accessed.
  • You can still use Branding of SharePoint 2007 in upgrading environment or you can upgrades to new look and feel by using Visual Upgrade feature.
  • A DOCTYPE is a piece of code that is declared at the top of a document that instructs the browser to use a specific language to interpret the rest of code.
  • List of Popular DOCTYPE in use today :
    • HTML 4.01 Strict — allows all HTML elements but does not allow deprecated elements such as the tag.
    • HTML 4.01 Transitional — allows all HTML elements including deprecated elements.
    •  XHTML 1.0 Strict — Similar to HTML 4.01 Strict, but all tags must be well-formed XML. Deprecated elements are allowed but must also be well-formed XML
    • XHTML 1.0 Transitional — Similar to HTML 4.01 Transitional, but all tags must be well formed XML. Deprecated elements are allowed but must also be well-formed XML
  • SharePoint 2010 use XHTML 1.0 Strict DOCTYPE by default.
  • Compatibility mode tells the browser (IE only ) how to interpret and render a website and there are several supported modes in IE 8:
    • IE=5 IE5.5/Quirks rendering mode
    • IE=7 IE7 Standards rendering mode
    •  IE=EmulateIE7 IE7 Standards or Quirks rendering mode, depending on the DOCTYPE
    • IE=8 IE8 Standards rendering mode
    • IE=EmulateIE8 IE8 Standards or Quirks rendering mode, depending on the DOCTYPE
    • IE=edge Uses the latest rendering mode, which is currently IE8 Standards Mode
  • All SharePoint 2010 Master page by default use IE=8 compatibility mode.
  • You have to connect and login to a site in SharePoint Designer 2010 to use it as editor not like SharePoint Designer 2007 you can use it as editor without login required.
  • Check the bottom left corner in SharePoint Designer 2010 to find the current login used or to login by other user
  • To apply custom CSS in SharePoint 2010 you can use the following methods:
    • Apply inline style in master page and page layouts
    • Create custom CSS and add link to custom master page
    • Alternate CSS feature with publishing site only.
  • In SharePoint 2007 you can create view for list by using web browser but in SharePoint 2010 you can also create the views for the list by using SharePoint Designer 2010
  • All view of list of SharePoint 2010 based on XSLT so you can customize by using SharePoint Designer 2010 (use XSLT List View Web Part) not like SharePoint 2007 which based on CAML
  • Type of workflow supported by SharePoint Designer 2010
    • List workflows — workflows that are directly associated with a list.
    • Reusable workflows — these are workflows that can be associated with many lists, or libraries and it's based on a specific content type.
    • Site workflows — these workflows are not associated with a specific list or content type.
    • Globally reusable workflows —out-of-the-box workflows (Approval, Collect Feedback, and Collect Signatures) are listed as globally Reusable Workflows. These workflows can be edited with SPD  2010 or used as the basis to create new workflows.
  • Workflow of SharePoint 2010 can be design also by using Microsoft Visio 2010 and Visual studio 2010 and then can be imported to SharePoint Designer 2010 to customized
  • You can connect through SharePoint Designer to different type of line of business with easier editor and read and write operation not like SharePoint 2007
  • Not like SharePoint Designer 2007 , now you can control who can access the SharePoint Designer 2010 and which items can be edit by this user for example if the user can edit the master page or detach a page and this can be control from
    • Central Administration >> General setting of Web application
    • Site Settings of site collection

1 comment:

إسماعيل عنجريني (Ismaeel Enjreny) said...

Very nice article where you summarize pro branding book, keep moving forwarde, and don't forget what you read is what you know