Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.


  • Be the first to comment

  • Be the first to like this


  1. 1. SharePoint Branding 101 Tips to enhancing your experience D’arce Hess UI/UX Developer
  2. 2. • Themes & Composed Looks • Responsive Design • Gotchas Agenda
  3. 3. Themes & Composed Looks
  4. 4. This is the Out-of-the-Box method for branding SharePoint 2013 and O365.. • Great for end-users • Easy to add custom color schemes without fully customized master pages and page layouts
  5. 5. • Master Pages • CSS • Color Palettes • Font Palettes • Background image What are Composed Looks made of?
  6. 6. Do not modify the .master file. Only work out of the .html file Only need to create a .preview file if you want to select your master page from the drop- down in the preview.
  7. 7. Where do you find the composed looks?
  8. 8. • The configuration of each Composed Look • The Masterpage used • The Color Palette file • The Background img Location • Font Scheme used What did I just see?
  9. 9. /_catalogs/theme/15/ Where is the SP color file located?
  10. 10. Responsive Design
  11. 11. • Uses CSS3 Media Queries to allow for design to adapt to screen width. • Requires a different thought process for tables and content. • Mobile First vs. Desktop. • When to ask for help.
  12. 12. With great power comes great responsibility • Responsive Design should not be used in all projects. • Takes more time for development, but less time to maintain. • One Master Page to rule them all. • Design to screen width not to specific device. • Need to watch for optimization of content prevent bandwidth and data overload.
  13. 13. Gotcha
  14. 14. Design Manager in SharePoint 2013 • Do NOT use the create Design Package • <form> </form> will not validate in XML validator Bootstrap • Watch out for box-model. SharePoint requires use of content-box to work properly. • Several resets needed to allow for bootstrap to work with SharePoint.
  15. 15. How can we help you achieve your optimal SharePoint experience?
  16. 16. QUESTIONS
  17. 17. THANK YOU

    Be the first to comment

    Login to see the comments


Total views


On Slideshare


From embeds


Number of embeds