Este documento describe los conceptos y mejores prácticas para realizar branding en SharePoint 2010. Explica que el branding incluye elementos como las páginas maestras, diseños de páginas, CSS, JavaScript y Web Parts. También describe dos métodos para implementar el branding, ya sea mediante Visual Studio o SharePoint Designer, y las ventajas e inconvenientes de archivos personalizados frente a no personalizados. Además, incluye ejemplos de malas prácticas de branding.

1. Branding en SharePoint 2010: Trucos y
Buenas Prácticas
Roberto RamónBerná
CyB300001
SharePoint Developer – Colaboración y Búsqueda
rberna@solidq.com

2. ¿Qué vamos a aprender?
Elegir el método de despliegue
adecuado.
Diferenciar entre archivos
Customized y Uncostumized.
Buenas prácticas en branding.
Despliegue del branding con
feature en Visual Studio.
Objetivos

3. Apartados
 Branding como concepto.
 ¿Por qué realizar un branding?
 Despliegue: Visual Studio & SPD
 Demo 1: Despliegue Visual Studio
 Archivos Customized & Uncostumized
 Demo 2: Customized & Uncostumized
 Malas prácticas
Agenda

4. ¿Qué esel branding?
 Viene de la palabra “brand” y
significa marca
 Podríamos decir que realizar un
branding es crear tu propia marca
 Branding en sitio web = colores,
tipos de fuentes, logos e imágenes
 Branding en SharePoint =
branding sitio web + master page,
layouts, css, WebParts, XSL
Branding

5. ¿Por qué realizar un proyecto debranding ?
 Queremos ser únicos y diferentes del resto
 El efecto positivo que causa en lo
empleados de nuestra empresa
Branding

6.  Página maestra (Master Page)
 Diseño de página (Layout)
 XSLT
 Transformar XML
 Separa contenido y presentación
 Web Parts
 Componentes que el usuario puede mover, mostrar o ocultar.
 El usuario interactúa con ellos
 Son configurables
 Content Query Web Part
 CSS
 JavaScript
Branding
¿De qué elementos disponemos?

7. Ejemplo
Web deSolidQ (Home)

8. Ejemplo
Web deSolidQ (Cursos)

9.  Feature
 Proporciona archivos Uncostumized en SharePoint
 Ámbito (Scope)
 Solución
 Administra y configura proyectos
 Organiza nuestros archivos
Despliegue
Conceptos

10.  Definir claramente las rutas del despliegue.
 Master page y layouts bajo Master Page Gallery
 Archivos personalizados. (css, xsl, js,images)
 Style Library/CustomImages Imágenes
 Style Library/CustomStyles css
 Style Library/CustomScripts  JavaScript
 Style Library/CustomXSLFiles  xsl
 2 formas de desplegar
 Utilizando SharePoint Designer o IU de SharePoint
 Mediante activación de features de Visual Studio
Despliegue
Indicaciones y Opciones

11.  Subir cualquier archivo en
cualquier momento.
 Velocidad alta en
recuperación frente a fallos.
Despliegue
IU SharePoint o SPD
 Archivos desplegados son
Uncostumized( almacenados
sistema de archivos de
SharePoint)
 Aumenta el rendimiento de
nuestra aplicación.
 Nos ahorramos el trabajo
manual.
Visual Studio
Ventajas

12.  Todo el trabajo es manual
(subidas, actualizaciones,
borrados, etc…)
 Archivos desplegados son
Customized (BD)
 Muchos archivos Customized
implica menos rendimiento
Despliegue
IU SharePoint o SPD
 A veces resulta muy costoso,
en cuanto a cambios sencillos
 Recuperación lenta en cuanto
fallos
Visual Studio
Desventajas

13. Despliegue
¿Por qué no se despliegan los layouts?
<%@ Page language="C#"
Inherits="Microsoft.SharePoint.Publishing.PublishingLayoutPa
ge,Microsoft.SharePoint.Publishing,Version=14.0.0.0,Culture=
neutral,PublicKeyToken=71e9bce111e9429c"
meta:webpartpageexpansion="full"
meta:progid="SharePoint.WebPartPage.Document" %>
Esta directiva la usa SharePoint para identificar que tu
Page Layout ha sido personalizado usando SharePoint
Designer.

14. DEMO
SharePoint Branding con Visual Studio

15.  CUSTOMIZED:
 Antiguamente conocidos como “Unghosted Files”
 Son archivos que están almacenados en la base de datos
 UNCOSTUMIZED:
 Antiguamente conocidos como “Ghosted Files”
 NO se encuentran en la base de datos, se encuentra en el sistema
de archivos de SharePoint. (14/Template/Features/…)
 ¡IMPORTANTE! Son tipos de archivos, no existen como tal
Tipos de archivos
Customized y Uncostumized: Breve descripción

16.  ARCHIVOS CUSTOMIZED
 Una página pasa a ser Customized editándola con SD o con UI de
SharePoint
 No confundir con editar contenido
 SharePoint accedería a la BD para renderizar la página
 Archivos creados con SPD o con UI SharePoint nunca podrán ser
Uncostumized
 El paso de archivo Uncostumized a Customized se puede revertir.
 INCONVENIENTES
 Evitan mantener la consistencia en nuestro diseño
 Customized = Una única versión del archivo
 Empeoran el rendimiento (Consultas SQL)
 + archivos customized = - rendimiento
Tipos de archivos
Customized

17.  ARCHIVOS UNCOSTUMIZED
 No se guardan en la BD
 Se guardan en el sistema de archivos
 VENTAJAS
 Mantienen la consistencia del diseño
 Aumenta el rendimiento. (Almacenados en caché)
 + archivos uncostumized = + rendimiento
Tipos de archivos
Uncostumized

18. Tipos de archivos

19. Tipos de archivos

20. Tipos de archivos

21. DEMO
Customized & Uncostumized Files

22.  Estilos inline <p style=“color:red; margin-left:15px;”></p>
 Aplicar un ancho fijo a nuestro sitio en px
 No aplicar el diseño sobre contenido real. “Lorem ipsum dolor sit
amet....”
 Utilizar varias master pages
 Fijar el ancho de la ribbon
 Modificar los archivos por defecto de SharePoint
Branding
Malas prácticas

23. Si quieres disfrutar de las mejores sesiones de
nuestros mentores de España y Latino América,
ésta es tu oportunidad.
http://summit.solidq.com/madrid/
Síguenos: