Crear un sitio web con Google Sites

Con esta presentación de Luís Barriocanal nos podemos hacer una idea sobre las características y posibilidades de Google Sites y sus herramientas de edición colaborativa: Páginas Web, Anuncios, Listas, Gadgets, …

El Sistema Operativo Google (habrá que empezar a llamarlo así dado que ya casi ofrece los mismos servicios que un S.O. clásico) dispone desde no hace demasiado tiempo de Google Sites. El predecesor de Google Sites fue Page creator, un servicio que también se ha quedado por el camino y para el cual ya no aceptan usuarios nuevos, aunque permiten la continuidad de las páginas actualmente existentes. Page Creator permitía la elaboración de páginas web sencillas de forma individual, no cooperativa.

Google Sites permite la creación de Sitios Web de forma muy flexible. Puede ser utilizado tanto para elaborar un sitio web tradicional, como un blog, un wiki con capacidades restringidas o un foro de discusión. No obstante, para el visitante externo, Google Sites presenta las funcionalidades de una página web tradicional, es decir, sin posibilidad de interacción con los contenidos. Sólo los usuarios expresamente invitados al sitio pueden utilizar toda su capacidad.

Dispone de 3 modalidades de usuarios:

  1. Propietarios (Owners) que pueden gestionar todo el sitio añadiendo contenido nuevo, eliminando el ya existente, gestionar los usuarios o modificando el aspecto visual.
  2. Colaboradores (Collaborators) pueden crear contenido, modificar el ya existente, escribir comentarios o subir archivos.
  3. Simples usuarios o lectores (Viewers): este es el usuario por defecto para aquellos que visiten el sitio si éste es abierto. Si decidimos cerrarlo al mundo exterior, aquellas personas que definamos como lectores podrán ver nuestro sitio pero no añadir ni modificar nada.

Resaltar la sencillez con la que podemos crear contenidos sin necesidad de aprendizaje previo, ya que si estamos acostumbrados a usar editores wysiwyg (=lo que ves es lo que obtienes) no tendremos dificultad alguna en poder crear páginas web desde el primer minuto.

Las tres grandes ventajas de Google Sites son las opciones de privacidad, podemos definir con quien compartimos las páginas editables (gente del mismo dominio, todo el mundo o una lista propia), los tipos de página que podemos crear (un repositorio de archivos con 10GB por cuenta) y la facilidad de uso.

La plasticidad de las páginas de Google Sites hace que la funcionalidad entre un wiki, un blog o un foro de discusión esté determinada casi únicamente por el uso que queramos darle nosotros.

Las páginas guardan el historial de las diferentes versiones por las cuales han pasado y se puede volver a cualquiera de ellas cuando se desee. Además, todos los usuarios con permiso pueden escribir en ellas, dejar comentarios al pie de la misma o adjuntar archivos a cada página en particular. Esta es la capacidad wiki que está presente en los diferentes tipos de página que se pueden crear.

Cuando se crea una página, uno de los tipos entre los que podemos elegir es Anuncios. Produce una página que podemos usar como un blog clásico, como foro de discusión o como tablón de anuncios. La auténtica ventaja de este tipo de página es que se simplifica todavía más la edición de artículos si lo comparamos con Blogger o WordPress. En la parte superior de esta página hay un botón Nueva entrada, cuando se pulsa aparece el editor en la misma página por lo que es una forma sencilla, rápida y muy eficiente para escribir artículos nuevos.

Tiene muchas más funcionalidades, como el almacenamiento de archivos siempre actualizados, información sobre las modificaciones y acceso a las distintas versiones; la creación de un mapa en forma de árbol de las páginas de forma automática, la existencia de páginas que pueden actuar para almacenar archivos de forma exclusiva, la posibilidad de hacer listas de tareas, insertar cualquier componente de Google como los documentos de Google Docs, calendarios de Google Calendar, etc.

Con la suscripción "al sitio o a cualquier página" podemos estar puntualmente informados de cualquier modificación que se produzca recibiendo un correo de aviso. Esto es muy útil cuando los editores del sitio son varias personas.

A través de Google Analytics podemos consultar y controlar el acceso a nuestro sitio mediante los informes que se generan.

Pero también tiene algunos inconvenientes:

  1. Google Sites no permite la inclusión de objetos incrustados que no sean del propio Google (YouTube, Google Docs, etc), por lo que no podremos incluir documentos de Scribd o presentaciones de Slideshare, por ejemplo.
  2. No dispone de ninguna herramienta para que el visitante ajeno al sitio pueda dejar ni tan siquiera un comentario, al menos por el momento, ya que se hace difícil pensar que esto seguirá de este modo por tiempo indefinido.

Como tantos otros productos, empezó sólo en inglés, pero ya la tenemos en español.

Para ir entrando en faena vamos a ver este pequeño video-tutorial ("Watch a short tutorial") en inglés subtitulado en español:

Lo mejor es que vayamos paso a paso. ¡Vamos allá!

1. Crear el sitio

Abrimos la página de Google Sites. Si tenemos una cuenta en Google, nos reconocera con nuestro nombre de usuario y sólo tendremos que añadir nuestra contraseña. Si aún no tenemos cuenta en Google tendremos que abrirla dándole los datos que nos pida. Haz clic sobre el botón "Aceptar".

A continuación,  sobre el botón Crear sitio (Create a Site).

Después se abrirá una página con un sencillo formulario que deberás cumplimentar con los siguientes datos:

Nombre del sitio (Site Name) , automáticamente se va poniendo a continuación la dirección que tendrá en Internet nuestra página.

Descripción del sitio (Site description): pequeña descripción opcional.

Contenido para adultos (Mature Content): señalamos esta opción si los contenidos son sólo para adultos.

Compartir con (Share with) : -la primera opción viene marcada por defecto-

  • Todo el mundo puede ver este sitio (Everyone in the world can view this site)
  • Sólo las personas que especifique pueden ver este sitio(Only people I specify can view this site)

Tema del sitio (Site theme): están visibles tres, pero al darle a la opción Más temas (More themes), podrás elegir entre muchos más.

A continuación debemos copiar el código que nos muestre la página y pinchar sobre el botón Crear sitio (Create site)

Ya estamos en nuestra página principal. La estructura que presenta, mientras no la cambiemos, es la siguiente:

  • Marco superior: nombre del sitio: Prueba curso cep
  • Marco lateral: manú de navegación
  • Marco principal: página principal (en la imagen: vacío)
  • Marco inferior: archivos adjuntos y comentarios.

Es la página que llamamos "de inicio", la primera que aparecerá al entrar en la web, o lo que es lo mismo el punto de entrada a todo el sitio. En ella colocaremos, además de la bienvenida o presentación, aquellos contenidos que puedan ser de más utilidad al visitante cuando ingresa en ella. Para construir ésta, o cualquier otra página que añadamos, haremos uso de las herramientas de edición que aparecen cuando hacemos clic sobre el botón Editar página. Para configurarla adecuadamente, pulsamos sobre Más acciones.

2. Editar la página

Lo primero que vemos es una barra de edición rápida con la que podemos elegir el tipo de letra, el tamaño, el formato y color de la fuente, numeración, viñetas, sangrías y justificaciones, quitar el formato o editar el HTML (sólo para iniciados).

También vemos cuatro menús desplegables que nos ofrecen la posibilidad de incluir muchos elementos:

  • Menú Insertar: para insertar cualquier tipo de elemento.
  • Menú Formato: cambia tamaños y pone algunos formatos especiales de texto.
  • Menú Tabla: para insertar tablas.
  • Menú Diseño: para elegir entre páginas a 1 ó 2 columnas.

Cualquier cambio que hagamos hay que aceptarlo con Guardar. Si, por el contrario, no queremos conservar los cambios optaremos por Cancelar.

Veamos ahora las posibildades de estos menús:

  • Menú Insertar: elementos simples (imágenes, enlaces, índice de contenidos, linea horizontal); servicios de Google (Calendario, documento de texto, álbumes web de Picasa, presentaciones, hojas de cálculo, formularios, vídeos de youtube o Google video); gadgets de Google (últimas entradas o posts, últimos archivos actualizados, liestas actualizadas, cuadros de texto, ...)

  1. Si insertamos alguna imagen, tenemos la opción de subirla desde nuestro ordenador (clic en "Examinar", localizarla y añadir) o poner la ruta de la imagen alojada en Internet (previamente hemos podido subirla a nuestra cuenta en Flickr o en Picasa). Para ello, recuerda: nos ponemos sobre la imagen>botón derecho> Propiedades> Copiar la url o dirección y pegar sobre la casilla correspondiente. Haciendo clic sobre la imagen aparecerá un menú de edición para adaptarla a nuestro gusto : alinear a la izquierda / centro/ a la derecha; tamaño pequeño / mediano / grande / original; ajustar : contorno de texto / sin contorno de texto; eliminar imagen.
  2. Si queremos insertar un enlace, tenemos tres posibilidades: enlazar con una página que ya tengamos creada en nuestro sitio (Página existente); sólo tenemos que señalarla entre las que nos aparecen listadas abajo; o bien podemos enlazar con otra web (Dirección web), para lo que escribiríamos o pegaríamos la url o dirección de ésta; o podemos crear una nueva página en el sitio y enlazar con ella (Crear página nueva), le pondríamos el título y eligiríamos el tipo de página. Esta facilidad para crear páginas recuerda al funcionamiento de las wikis. Si quieres que la página se abra en otra ventana, marca la casilla del final "Abre este enlace en una ventana nueva".
  3. Indice de contenidos: es un índice que corresponde a los distintos apartados o secciones que contiene un texto dentro de una página; es útil cuando se trata de un texto largo para poder moverse más rápidamente por él.
  4. Servicios de Google: podemos añadir facilmente un calendario, documentos, álbumes web de Picasa, presentaciones, hojas de cálculo, formularios, vídeos de youtube o Google video. Cuando se trata de un documento de texto, una hoja de cálculo o una presentación, se nos muestran los archivos que tenemos almacenados en Google Docs. Sólo tenemos que seleccionar el elemento que queremos insertar en nuestra página.


En el resto de los casos tendremos que pegar la dirección o URL del elemento y además completar algunos apartados para configurar el tamaño, incluir borde, etc.:

5. Gadgets: son artilugios, utilidades como últimas entradas (entradas recientes); archivos actualizados recientemente; elementos de lista recientes (últimos listados), ...Para poder insertar cualquiera de los tres primeros elementos, tenemos que haber creado las páguinas correspondientes que deberán contener información o archivos. En Insertar más tenemos para elegir entre miles de los que anuncia Google.

  • Menú Formato de texto: para establecer el tamaño y otros aspectos relacionados con el texto.

  • Menú tabla: permite insertar una tabla directamente y de manera gráfica marcando con el ratón el número de filas y columnas deseado:

  • Menú diseño: únicamente nos dan a elegir entre presentar cada página en una ó dos columnas:

3. Añadir nuevas páginas

Podemos cambiar el título de la página y añadir cuantas páginas consideremos necesarias para nuestro sitio.

Le ponemos nombre a la página que vamos a crear y elegimos uno de los cinco tipos disponibles:

- Página web simple: página en blanco que completaremos con los contenidos que queramos.

- Página a dos columnas: aparecen cuatro módulos vacíos, tipo tablero; al hacer clic sobre cualquiera de los módulos se despliega el menú insertar. Podemos montar páginas con distintos tipos de elementos (foto, documento, gadgets, ...) bien estructuradas. Podemos alterar la predisposición inicial añadiendo más módulos, marcando uno y "copiar y pegar", y eliminar los que queramos (marcar con el ratón y elegir opción "Eliminar").

- Anuncios: añadimos una página tipo Blog. Esta página se confecciona añadiendo entradas que se convertirán en anuncios informativos. Tendremos que poner el título a la entrada y, a continuación, escribir el contenido de la noticia.. Cuando guardamos aparece como un "post" de un blog con: título, fecha y hora en la que se ha publicado, autor de la publicación y el contenido. Si hay varias entradas, se ordenan cronológicamente en orden inverso, como en cualquier blog. También podemos elegir el número de "post" que queremos que se muestren.

- Página archivador o contenedor de archivos:se trata de una página preparada para almacenar y mostrar los archivos que queramos guardar en nuestro sitio. Le ponemos un nombre y podemos añadir un archivo (botón "Examinar" y "Subir"). Posteriormente, haciendo clic sobre el nombre podemos descargarlo y abrirlo, y acceder sobre el histórico de las distintas versiones guardadas del documento. Esto nos recuerda a las wikis.
Cuando tenemos muchos archivos podemos organizarlos en carpetas, eliminarlo y suscribirnos a cambios (Subscribe ti page change) para, si se ha producido algún cambio, nos llegue un correo de aviso a nuestra cuenta. Recordamos que disponemos de 100 Mb. para almacenar archivos.

- Página tipo lista: se trata de una página que contiene listados confeccionados a nuestra medida. Primero tenemos que ponerle un nombre y se nos abre una ventana con cuatro opciones: cualquiera de las tres primeras nos presenta unas plantillas con las listas ya estructuradas, si elegimos la última opción (crear tu propia lista) podemos crear desde el principio listados definiendo nosotros las columnas; hay que ponerles nombre o etiquetas a las columnas y elegir el tipo de contenido que va a tener adaptándose a nuestras necesidades; podríamos llevar el control de temas y mostrar una valoración final, podemos reflejar fechas, teléfonos, direcciones, etc.

Finalmente elegiremos la jerarquía de la página. Tenemos dos opciones:

1º. Ponerla en el nivel más alto. Es la opción por defecto. Supone una página más junto con la de Inicio (Home)

2º. Ponerla debajo: sería una subpágina

4. Configurar nuestro sitio

1. Compartir este sitio. Un sitio puede ser compartido con todo el mundo (público) o con los usuarios que especifiquemos. Como dijimos al principio, hay tres posibilidades de interactuar:

  • Como propietario: tiene todos los privilegios para gestionar el sitio
  • Como colaborador: puede crear, editar, mover y borra páginas; añadir archivos adjuntos y comentarios; añadir y eliminar páginas del menú lateral de navegación; suscribirse a los cambios que se produzcan en el sitio
  • Como simple usuario o lector: sólo puede ver las páginas.


El sitio creado nos permite invitar a otros como propietarios, colaboradores o lectores, a través del formulario donde escribiremos las direcciones de correo, que podemos extraer de nuestros contactos de gmail. Si el sitio es "público", es decir queremos que todo el mundo pueda verlo, en el apartado "permisos avanzados" deberá estar marcada la casilla correspondiente. Si, por el contrario, queremos que sea "privado", deberemos desmarcarla. Espa opción también está disponible durante el proceso de creación y registro inicial del sitio. En la columna de la derecha iremos viendo toda la información sobre los usuarios que participan en el sitio.

2. Cambiar aspecto. Veamos cómo cambiar el aspecto de nuestra página.

Por defecto nuestra página ocupa el ancho de toda la pantalla (100)

  • Si queremos que quede un espacio libre a ambos lados y no completar la pantalla, debemos cambiar el ancho a 90, 80, 70, .... Vamos probando hasta que quede a nuestro gusto. Si hemos puesto un tema de fondo con esta anchura será visible sin problema.
  • Desmarcando la opción "cabecera", eliminaremos el marco superior que contiene el título y el logo. La altura está condicionada por defecto al tamaño del logo. Podemos cambiar también la altura.
  • Desmarcando la la opción "barra lateral", eliminamos la barra lateral y tendremos una web a toda página y sin marcos laterales.
  • Elegiremos el marco a la derecha o a la izquierda y, si queremos, cambiaremos también la anchura que por defecto viene a 150.

El logo está predeterminado arriba a la izquierda en la cabecera y no admite otra posición. Si queremos poner otro logo, haremos clic en "cambia el logotipo"

Podemos prescindir del logo ("sin logotipo"); si optamos por añadir uno, lo buscaremos con la opción "Examinar", una vez lo tengamos dimensionado a la altura que hemos fijado en la cabecera. Pulsamos "Aceptar" y "guardamos los cambios".

La barra lateral tiene una anchura de 150 píxeles y, en principio, está formada por dos cuadros o módulos:

  • Navegación: menú de navegación
  • Actividad reciente del sitio: información sobre los últimos cambios realizados en el sitio.

Podemos adaptar la barra lateral a nuestras necesidades con las opciones Editar, suprimir o añadir un nuevo módulo. En el menú navegación situaremos los hiperenlaces a páginas que existen dentro del sitio, que hemos creado previamente. Podemos cambiar el título "navegación" por otro. Con las dos flechitas que apararecen a la derecha podemos cambiar el orden del listado de las páginas. Si queremos añadir alguna página ya creada para que se vea en este menú hacemos clic en "añadir página a la navegación de la barra lateral", y la seleccionamos del mapa de navegación que se nos muestra.

  • Podemos añadir nuevos módulos en la barra lateral haciendo clic en "Añadir un elemento en la barra lateral". Nos ofrecen 5 opciones:
- Navegación: enlaces a páginas sueltas del sitio
- Texto: para añadir texto. Con esta opción podemos insertar enlaces a sitios externos, incluir iconos, dibujos, logos, ...
- Actividad reciente del sitio: una lista de las últimos movimientos del sitio
- Cuenta atrás: un contador de días a una fecha que tendremos que especificar. Puede tener una finalidad informativa si queremos destacar la fecha de algún acontecimiento...
Una vez creados, podemos ordenar los módulos en la barra lateral pinchando sobre ellos y arrastrándolos al lugar donde queramos colocarlos.

Cambiar los colores y las fuentes

Seleccionamos un elemento y, con la barra deslizante, podemos cambiar el color del título, el fondo, el marco lateral, etc. Podemos poner una imagen como fondo de cabecera, de página o de barra lateral para lo que la seleccionaríamos buscando la imagen en nuestro ordenador con el botón "Examinar".
Tenemos seis tipos de letra o fuente para elegir:

Los cambios que vayamos haciendo se irán mostrando en la parte inferior de la pantalla.
Podemos elegir entre una serie de temas. Para ir probando debemos hacer clic en "Vista previa".


En la pestaña Más podemos:

  • Poner un nombre al sitio
  • Si no queremos mostrar el nombre del sitio arriba de las páginas debemos desmarcar esta opción.
  • Describir brevemente el sitio.
  • Indicar si el contenido es sólo para adultos.
  • Cambiar la página de entrada o inicio cuando se accede al sitio, por defecto es la página "Home"
  • Activar las estadísticas a través de Google Analytics donde habrá que darse de alta siguiendo los pasos que nos indican; después se nos mostrará un código ID de propiedad web de Analytics. Habrá que esperar unas 24 horas aproximadamente para ver si funciona. Siempre que queramos ver las estadísticas, podremos hacerlo entrando en Google Analytics. Si queremos saber más sobre esto, pinchar sobre Más información.
  • En un cuadro situado a la derecha tenemos la información referida al espacio ocupado de los 100 Mb disponibles en nuestra cuenta.



5. Configurar una página

Una vez abierta la página: Mas acciones > Configuración de la página:

Podemos elegir la configuración que más nos interese. Conviene recordar que al nombrar las páginas no debemos utilizar caracteres como la ñ, ni tildes o diéresis.

Para repasar puedes seguir este estupendo manual para aprender a utilizar Google Sites de Manuel López Caparrós

6. Ejemplos

Este curso está editado y publicado con Google Sites.
Algunos ejemplos para hacerse una idea del aspecto que pueden tener estos sitios:
Classroom, Ski Club, Play group, Family website, Team Project, Company Intranet.

En esta presentación realizada con Google Docs Manuel López Caparrós nos muestra algunos ejemplos de uso de Google Sites en la gestión de un centro educativo:


Más ejemplos de aplicación de Google Sites en el mundo educativo:



Comments