Esta nota es la continuación de la receta paso a paso ya publicada: Introducción al diseño de sitios web públicos en Office 365 y su agregado: Configurando el Sitio web público para dispositivos móviles en el cual vimos que gracias a una configuración previa de la apariencia, la disponibilidad del sitio para móviles es inmediata.
En esta última parte trataremos de avanzar en el diseño y la personalización del sitio cuyo diseño básico ya habíamos comentado. En primer lugar digamos que como son varias las opciones se nos ofrecen, al igual que nuestras propias preferencias, será difícil lograr una receta paso a paso. Creo que además resultaría tedioso.
Entonces, optaremos por describir brevemente algunas de las alternativas que se nos presentan en forma de menúes con el aspecto de la conocida cinta de Office, invitando a cada uno a aplicar su inventiva y sus ganas de explorar para elegir las que considere apropiadas para cada caso.
Vale comentar, aunque será evidente en cuanto comencemos a modificar el diseño del sitio, que estaremos trabajando dentro de los dominios de Sharepoint. Nuestro sitio de Office 365 está basado en Sharepoint online. Y ahora, manos a la obra.
Personalizando la navegación del sitio
Es importante asegurarse de que la navegación por el sitio sea clara y simple para los visitantes. Ahora veremos cómo crear, editar y eliminar los enlaces que aparecen en la barra de navegación según nuestra preferencia.
Recordemos que una vez elegido el primer diseño, nos quedará disponible un abarra de navegación, barra que por ejemplo podría estar ubicada a la izquierda o en la parte superior y que, por default, incluye los enlaces: Inicio, Quiénes somos, Contacto, Direcciones y Blog y sus respectivas páginas. A medida que vayamos incorporando nuevas páginas en el sitio web, se creará un nuevo enlace y se asociará con esa página.
Para personalizar la navegación, tenemos distintos caminos. El trivial sería elegir un diseño de sitio diferente, tal como hicimos al principio pero desde luego descartamos éste, mantendremos el diseño elegido.
Si queremos mantener el diseño elegido, podremos cambiar las cosas a nuestro gusto directamente en el editor de página web: por ejemplo el nombre de los enlaces, reorganizar o añadir nuevos enlaces, crear subenlaces, etc (Ver Figura 1 - 1 “Menú Edición”). Incluso, podremos crear vínculos que nos lleven a otros sitios web.
Junto a la anterior tenemos la opción 2 (“Cambiar elementos del sitio”), la cual nos permitirá editar otros elementos como: el pie de página o el texto que va en el área de inicio de sesión. Para ello nos ofrece además de distintas opciones de formato para los textos en un menú cinta, también, en otra pestaña, insertar documentos, tablas y contenido multimedia.
También podríamos definir la ubicación de la barra de navegación dentro del diseño general elegido, la manera de hacerlo nos hace volver por un momento a nuestra receta de la primera parte: Elegiremos Cambiar la Apariencia (podría decir Aspecto en lugar de Apariencia), la primera opción del menú.
Como vemos, además de del diseño podríamos cambiar nuevamente la combinación de colores, las fuentes, etc. Pero volvamos a la posición de la barra de navegación, en este caso bajo el rubro Diseño del sitio (opción elegida LYON) la barra está a la derecha, pero, si exploramos con las otras opciones, veremos que no solo la posición de la barra sino también algunos otros elementos de diseño cambian. Por ejemplo, veamos que nos propone la opción de diseño llamada BERLIN.
Finalmente, como ya vimos tendremos la oportunidad de ver como queda nuestro diseño, eligiendo Probar las modificaciones antes aprobarlas o bien, incluso descartarlas y Volver a empezar un nuevo diseño.
¿Y que pasa si queremos que el sitio incluya un cuadro de búsqueda? Volvamos a la Figura 1-3 y veremos que tenemos otra opción en esta cinta nos permite decidir si nuestro sitio incluirá un cuadro de búsqueda o no, simplemente marcando una casilla de verificación.
Para completar, podríamos tomar un camino avanzado para la personalización, por ejemplo utilizar nuestras propias hojas de estilo (CSS). En este caso la opción Editar Hojas de Estilo (Figura 1-4). A continuación vemos un ejemplo del editor.
Este camino nos ofrece libertad de diseño y, desde luego, nos demanda una destreza mayor.
Por último, en todo este texto hemos hablado de sitios públicos. Veremos que es simple hacer privado o público un sitio.
En cualquier momento podemos publicar nuestra producción y hacerla visible para todo el mundo (pública) o bien compartirla solamente con contactos autorizados (privada) utilizando las opciones que se ofrecen en la parte superior derecha del panel de administración. Hacer público o privado el sitio es muy sencillo, simplemente el mismo comando tiene funciones de habilitar - deshabilitar.
Bueno con esto hemos completado nuestra introducción al diseño de sitios dentro de Office 365. Invitamos a que cada uno explore y trate de personalizar el aspecto y la funcionalidad de un sitio, seguramente encontrará otras cosas interesantes que podrá utilizar y compartir.