Índice
El gestor web institucional es una herramienta CMS (Content Mangement Systems o gestor de contenidos) de desarrollo propio. Los gestores de contenidos son unas aplicaciones que ofrecen una serie de herramientas para facilitar la creación, gestión y administración de sitios web. El hecho de ser un desarrollo propio, presenta algunas ventajas aunque también algunos inconvenientes:
Entre las ventajas, además de ser gratuito, mencionar que permite la creación de páginas web de forma rápida y muy sencilla, cumpliendo algunos criterios de formato y accesibilidad. Se encuentra adaptado perfectamente al entorno complutense y al ser un desarrollo propio se pueden ir implementando mejoras bajo petición que sean de utilidad e interés general, además aporta ventajas a nivel de seguridad.
Entre las desventajas, comentar que no admite la ejecución de código propio (como javascript) e interacción directa con bases de datos externas, lo cual limita los efectos visuales y el uso de aplicaciones de terceros. Por otro lado, no admite la importación y carga de páginas web, las mismas sólo se pueden componer usando las herramientas que ofrece, por tanto la migración de páginas web externas al mismo resulta costosa. Tampoco ofrece la opción de exportar, duplicar páginas o hacer copias de seguridad de los sitios web. Por último, el abanico de herramientas es más limitado y menos flexible si lo comparamos con herramientas como Wordpress que tienen un amplio soporte internacional, aunque muchos de sus complementos tengan un coste asociado.
Los materiales que han servido para la elaboración de esta biblioguía, parten del contenido del curso Edición Web con el Gestor Web Institucional de la UCM, impartido en 2021 por el Servicio de Edición Digital y Web (Biblioteca Complutense) y ECampus Web (Servicios informáticos). El contenido original ha sido actualizado, ampliado y adaptado.
Podemos solicitar permisos para editar nuestras webs cumplimentando el siguiente formulario:
Desde Mi escritorio tenemos acceso a:
"Mis Webs" o listado de las webs sobre las que tengo permisos de edición.
"Aplicaciones Web" o listado de aplicaciones autorizadas.
Las aplicaciones web necesarias para la edición son:
Cuando nos situamos en una página web sobre la que tenemos permisos de edición vemos en la parte superior izquierda el botón "Editar":
Pulsando el botón editar accedemos al Gestor Web UCM:
El Gestor UCM es la herramienta que nos permite realizar la tareas de edición.
La dinámica básica de la edición web consiste en:
El contenido se adapta al contenedor.
Soporte web: equipo formado por tres bibliotecarios y dos informáticos (Servicio de Edición Digital y Web de la Biblioteca Complutense).
eCampus Web: Soporte a problemas de funcionamiento y cuestiones de índole técnica relacionadas con el gestor.
Incidencias (navegar identificado):
☎ Helpdesk: 913944774
Correos electrónicos:
✉ Soporte Web (soporteweb@ucm.es)
✉ eCampus Web (gweb@ucm.es)
Uno de los conceptos básicos del mundo web y que, sin embargo, más se presta a confusión es la distinción entre sitio web y página web. Se emplean a menudo como términos intercambiables y solemos referirnos a ambos en general como "página web". Sin embargo, la distinción es esencial y tiene importantes implicaciones en el trabajo con el gestor web institucional, por lo que vamos a detenernos, aun brevemente, en ella.
A modo de metáfora, podemos decir que un sitio web es un libro completo que abarca una serie de páginas que lo componen. Es decir, un sitio web es un conjunto de páginas relacionadas que comparten una URL única común. Dentro del sitio web, estas páginas se encuentran organizadas y jerarquizadas con una estructura concreta, aunque al tener su propia URL podamos acceder y navegar a ellas separadamente.
A su vez, el sitio o espacio web tiene una portada con una serie de características propias. De ella, a modo de árbol, cuelgan las páginas de primer nivel y de éstas cuelgan sucesivamente páginas de segundo, tercer, cuarto... nivel.
Para reorganizar las páginas según de esta estructura, podemos mover las páginas en la web, como veremos en el apartado 2.1 Operaciones básicas.
Por su parte, y siguiendo con la metáfora, del mismo modo que los libros en una biblioteca se agrupan por materias como Economía, Filosofía, etc., en la UCM los sitios web se clasifican según su área funcional en dominios, que en muchos casos podemos ver en un banner en la parte superior del sitio web: Facultades, Departamentos, Bibliotecas...
En el caso del gestor web institucional, todo esto se traduce en que los sitios web tienen una gestión de permisos propia, independiente de los otros websites, por lo que éstos se deben solicitar específicamente para el sitio concreto con el que se va a trabajar. Por defecto, las páginas heredan los permisos del espacio web en el que se encuadran. Asimismo, se pueden solicitar permisos de edición para página específicas, de forma que la persona que trabaje con ella no pueda realizar modificaciones en otras páginas del espacio web ni en su portada.
Además, se puede realizar una personalización de la cabecera y el pie de página para todo el espacio web, que se verá reflejado en cada una de las páginas que lo conforman.
Como decíamos, las portadas de los espacios web cuentan con plantillas especiales propias distintas a las de las páginas, las cuales presentan imágenes y noticias. De ellas se hablará en su apartado correspondiente.
Plantillas de Portada
Plantillas de Página
Todas estas particularidades se reflejan también en las opciones de configuración del sitio web, accesibles desde su portada, diferentes de las de las páginas que lo componen. El espacio web permite la configuración, aparte de sus plantillas específicas, de:
Configuración de PORTADA de un espacio web
Configuración de una PÁGINA web.
Estos cambios solamente afectarán a dicha página.
Esta estructura se refleja, asimismo, en las aplicaciones web como Galerías o Archivos, que asocian galerías o documentos a los websites desde los que se crean.
Cuando accedemos al modo edición (pulsando en el botón Editar) se abrirá, en la parte izquierda, la columna de herramientas del gestor web. El Gestor cuenta con los siguientes elementos y partes principales, a los que accederemos pulsando sobre ellos, lo cual desplagará su menú de opciones:
Pulsando en ella se ofrecerá una vista previa de la página o portada en la que trabajamos, la cual nos permite ver cómo está quedando sin necesidad de actualizar la página (lo cual es de utilidad especialmente si estamos realizando modificaciones en una página ya publicada y no queremos que sea pública hasta estar terminada). No todos los widgets ofrecen la vista previa exacta de cómo van a quedar, en especial las galerías. Veremos un aviso advirtiendo de que nos encontramos en el modo vista previa.
En él se configura el estado de la página o portada y se actualiza para reflejar públicamente los cambios. Como veíamos en el apartado anterior, las diferencias intrínsecas entre la portada del sitio web y las páginas conllevan también diferencias significativas entre los menús de estado.
En ella encontraremos:
Del mismo modo que en la portada, en cada página podremos ver el estado en que se encuentra y su visibilidad:
Estos elementos se tratarán de forma extensa en el apartado 2.3 Visibilidad, permisos y publicación.
Cuando desplegamos el menú Añadir se muestran los distintos widgets que podemos insertar en nuestra página web o portada. Cada uno de estos componentes está concebido para incluir en la web un tipo de contenido o información concreta: un mapa, unos iconos que enlacen a diversos recursos, un formulario, texto... Elegiremos, por tanto, en cada ocasión el tipo de widget que se ajuste a nuestras necesidades de cara a la edición de la página web. Veremos a lo largo del curso cómo trabajar con cada uno de ellos.
Para insertar un widget en nuestra página debemos pulsar sobre su icono y arrastrarlo soltándolo en la posición de la página en que deseemos insertarlo. Estas posiciones vienen marcadas en las plantillas por un fino recuadro que nos indica dónde podemos insertarlo y qué ancho de columna va a ocupar. En cada uno de los bloques de la página podremos insertar tantos widgets como deseemos. Si ya hay presente un componente en ese marco podremos insertarlo encima o debajo, posición que será resaltada por el gestor en gris.
Al soltarlo aparecerá un recuadro con la barra superior naranja y el tipo de widget insertado. En principio estará vacío: tan sólo aparecerá el mensaje "Debe pulsar en configuración para poder utilizar este widget". Vamos, pues, a dotarlo de contenido.
Para introducir la información necesaria en el widget debemos acceder a la configuración del mismo. Hay dos maneras:
Al acceder a su configuración veremos normalmente tres pestañas:
Pantalla de configuración de un widget Documentos y enlaces
Pestaña Apariencia del widget Documentos y enlaces
Pestaña Permisos del widget Noticias y avisos
Cuando hayamos configurado e introducido la información en el widget, pulsaremos en los botones Aceptar y Cerrar y quedará guardado automáticamente en la web a la espera de publicarlo mediante la actualización de la página o portada. Esto nos permitirá seguir trabajando en él hasta que lo consideremos terminado y listo para publicación. Para volver a acceder pulsaremos sobre el icono de la rueda dentada.
Si por algún motivo deseamos retirar el widget de nuestra página web tenemos dos opciones a las que accedemos pulsando sobre el icono de cierre:
Las opciones de configuración de página o portada nos permiten administrar varios aspectos esenciales de la misma:
Estas opciones de configuración se explican con detalle en los apartados:
Como hemos visto en el apartado 1.3, los sitios web se componen de páginas jerarquizadas en una estructura concreta. Para movernos por dicha estructura contamos con el menú Jerarquía de páginas. Nos permite desplazarnos por todas las páginas del sitio web independientemente de su estado de publicación o visibilidad, siempre que tengamos los permisos adecuados. De este modo, podremos llegar a una página que, por ejemplo, esté en modo Borrador para seguir trabajando en ella, mientras que desde la vista pública no podremos acceder a ella.
Aunque podemos concebir la jerarquía de página como un árbol, este menú solamente muestra un nivel cada vez de las páginas hijas de la portada o páginas en la que nos encontremos, de modo que debemos ir navegando seleccionándolas descendiendo hasta la página a la que deseemos acceder. Marcará en negrita azul la página en la que nos encontremos, en verde la página superior de la que cuelga y en negro las páginas hijas a las que podemos acceder pulsando sobre su título. Para volver a subir, pulsaremos sobre la página superior en verde, salvo en el caso de la aportada en que, obviamente, no hay página superior.
En su parte inferior encontramos la opción Gestionar páginas hijas, con la que accedemos al menú para cambiar el orden en el que las páginas aparecerán en los submenús o los permisos de visibilidad.
Esta herramienta está disponible y visible solamente cuando hemos desactivado y guardado un componente (un widget de texto, un widget de redes sociales, etc.). Aparecerá aquí identificado por el tipo de componente desactivado. Para reactivarlo y recuperarlo solamente hemos de pulsar sobre él y arrastrarlo hasta el marco de la página donde deseemos insertarlo. Cuando hay más de un componente desactivado éstos se van "apilando" en orden, de forma que los desactivados más recientemente quedan "encima". Para llegar a uno concreto debemos retirar primero los desactivados más recientemente.
Abre las respectivas aplicaciones para trabajar con archivos y documentos, imágenes y formularios.
Todo el mundo debería estar familiarizado con las partes de una URL y su empleo en los enlaces, así como las diferencias entre dominio, website y página. Sin embargo, es muy común no tener clara la diferencia entre ellos, ni lo que es una URL relativa y absoluta.
Es importante tener claros estos conceptos antes de comenzar a editar páginas web, por tanto vamos a hacer un pequeño repaso a todo esto.
Para empezar, un dominio se define como un nombre registrado, seguido por un punto y un nombre de dominio superior. Estos dominios de nivel superior son un listado limitado y homologado por organismos internacionales como la IANA o la ICANN, sería lo que suele verse como .com
, .es
, .org
, etc.
En nuestro caso, el nombre registrado es ucm
y el dominio de nivel superior es .es
, por tanto, el nombre de dominio y todas las direcciones dentro de la Universidad Complutense tienen el formato: ucm.es
El tener registrado un dominio no implica que exista una página web. Para que existan dichas páginas web tiene que haber una serie de ordenadores que las almacenen y las sirvan.
Una vez tengamos nuestro dominio ucm.es
, normalmente, para tener mayor flexibilidad y poder almacenar distintos contenidos, podemos crear los llamados subdominios. Por ejemplo:becas.ucm.es
, biblioteca.ucm.es
, etc.
Tener distintos subdominios nos ofrece una gran flexibilidad, pues podemos usarlos para dar mayor visibilidad a un contenido albergado en un mismo servidor web. O incluso que los contenidos sean dispares y cada dominio lo gestionen servidores/ordenadores distintos.
En el caso de la web UCM, podemos encontrar de ambos tipos. Por ejemplo tribuna.ucm.es
y www.ucm.es
son dos páginas web, que usan la misma aplicación y estan almacenados en los mismos servidores.
Sin embargo webs.ucm.es
y becas.ucm.es
son páginas que usan aplicaciones distintas que están almacenadas en servidores distintos.
Distinguir si los dominios usan distintas herramientas de gestion de contenido (CMS) y están ubicados en servidores dferentes no es inmediato y hay que inspeccionar con detalle las páginas para poder averiguarlo.
Las URL o direcciónes de las páginas, se forman con una serie de elementos, como el protocolo de comunicación, que en caso de la web puede ser http
(sin cifrar) o https
(cifrado), después encontramos el dominio como ya hemos comentado anteriormente y una serie de elementos separados por "/
" que identifican las carpetas, hasta el último elemento que siempre corresponderá a la página en que nos encontramos.
Veamos un ejemplo:
En el caso de la ruta de carpetas, según esté programada la herramienta de esa web, puede no existir y todo quedar reducido a la página.
En el caso del gestor web de la UCM, no existe una estructura de carpetas como tal. La jerarquia de páginas de un website no se ve trasladada a una ruta URL que la refleje.
En el caso de dominios propios que están dentro del gestor web (por ejemplo educacion.ucm.es), siempre serán websites y sólo tienen un primer nivel, que son las páginas que cuelgan de él, por ej: https://educacion.ucm.es/servicios-centro
En el caso del dominio principal www.ucm.es
, ese primer nivel puede representar tanto un website como una página.
Si es un website, su nombre o logotipo aparecerá en la cabecera de la página. Por ejemplo: https://www.ucm.es/informacion
Si es una página, la cabecera sólo mostrará el logotipo de la UCM.
Los websites que cuelguen de www.ucm.es
tendrán un segundo nivel, que identificará la página dentro de ese website, pero no más niveles. Por ejemplo: https://www.ucm.es/informacion/facultades-1
Conviene recordar que por convenio y compatibilidad con todo tipo de navegadores, no se deben usar caracteres especiales en las URL. Sólo son admisibles caracteres alfanumericos y guiones medios - o a lo sumo guiones bajos
_
. Aunque la herramienta de edición de páginas web lo permita, nunca se deben usar caracteres acentuados ni espacios.
Como ya hemos visto anteriormente, en el caso de la UCM los websites son conjuntos de páginas, que tienen las siguientes características especiales:
Las páginas son simples contenedores, que heredan los elementos comunes del website (como cabecera y pie) y que por defecto también heredan sus permisos.
Una URL absoluta incluye toda la ruta, desde el protocolo de comunicación https
, pasando por el dominio y la ruta de carpetas hasta la página, Siguiendo con los ejemplos anteriores la siguiente URL sería absoluta: https://www.ucm.es/informacion/facultades-1
URL relativa: Cuando dentro de un website, estamos enlazando páginas que forman parte de él, podemos sustituir la parte correspondiente a la URL base que nos indica el website, por simplemente un punto ".
" o si quisieramos hacer referencia a un elemento que se encuentra en una jerarquia de carpetas en un nivel superior, por dos puntos "..
"
Siguiendo con el ejemplo de la página de Información, si desde dentro de dicho website quisieramos realizar un enlace a una página como https://www.ucm.es/informacion/estudiantes-internacionales
, podríamos usar una ruta relativa y omitir su URL base (https://www.ucm.es/información
) escribiendo simplemente: ./estudiantes-internacionales
. Como se puede ver, la URL base que define el website, la hemos sustituido por un punto.
No obstante, si desde dentro del website quisieramos enlazar una página externa a él, por ej: https://www.ucm.es/agenda-1
nos veriamos obligados a usar la ruta absoluta, al igual que si quisieramos hacer referencia a una página de otro dominio como por ejemplo https://www.facebook.com
El uso de URL relativas es el sistema más recomendable de establecer enlaces dentro de un website, pues si por cualquier motivo, su URL base cambiara, no habría que actualizar todos los enlaces que hay dentro de él.
Una forma muy simple de comprobar la URL a la que apunta un enlace es dejar el cursor sobre él. La mayoria de los navegadores mostrarán la dirección a la que apunta el enlace en la esquina inferior izquierda de la ventana.
Se puede también comprobar la dirección de un enlace, pulsando botón derecho sobre él y seleccionando la opción Copiar dirección del enlace. Luego bastará con pegar el enlace en cualquier elemento, desde la barra de direcciones a un bloc de notas.
Cuando empezamos con la edición de un website, tenemos que distinguir los siguientes elementos que forman la estructura común a todos los websites que se crean con el gestor.
Empezando por la parte superior encontrariamos:
Común a todas las páginas y que consta de:
https://www.ucm.es
)Inmediatamente después de la cabecera, encontrariamos el cuerpo. Este es distinto según cada una de las páginas que formen el website. El mismo, en general, se divide en una serie de contenedores estructurados en una o más
columnas según la plantilla que elijamos:
Común a todas las páginas del website y constaria de los siguientes elementos:
contacto
" local al website.aviso-legal
" local al website.