configuración de una página web en

Google Sites

En este apartado trataremos los primeros pasos para la configuración de una página web en Google Sites.

Índice

Desde una Cuenta de Gmail

Pasos para entrar en Google Sites

Opción 1:

Una vez "logueados" en nuestra cuenta Gmail, podemos localizar Sites de Google haciendo clic sobre los "9 puntitos" de Aplicaciones Google.

Seleccionamos Drive, nos vamos a + Nuevo y hacemos clic en Más.
Se desplegará una segunda ventana donde encontraremos la opción Google Sites. Seleccionamos y automáticamente se nos abre nuestro lienzo para comenzar a diseñar nuestra página.

Opción 2 (y más rápida):

Desde nuestra cuenta de usuario de Gmail, abrimos una página nueva y en la barra de direcciones escribimos sites.new pulsamos Enter y nos lleva de nuevo a una nueva página en Google Sites.

Acceder desde Drive y desde html.mp4

Interfaz del escritorio

Como se observa en la imagen de la izquierda, la zona resaltada de rojo es el lienzo o zona de trabajo para diseñar y editar nuestra web integrando contenido.

En la otra zona bordeada de azul nos encontramos con el menú de las diferentes herramientas de diseño y edición.

Elegir un tema

En la parte lateral derecha disponemos de un menú, donde se observan tres opciones: Insertar, Páginas y Temas.

Para comenzar con la creación de nuestra página web, seleccionaremos en primer lugar el tema, y personalizaremos eligiendo color y estilo de fuente.

Sites nos ofrece cinco estilos prediseñados: Aristóteles, Diplomático, Visión, Uniforme e Impactante.

Como se observa en el vídeo, al cambiar de diseño se modifican algunos parámetros de nuestra página.

También podemos crear nuestro propio Tema partiendo del estilo Sencillo (parte superior) y haciendo clic en +.

Vídeo sin título ‐ Hecho con Clipchamp.mp4

Añadir páginas y subpáginas

Para dar una estructura organizada de la información que queremos ofrecer a nuestros usuarios, tenemos la opción Páginas.

Al hacer clic sobre ella, nos aparece la página Inicio y, en la parte inferior del cuadro de herramientas, el botón +. Hacemos clic sobre él, aparecerán cuatro opciones. Seleccionamos Nueva Página. Automáticamente se abre una ventana de diálogo, Nueva página, donde se nos pide que escribamos el Nombre que deseamos darle. Una vez escrito, clicamos en Hecho y aparecerá la nueva página bajo la de Inicio.

Podemos ir creando diferentes páginas del mismo nivel siguiendo los pasos anteriores.

En caso de querer cambiar el orden de aparición, hacemos clic sobre la página que deseamos mover, quedará resaltada, y tan solo arrastrando hacia arriba o hacia abajo, la podremos situar en el lugar deseado.

2024-08-09 07-59-16.mp4

2024-08-09 08-02-51.mp4

Si necesitamos crear subpáginas que partan de las páginas principales, situaremos el puntero sobre la página de la que queremos añadir subpáginas, nos aparecen tres puntitos y haremos clic en ellos. Nos aparecen varias opciones y hacemos clic en Añadir una subpágina. Le damos nombre y al clicar en Hecho, nos aparece una nueva página que depende de su principal, a modo de jerarquía de páginas y subpáginas.

Otra manera fácil y rápida de seguir creando subpáginas de la misma página, sería situarnos sobre la subpágina y clicar sobre los tres puntitos de la derecha, seleccionar Duplicar página, asignamos un nombre a la nueva subpágina y clicar en Hecho. De esta forma iremos dando estructura a nuestra web y creando un menú.

El esquema o menú de nuestra web podemos crearla al principio, pero también se puede modificar en cualquier momento añadiendo, suprimiendo o moviendo de lugar las páginas y las subpáginas.

Añadir una página externa CON NUEVO ENLACE

Una opción a tener en cuenta es la necesidad de incluir una página externa integrada en nuestro menú. Los pasos que deben seguirse son tan intuitivos como los anteriores:

Seleccionamos Páginas.
Clicamos en el botón +.
Seleccionamos Nuevo enlace.
En la ventana emergente "Nuevo enlace" escribimos el nombre de la nueva página y colocamos la URL de la página externa que deseamos incluir en el menú. Es aconsejable activar la acción de Abrir en una pestaña nueva.
Clicamos en Hecho y Publicar.

2024-08-13 16-11-18.mp4

INSERCIÓN DE UNA página COMPLETA

2024-08-13 16-35-41.mp4

El vídeo de la izquierda muestra cómo es posible insertar una página completa añadiendo el código HTML. Se trata de un ejemplo práctico en el que se debía incluir en un Site colaborativo, un Padlet previamente elaborado por los alumnos.

Para ello se obtiene de la aplicación externa (en este caso Padlet) el código HTML y se copia en el portapapeles.
En el escritorio de Sites seleccionamos Página y el botón de +.
Seleccionamos Inserción de página completa y clicamos en Hecho.
La nueva página nos pedirá insertar el código en el botón Añadir elemento insertado.
Nos aparece una pequeña ventana que nos propondrá añadir por URL o Insertar código.
Seleccionamos este último y pegamos el código copiado.
Insertar y Publicar.

Ocultar páginas

En ocasiones podríamos necesitar ocultar una página. La forma de hacerlo es muy sencilla. Situamos el puntero sobre la página que no queremos que quede a la vista de los usuarios y clicamos en los tres puntos de la derecha. Entre todas las opciones, seleccionamos Ocultar de la navegación.

Con esta acción no mostramos la página en el menú, pero seguimos teniendo acceso a ella como editores. Incluso podemos compartir su enlace con las personas que quisiéramos y estarían visibles para ellas.

En este ejemplo se ha ocultado la Guía didáctica del profesor. El usuario no lo verá en el menú, pero sí puede ser consultada por cualquier persona que tenga el enlace.

2024-08-09 08-10-03.mp4

Editar encabezado de la web, añadir un logotipo y un icono de la página

Para comenzar a personalizar nuestra página web nos situamos en la página de Inicio y seleccionamos Insertar. Necesitamos cambiar el título, la imagen del encabezado y añadir un logotipo de la página.

2024-08-09 08-25-51.mp4

Colocamos el puntero sobre la cabecera del lienzo y seleccionamos Título de la página, que quedará resaltada con un marco de color azul. Seleccionamos el todo el texto y escribimos el título deseado para nuestra web. Clicamos fuera del recuadro y ya tendremos nuestro título personalizado.

De igual manera nos situamos en la parte superior izquierda y escribimos el mismo título, u otro, siguiendo los pasos anteriores. Al hacer clic sobre este cuadro de texto, nos aparece Añadir logotipo.

Para realizar la acción de añadir logotipo clicamos en la ventanita emergente. Se desplegará un nuevo cuadro de diálogo denominado Configuración. En este momento ya es posible añadir una Imagen de marca. Seleccionamos la opción y subimos de nuestro dispositivo el logotipo. Observaremos que Sites ha extraído los colores principales del logo y que podemos seleccionar cualquiera de ellos para aplicarlos en nuestro tema si lo deseamos.

También podemos asignar un icono para nuestra web que le dé más identidad. Solo hay que seguir los mismos pasos que se han realizado para añadir el logotipo.

2024-08-09 08-41-58.mp4

2024-08-09 08-38-40.mp4

Del mismo modo podemos personalizar el encabezado con una imagen.

Colando el puntero sobre el encabezado nos aparece nuevamente las opciones de diseño y en su parte izquierda seleccionamos Imagen. Automáticamente nos aparecen más opciones: Subir y Seleccionar.

Google Sites nos proporciona una colección de imágenes que podemos seleccionar haciendo clic en Seleccionar imágenes y después Galería. En ella nos propone una gran y variada colección que podemos aprovechar.

También podemos insertar una imagen clicando en:

Desde URL, y añadiendo la URL de la imagen que hayamos localizado en Internet y clicando en INSERTAR IMAGEN;
Google imágenes, nos aparece la ventana de búsqueda en Google Imágenes, escribimos las palabras clave que faciliten la búsqueda de lo que nos interesa, y una vez aparezcan la nueva colección de imágenes, hacemos clic sobre la elegida y después en Insertar;
Google Fotos, al seleccionar nos aparece una ventana con las nuestras propias fotos. El procedimiento es como en el caso anterior, clicar sobre la imagen e insertar.
Google Drive, si optamos por seleccionar una imagen que tengamos alojada en nuestro Google Drive, el procedimiento es igualmente sencillo: la seleccionamos e insertamos.

TRATAMIENTO DE LA IMAGEN DEL ENCABEZADO

Después, podemos modificar la Transparencia de la imagen, que facilitará la lectura, y Anclar imagen, de modo que sea más visible la parte de ella que más nos interese.

Las opciones se nos muestran en la parte inferior derecha, tal y como se muestra en la imagen.

Tipos de encabezado

Seguidamente, podemos cambiar el tipo de encabezado, que puede ser Portada, Encabezado grande, Encabezado normal, o Solo título.

Estas opciones aparecen en la parte inferior izquierda al posicionar el puntero sobre el encabezado. En la imagen aparece rodeado de amarillo.

Configurar el menú

Para ir a Configuración podemos hacerlo desde la parte superior izquierda del encabezado, como ya hemos visto anteriormente; pero también, podemos abrir la ventana Configuración desde la ruedecita que está localizada en la parte superior derecha del escritorio, como puede observarse en vídeo.

El menú puede estar situado en la parte superior o en el lateral izquierdo, y podemos optar entre el color blanco, el color negro o transparente.

Page updated

Report abuse