Introducción a los edublogs: insertar contenido multimedia

IES Sevilla la nueva
30 de Noviembre de 2010
SEMINARIOSEMINARIO
INTRODUCCIÓN A LOSINTRODUCCIÓN A LOS
EDUBLOGSEDUBLOGS

ÍNDICE DE LA SESIÓNÍNDICE DE LA SESIÓN
1. Insertar un enlace en una entrada del blog
2. Insertar una imagen en una entrada del blog-Guiada-
3. Insertar un vídeo en una entrada del blog
4. Compartir un vídeo de youtube a través del blog-Guiada-
5. Configuración del Blog.
6. Diseño del Blog: 6.1 Elementos de la página
6.2 Diseñador de plantillas
6.3 Edición de HTML
7. Gadgets
8. Canales RSS. Sindicación de contenidos.
9. Paint y los blogs
10. Páginas estáticas
Actividades

1.1. Insertar un enlace en unaInsertar un enlace en una
entrada del Blog.entrada del Blog.
• Una práctica muy común en los blogs, es utilizar sus
entradas como nexo de unión con otras páginas web. Para
poder realizar esta función, es necesario que sepamos crear
enlaces (hipervínculos) en el texto de una entrada. De esta
manera, los usuarios que lean una entrada, podrán acceder
directamente a un sitio web determinado, sin más que hacer
clic en el texto en el que hayamos creado el hipervínculo

- En primer lugar creamos una entrada, que llamamos
“Visita la Web del instituto”.
• Inserción guiada de un enlace en una entrada de nuestro blog
- A continuación seleccionamos una palabra del texto
donde crearemos el hipervínculo.

- Pinchamos en el icono Enlace del Editor Web.

- En el cuadro de diálogo que nos aparece escribiremos la URL de destino del enlace, en nuestro caso
www.iessevillalanueva.es y a continuación aceptaremos y publicaremos la entrada.

2.2. Insertar una imagen en unaInsertar una imagen en una
• A veces, cuando publiquemos una entrada en nuestro blog,
vamos a querer insertar una imagen para compartir con
nuestros visitantes. Esta operación es muy sencilla, y es la
ideal para compartir una o dos imágenes a través de nuestro
blog. Si lo que queremos es compartir más imágenes,
deberemos recurrir a otro método, que utiliza Picasa o
Flickr para crear álbumes de fotos. Esto lo veremos más
adelante.

• Para insertar una imagen de nuestro equipo en una
entrada, lo único que debemos hacer es pinchar en
el icono imagen, de la barra de formato

• Actividad guiada: Creación de una entrada con una imagen de tu equipo.
1. Vas a crear una entrada en tu blog con una imagen. Piensa en el tipo de
entrada que quieras crear y busca una imagen en Internet que guarde relación
con ella.
2. Entra en la página de Google y teclea en la barra de búsqueda, una palabra
clave que guarde relación con la imagen que quieres obtener. Pulsa en buscar,
y a continuación pulsa en imágenes, en la esquina superior izquierda.

3. Echa un vistazo a las
imágenes y cuando
encuentres la que quieres
utilizar sitúate sobre ella
y haz clic con el botón
derecho. Selecciona la
opción guardar imagen
como y guarda la imagen
en tu pendrive.

4. Ahora entra en tu blog como autor para crear una entrada.
5. Para insertar la imagen pincha en el botón imagen de la barra
formato

6. La ventana emergente de Añadir Imagenes, nos permite subir imágenes de
cuatro maneras distintas.

7. Nosotros elegimos la primera
opción. Pinchamos en Elegir
archivos y buscamos la imagen
que queremos subir. Es
importante que respetemos los
formatos de imagen admitidos:
JPG, GIF o PNG.
8. Una vez que la imagen ha
sido almacenada en el Blog,
pinchamos en Añadir
imágenes seleccionadas. La
imagen se inserta en nuestra
entrada.

9. Haciendo clic sobre la imagen ya insertada, se abre la barra de
herramientas “Imagen”, que nos permite cambiar el tamaño, la
alineación, añadir una leyenda y eliminar la imagen.

10. Si queremos personalizar el tamaño de la imagen a nuestro gusto,
deberemos modificar el código html, concretamente las etiquetas
“height” y “width”.

• Ahora vamos a realizar una actividad parecida,
pero en vez de insertar una imagen vamos a
insertar un vídeo. Esto lo podemos hacer de dos
formas:
-Insertando un vídeo que tenemos almacenado
en nuestro equipo.
-Insertando un vídeo que se encuentra
almacenado en servidores externos. Los más
conocidas y por lo tanto con más contenidos:
Youtube y Teachertube
3. Insertar un vídeo en3. Insertar un vídeo en unauna

• Para insertar un vídeo que tenemos en nuestro
equipo, lo único que debemos hacer es pinchar en
el icono “Insertar un vídeo”.
• Navegaremos por nuestro equipo y elegiremos el
archivo de vídeo que queremos incorporar al blog.
3. Insertar un vídeo en3. Insertar un vídeo en unauna

• La otra opción es subir un vídeo desde un servidor
externo como puede ser Youtube o Teachertube.
• En este caso no subiremos el vídeo al blog con el
botón “Insertar un vídeo”, sino que lo que
haremos será buscar el código html del vídeo y lo
incorporaremos directamente a la entrada de
nuestro blog.
• En el siguiente punto explicamos como llevar a
cabo este proceso.
3. Insertar un vídeo en una3. Insertar un vídeo en una

• Accedemos al portal Youtube tecleando
www.youtube.com en la barra de
navegación.
• Teclea en el buscador situado en la parte
superior, la temática del vídeo
4. Compartir un vídeo de youtube4. Compartir un vídeo de youtube
a través de mi blog.-Guiada-a través de mi blog.-Guiada-

• Debajo del vídeo encontramos el botón
Insertar que nos va a permitir conocer el
código html del vídeo a compartir

• Al pinchar en ese botón se nos abre una ventana
donde podemos visualizar el código html y
además podemos realizar algunas modificaciones.

• Hay que tener en cuenta que si modificamos alguna de las
opciones, el código cambiará. Los parámetros que
podemos cambiar son los siguientes:
- Cambiar el tamaño del vídeo. Youtube solo nos
permite cambiar entre unos valores predeterminados.
Podemos optar por esto, o por modificar el tamaño
directamente desde la entrada, cambiando los valores de
“weight” y “height” del código.
- Incluir vídeos relacionados
- Mostrar borde con diferentes colores
- Activar el modo de mejora de la privacidad.

• Una vez realizadas las modificaciones oportunas,
copiamos el código html, para pegarlo en la
entrada de nuestro blog.
• Pegamos el código en la entrada que publicamos
con el título “Publicar un vídeo de youtube”
• En el caso de que sea necesario, ajustamos el tamaño del vídeo,
modificando directamente el código html.

5. Configuración del blog5. Configuración del blog
• Para acceder a las opciones de
configuración del blog, hacemos clic en la
pestaña Configuración de la ventana del
escritorio

• Desde la pestaña Configuración accedemos a diferentes
opciones:
- Básico
- Publicación
- Formato
- Comentarios
- Archivo
- Feed del sitio
- Correo electrónico y móvil
- Open ID
- Permisos

• Básico
Desde aquí podemos:
- Cambiar el título del blog
- Añadir una descripción del mismo
- Añadir el blog a las listas de blogger
- Permitir que el blog se incluya en los motores de
búsqueda de Google

• Básico
y también podemos:
- Mostrar los Enlaces de envío de entradas, para
poder enviar una entrada por correo electrónico.
Esta opción se puede automatizar desde la pestaña
“Correo electrónico y móvil”
- Especificar si el contenido del blog es para
adultos
• Para conservar los cambios pincharemos en:

• Publicació
n
Desde aquí podemos cambiar la dirección del blog, que
como ya sabéis no tiene por qué ser igual que el nombre del
blog.
Cambiar la dirección implica cambiar la URL del blog, es
decir, la dirección que vamos a teclear en la barra de
navegación del explorador para poder acceder a nuestro
blog.
Blogger también nos da la opción de crear un dominio
personalizado, previo pago claro.

• Formato
Desde aquí podemos cambiar entre otras:
- El número de entradas que se muestran en la ventana
principal del blog
- Formatos de fecha y hora del blog
- Seleccionar la franja horaria que debe aplicarse en nuestro
blog
- Cambiar el idioma del blog
- Mostrar el título de la entrada

• Comentarios
Desde aquí podemos cambiar aspectos directamente relacionados
con los comentarios que se pueden realizar a las entradas como son:
- Mostrar o no los comentarios
- Elegir quién puede hacer comentarios
- Elegir el mensaje para el formulario de comentarios
- Elegir el formato de hora para los comentarios
- Revisar los comentarios antes de que se publiquen
- Notificación por correo electrónico de los nuevos
comentarios.

• Permisos
Como ya vimos en sesiones anteriores, desde este menú
podemos elegir los usuarios que pueden tener acceso al
blog como lectores, e incluso los que pueden actuar como
coautores del blog. En ambos casos, y como ya se hizo en
un ejercicio anterior, es necesario mandar un mail de
invitación al usuario elegido.

6. Diseño del blog6. Diseño del blog
• Para acceder a las opciones de diseño del
blog, hacemos clic en la pestaña Diseño de
la ventana del escritorio

• Desde la pestaña Diseño accedemos a
diferentes opciones:
- Elementos de la página
- Edición de HTML
- Diseñador de plantillas
6. Diseño del blog6. Diseño del blog

6.1 Diseño del blog. Elementos6.1 Diseño del blog. Elementos
de la páginade la página
• Elementos de la página
Desde aquí podemos personalizar el aspecto de
nuestro blog, entre otras cosas, añadiendo y
organizando distintos elementos, llamados
“Gadgets”

• Elementos de la página
La distribución de los elementos que se nos muestra
depende de la plantilla que hayamos elegido, aunque
básicamente la estructura de todos los blogs es
similar. Vamos a encontrar:
1. Barra de Navegación
2. Cabecera de la página
3. Entradas de la página
4. Gadgets

1.Barra de Navegación.
Es fija. Únicamente podemos
cambiar el color de la misma,
para lo cual pincharemos en el
botón “Editar”.
Después deberemos guardar
los cambios, haciendo click en
“Guardar”

2. Cabecera.
También es fija. Para cambiar
la cabecera debemos pinchar
en el botón “Editar”.
Las opciones de configuración
incluyen cambiar el título del
blog, añadir una descripción
del mismo y una imagen.
Después deberemos guardar
los cambios, haciendo click en
“Guardar”

3. Entradas del blog.
Es un elemento fijo, cuyas
opciones de configuración
incluyen modificar el número
de entradas que se muestran
en la página principal, el
aspecto de una entrada
publicada (mostrar fecha,
quien publica la entrada,
etiquetas, edición rápida, etc.).
Para que los cambios tengan
lugar, deberemos hacer click
en “Guardar”

4. Gadgets.
Los Gadgets son totalmente personalizables, podemos elegir que Gadgets queremos
que aparezcan en nuestro blog y en orden.
Los Gadgets son diferentes aplicaciones que permiten personalizar a nuestro gusto el
blog.

4. Gadgets.
Existen gran variedad de Gadgets, entre los que podríamos destacar:
- Contribuyentes: Muestra una lista de usuarios que pueden crear entradas
en nuestro blog.
- Texto: Añadir texto que permanezca fijo en el blog, no como una entrada.
- Imagen: Incluir una imagen en el lateral.
- Presentación: Incluir una presentación de una galería de fotos en el blog.
- Encuesta: Incluir una encuesta para conocer la opinión de los usuarios que
acceden a tu blog.
- Actualidad: Incluir noticias de actualidad al azar, relacionadas con un
tema que tu elijas como Tecnología, Biología, etc.
- Etiquetas: Mostrar todas las etiquetas de las entradas que existen en el
blog. Esto facilita la búsqueda de entradas a los usuarios.
- Perfil: Permite mostrar o no tu perfil en el blog
- Etc.

6.2. Diseño del blog. Diseñador de6.2. Diseño del blog. Diseñador de
plantillasplantillas
Esta es una nueva posibilidad que Blogger ha incorporado
recientemente. Nos permite personalizar el aspecto de nuestra
plantilla.
• Diseñador de plantillas. Cambiando la plantilla de
nuestro blog

En la zona inferior se nos muestra una vista previa de nuestro
blog con las modificaciones que hayamos realizado. De esta
manera podremos comprobar si el aspecto del Blog es el que yo
deseo.
En la pestaña “Plantillas” podemos cambiar la plantilla de
nuestro Blog, acorde con las opciones que nos ofrece Blogger.
nuestro blog
6.2. Diseño del blog. Diseñador6.2. Diseño del blog. Diseñador
de plantillasde plantillas

Podemos elegir cualquiera de los modelos que nos ofrece
Blogger. Aunque parezca que las posibilidades de
personalización son pocas, nada más lejos de la realidad.
Una vez que hayamos elegido la plantilla, en la pestaña “Fondo”,
podemos elegir la gama de colores principal y la imagen de
fondo de nuestro blog.
nuestro blog

La gama de colores principal hace referencia al diseño de la zona
de trabajo del blog, es decir, a la zona donde se muestran las
publicaciones y los gadgets.
nuestro blog
Podemos hacer caso a las
sugerencias de Blogger o
buscar nuestra propia
combinación de colores

La imagen de fondo es la imagen que se muestra detrás de la
zona de trabajo.
nuestro blog

Pinchando en la
imagen, accederemos
a una galería que
Blogger pone a
nuestra disposición.
No tendremos más
que seleccionar la
imagen y hacer clic
en Finalizado.
nuestro blog

La tercera opción de personalización es poder cambiar el
diseño, es decir, la estructura de nuestro blog.
nuestro blog

Podremos cambiar el Diseño del cuerpo del blog para elegir
como queremos que sea la estructura de nuestro blog; si
queremos que las entradas se publiquen en el medio, si
queremos que haya una o incluso dos barras laterales, etc.
nuestro blog

También podemos cambiar el Diseño del pie de página, para
elegir entre poner gadets en una, dos o tres columnas.
nuestro blog

Y también podemos Ajustar el ancho, tanto de las barras
laterales como de la zona de publicación
nuestro blog

Por último, en la pestaña “Avanzado” podremos cambiar
todo tipo de opciones relacionadas el aspecto de las entradas,
gadgets, etc.
nuestro blog

6.3. Diseño del blog. Edición HTML6.3. Diseño del blog. Edición HTML
• Edición HTML
Desde aquí podemos
modificar la plantilla
actuando directamente
sobre el código html
de la misma. Esto nos
permite personalizar la
plantilla mucho más
que de cualquier otro
modo, pero para esto es necesario tener conocimientos de
html. Si os lanzáis a esta aventura, es recomendable que
hagáis copia de seguridad de vuestra plantilla, sin más que
pinchar en “Descargar plantilla completa” y guardar el
archivo en un lugar seguro.

Los Gadgets son aplicaciones que podemos incorporar
a nuestro blog, con el fin de hacer éste un sitio más
atractivo, práctico, intuitivo, etc.
7. Gadgets7. Gadgets
Existen muchos tipos de Gadgets. Para poder acceder
a ellos, lo único que tenemos que hacer es pinchar en
“Añadir Gadget”, en la pestaña Diseño/Elementos
de la página.

Texto Permite añadir unas palabras que permanezcan de
manera estática en tu blog. Puede ser un mensaje de
bienvenida, una cita, etc. También podemos poner un texto
que incluya un enlace a algún sitio web, algún archivo que
tengamos en “Google Sites”, etc.
De momento vamos a conocer 4 gadgets muy sencillos:

Imagen Permite añadir una imagen que permanezca de
manera estática en tu blog. Además podemos crear un enlace
en esa imagen, de manera que al pinchar sobre ella
accedamos a un sitio web determinado.

Encuesta Permite añadir una encuesta a tu blog para que los
visitantes puedan votar.

Lista Permite añadir una lista de cualquier cosa que te gusta y
quieras poner en conocimiento de los lectores de tu blog

Seguidores Permite crear botones para que los lectores de tu
blog puedan ser “seguidores” de tu blog y al mismo tiempo
hacer pública una lista de esas personas que siguen tu blog.

Enlaces de suscripción. Permite que tus lectores se suscriban
fácilmente a tu blog mediante los lectores de feed conocidos.

• Haz clic en “Añadir un Gadget” en la
columna de la derecha
Actividad -1-GuiadaActividad -1-Guiada
Creación de un enlace mediante texto al blog del cursoCreación de un enlace mediante texto al blog del curso
• Haz clic en el botón + del gadget Texto
• Escribe “Visita el blog del curso aquí” y crea un enlace en la
palabra aquí, al blog del curso

• Haz clic en “Añadir un Gadget” en la columna de la
derecha
Actividad -2-GuiadaActividad -2-Guiada
Creación de un enlace a la página web del centroCreación de un enlace a la página web del centro
mediante el uso de una imagenmediante el uso de una imagen
• Haz clic en el botón + del Gadget Imagen
• Descárgate la imagen del logo del centro del blog del seminario
• Crea un enlace a la página web del centro desde esa imagen

Una de las grandes novedades de la nueva Internet es que
muchas páginas web (en estos momentos, la mayoría) tienen
la capacidad de distribuir automáticamente las novedades que
se hayan producido en sus contenidos a otros sitios web que
previamente se hayan suscrito o sindicado a estas páginas. De
esta manera, no es necesario ir navegando de página en
página para ver si se ha publicado alguna novedad: basta con
suscribirse para recibirlas, lo que supone un considerable
ahorro de tiempo.
8. Canales RSS. Sindicación de8. Canales RSS. Sindicación de
contenidos.contenidos.

Con el siguiente vídeo vamos a entender mejor lo que es una
sindicación de contenidos:

La suscripción se realiza mediante unos archivos que
tienen un formato especial (XML, RSS, RDF o
ATOM), denominados feeds o canales de RSS.
Las páginas que ofrecen la posibilidad de sindicarse a
ellas tienen un logotipo como el siguiente:
La suscripción o recepción automática de los contenidos
requiere de algún programa lector, también denominado
agregador, que es un software capaz de leer los archivos
feeds. En nuestro caso utilizaremos Google Reader

Para suscribirnos a una página de contenidos, sólo
tenemos que buscar el botón en la barra de
navegación de nuestro navegador. En Mozilla, aparece
junto a la estrella que me permite agregar la página a
favoritos.

Cuando pinchemos en ese botón, nos aparecerá una
ventana en la que seleccionaremos “Suscribirse a..-RSS”.
A continuación, en la ventana que se abre seleccionamos
Suscribirse a este canal usando Google, y pinchamos en
Suscribirse ahora.

8. Canales RSS. Sindicación8. Canales RSS. Sindicación
de contenidos.de contenidos.
Por último accederíamos a Google Reader, donde nos
informan que no estamos suscritos a ese feed. Lo único que
tenemos que hacer para finalizar la suscripción es pinchar en
Suscribir.

9. Paint y los blogs.9. Paint y los blogs.
Paint es un programa de tratamiento de imágenes muy
sencillo, pero muy útil.
En ocasiones podemos querer modificar una imagen para
insertarla en nuestro blog, añadiéndole, por ejemplo un
texto.
Con conocimientos básicos de Paint podremos hacer esto sin
dificultad.

9. Paint y los blogs.9. Paint y los blogs.
Paint es un programa de tratamiento de imágenes muy
sencillo, pero muy útil.
En ocasiones podemos querer modificar una imagen para
insertarla en nuestro blog, añadiéndole, por ejemplo un
texto.
Con conocimientos básicos de Paint podremos hacer esto sin
dificultad.
Haciendo clic en la siguiente imagen, podrás
acceder a un manual donde se detallan las
principales operaciones que se pueden realizar con
Paint.

10. Páginas estáticas.10. Páginas estáticas.
Blogger nos permite añadir páginas estáticas a nuestro blog.
Las páginas estáticas son páginas que contienen información
estática, es decir, no podemos añadir entradas como
haríamos en la página principal del blog, que es una página
dinámica.
Podemos añadir páginas estáticas por ejemplo para dar un
mensaje de bienvenida, para dar una descripción de nuestro
blog, etc.
Añadir páginas estáticas es muy sencillo

Desde el editor de entradas de nuestra página principal
pinchamos en Editar páginas.

Rellenamos los campos que aparecen y publicamos la
página

Al pinchar en Publicar página, blogger nos pregunta como
queremos que aparezca el gadget Páginas. La forma más
vistosa es como Pestañas del Blog, aunque siempre se
pueden seleccionar las otras. Una vez que hayamos hecho
nuestra elección, pinchamos en Publicar y Guardar.

En la zona superior del blog, junto a la cabecera, aparecerán
dos pestañas, una para la página principal (dinámica) y otra
para la página estática creada.

ActividadesActividades
• Haz una lista de 5 páginas web que tengan
que ver con el contenido de tu blog.
• Crea una entrada en la que presentes
enlaces a estos sitios web.
• Modifica el formato del texto para que los
enlaces aparezcan en cursiva y con un
tamaño de letra mayor.

• Cambia la plantilla de tu blog.
• Cambia el tipo de letra de las entradas, el color de la misma y
edita el título de la entrada y la cabecera de la fecha.
• Cambia la imagen de fondo de tu blog.
• Configura tu blog para que:
- Se muestren los comentarios
- Cualquier persona pueda realizar comentarios
- Los comentarios se creen a continuación de una entrada
incrustada.
- Los comentarios se envíen a la entrada de correo electrónico
que elijas.

• Comprueba lo que ocurre cuando activamos y desactivamos la
Edición rápida del blog.
• Crea una entrada en tu blog con el título Tu opinión cuenta, y el
mensaje que tu quieras.
• El compañero que tienes a la derecha debe realizar un comentario
a esa entrada.
• Comprueba, en la cuenta de correo electrónico que has seleccionado antes, que se te notifica la
creación de un comentario a esa entrada.
• Una vez que tengas la entrada creada, mándala por correo
electrónico al compañero que tienes a la derecha.

• Cambia el nombre de tu blog desde el menú Diseño-Cabecera y
escribe una breve descripción del mismo
• Busca una imagen en Internet, descárgala e incorpórala a una
entrada de tu blog.
• Busca un vídeo en Youtube y crea una entrada en tu blog donde
se pueda visualizar este vídeo.
• Modifica el blog para que:
- el número de entradas que se muestran en la página
principal sea de 10
- no aparezca quién publica la entrada ni las etiquetas de
las mismas

• Inserta un gadget en el lateral que sea una Imagen con un enlace
a tu formulario de contacto del instituto. Para eso debes entrar
en la página web del centro, pinchar en Organización/Profesores
/Tu nombre; la URL que salga en la barra de navegación es la
que debes utilizar en el gadget). La imagen debes haberla
modificado con el Paint.
• Inserta un gadget en el lateral que sea una Encuesta para que los
usuarios opinen sobre tu blog.
• Inserta un gadget “Seguidores” en el lateral de tu blog. Todos
tus compañeros deben hacerse seguidores de tu blog.
• Inserta un gadget “Suscribirse” en el lateral de tu blog.
• Suscríbete al blog del seminario.
• Busca 3 blogs que sean de tu interés y suscríbete a ellos.

• Ordena los gadgets que se visualizan en el lateral de tu
blog para que se muestren en este orden: Perfil, Texto
(enlace a blog del seminario), Seguidores, Suscribirse,
Encuesta Imagen (enlace a web del centro), Imagen
(enlace a formulario de contacto del administrador del
blog).
• Elimina todos los autores del blog, EXCEPTO A TI
MISMO.
• Añade una imagen a tu cuenta de Google.
• Configura el blog para que el mensaje del formulario de
comentarios sea “Deja tu comentario”

• Crea dos páginas estáticas en tu blog, una
con citas de tu interés y otra con una
presentación de tu blog, objetivos del
mismo, etc.
• Añádelas como pestañas.

Introducción a los edublogs: insertar contenido multimedia

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (8)

Ähnlich wie Introducción a los edublogs: insertar contenido multimedia

Ähnlich wie Introducción a los edublogs: insertar contenido multimedia (20)

Mehr von RAUL FRUTOS MORALES

Mehr von RAUL FRUTOS MORALES (16)

Kürzlich hochgeladen

Kürzlich hochgeladen (16)

Introducción a los edublogs: insertar contenido multimedia