Manual Blog by Mariella Mazza

ESCUELA DE POSTGRADO SEGUNDA ESPECIALIDAD EN DIDÁCTICA UNIVERSITARIA ASIGNATURA DISEÑO MULTIMEDIA EN LA EDUCACIÓN SUPERIOR

MÓDULO III GMAIL.COM – BLOGGER.COM INCRUSTACIÓN DE MATERIAL MULTIMEDIA EN UN BLOG

ING. ALBERTO MEJÍA MANRIQUE

10 DE OCTUBRE AL 28 DE NOVIEMBRE DE 2009

contacto@albertomejia.com

Gmail.com – Blogger.com Incrustación de Material Multimedia en un Blog Ing. Alberto Mejía Manrique

A. Crear una cuenta en Gmail 01) Iniciar el Internet Explorer e ingresar en el campo dirección (ó URL) http://www.gmail.com.

02) Esta es la pantalla de ingreso al servicio gmail de Google. Crearemos una cuenta en gmail con el usuario alteramm (la dirección que se generará es alteramm@gmail.com). 03) Para iniciar la creación de una cuenta activar el botón Create an account. 04) Aparecerá entonces un formulario de datos que debemos completar.

contacto@albertomejia.com

05) Mientras completamos el formulario, existen algunos campos que merecen un mayor detalle. Por ejemplo debajo del campo Desired Login Name (en el cual se ingreso sólo el nombre de usuario, no se ingresa gmail.com) aparece un botón llamado check availability! que nos permite confirmar si otra persona ya uso este usuario.

06) En nuestro caso observamos que dicho usuario ya ha sido tomado y gmail nos propone 4 alternativas que podemos escoger o intentar con otro usuario. Intentemos ahora con alter4media. (la dirección que se generará es alter4media@gmail.com) 07) En este caso el sistema nos dice que esta disponible. Debemos proseguir ingresando un password de más de 8 caracteres, no acepta números dentro del password. Podemos dejar activa la opción Enable Web History e inactiva la opción Stay signed in. 08) Debemos seleccionar una pregunta de seguridad que nos será útil si se nos pierde la contraseña del correo. En este caso hemos optado por crear nuestra propia pregunta (y nuestra propia respuesta). 09) Agregar un correo alternativo (puede ser de cualquier otra empresa) en nuestro caso hemos agregado albertomejiamanrique@gmail.com. Agregar el texto de verificación que aparece en azul. Este texto respeta las mayúsculas y minúsculas.

contacto@albertomejia.com

10) Finalmente pulsar el botón I accept. Create my account.

contacto@albertomejia.com

11) Luego pulsar el botón Show me my account

12) Ahora para deslogearnos de nuestra cuenta activar el enlace Sign out que esta en la parte superior derecha de la pantalla.

B. Crear una Blog en Blogger usando una cuenta de Gmail 13) Ahora vamos a ingresar a la página de Blogger, ingresando en el campo dirección (ó URL) http://www.blogger.com. 14) Blogger es un sitio que permite crear un blog teniendo conocimientos mínimos sobre páginas Web, permite centrarse en el contenido y no en la forma. Cuenta para resolver el problema de la forma con plantillas que pueden ser seleccionadas para el diseño del blog. 15) Google compró hace varios años Blogger, de esta manera es posible ingresar a este sitio haciendo uso de las cuentas de correo de Google. 16) Ingresar la cuenta de gmail y la contraseña en el campo Nombre de usuario (email) y Contraseña (?) respectivamente. Si desean ingresar automáticamente pueden activar la casilla Recordarme, se sugiere activar esta opción si un usuario no comparte su PC con otra persona.

contacto@albertomejia.com

17) Aparecerá la siguiente ventana:

18) En este momento (paso 1) Blogger esta reconociendo la información que ingrese como parte del usuario de gmail (por ejemplo reconoce que mi nombre es Alberto Mejía). El formulario me pide colocar el nombre que se mostrara como firma en las entradas o posts que se publicaran en el blog. En mi caso colocaré Alter4media para darle unidad a todo, también es posible colocar el nombre completo del autor del blog. 19) En cuanto a la Aceptación de las condiciones, esta generalmente es un parte del proceso descuidada por los usuarios, porque nunca tienen tiempo de leer las Condiciones del servicio, por tanto lo único que hacen es activar la casilla Acepto las Condiciones del servicio y pulsar el botón continuar. Lo que recomiendo es ingresar a dicha opción (activar el enlace Condiciones de servicio), seleccionar el texto que aparece, copiarlo y pegarlo en un documento de word que guardaremos en un lugar seguro. 20) Este documento será una referencia si alguna vez tenemos dificultades de algún tipo. 21) El siguiente paso es escoger el Título del blog que estamos creando y la Dirección del blog (URL). Sobre todo la dirección del blog, debe ser guardadas en un lugar seguro, en caso contrario se correo el riesgo de tener ni acceso como lector ni como editor del mismo. 10

contacto@albertomejia.com

22) En este caso (paso 02) el título de nuestro primer blog será: Alter 4 Media y la dirección será http://alter4media.blogspot.com. Observe que nuevamente es necesario activar el enlace Comprobar la disponibilidad, para verificar que la dirección esta libre y puede ser utilizada.

23) Una vez que se ha recibido la confirmación de que dicha dirección esta disponible active la flecha naranja y el enlace CONTINUAR. 24) Ahora podremos seleccionar una plantilla para el diseño de nuestro primer blog. En este caso seleccionaremos la plantilla No. 897. 25) Activar la flecha naranja y el enlace CONTINUAR. 26) Nos saldrá una pantalla con el mensaje Se ha creado tu blog. El sistema acaba de crearte un blog. Ya puedes empezar a escribir entradas, personalizar su diseño o crear tu perfil personal. 27) Si deseamos empezar a escribir entradas (o postear) activamos la flecha naranja y el enlace EMPEZAR A PUBLICAR.

contacto@albertomejia.com

C. ¿Cómo postear información en un blog de Blogger? 28) Cuando ingresamos una entrada o post, siempre tendremos que completar un campo Título que requiere un título para el post, un campo donde se ingresa el texto que forma parte del contenido a postear y en la parte inferior las Etiquetas del post para hacerlo “encontrable”. 29) En nuestro caso ingresaremos como Título del primer post: Partida de Nacimiento e ingresamos el siguiente texto como parte del cuerpo del post: Este es el primer post del blog Alter 4 media que forma parte del blog desarrollado como ejemplo dentro del curso de Diseño Multimedia como parte de la Segunda Especialidad. Como etiquetas del post podemos colocar: diseño, multimedia, alter4media.

30) Observe que siempre es posible guardar un borrador activando el botón azul y el enlace GUARDAR AHORA, si por el contrario quiere publicar directamente el texto ingresado se debe activar el botón naranja y el enlace PUBLICAR ENTRADA. En nuestro caso escogeremos la segunda opción, y aparecerá la siguiente pantalla:

contacto@albertomejia.com

31) Ahora bien seguramente deseamos ver como luce en el blog nuestra primer post, para ello se debe activar la pestaña Ver blog. ¿Qué sucede si deseamos postear otro mensaje? 32) En la parte superior del blog existen un menú superior: Seguir, Compartir, Informar sobre mal uso, entre otras. La primera opción es una letra B en fondo naranja, ese icono lo debemos activar para ingresar al Escritorio (de Blogger). 33) Desde el Escritorio (de Blogger) puedo editar todas mis entradas, crear nuevos blogs, configurar mi usuario, crear nuevos cursos entre otras muchas cosas. 34) Ahora vamos a postear un texto con una imagen. Para ello primero ingresar a www.google.com y descargar una imagen a la carpeta recursos ubicada en el escritorio de su computador. Para ello ingresar a la página web de Google y activar la opción imágenes en la parte superior. Luego ingresar una palabra que represente lo que se esta buscando en el campo correspondiente. Por ejemplo ingresar las palabras multimedia educativo. Luego pulsar el botón Buscar Imágenes.

contacto@albertomejia.com

35) Seleccionamos la primera foto haciendo clic sobre ella.

36) Luego hacemos clic, sobre el enlace Ver imagen en tamaño completo y aparecerá la siguiente pantalla donde se muestra la imagen a tamaño completo. 37) Colocamos el cursor sobre la imagen que deseamos descargar y activar el botón derecho del Mouse, aparecerá un menú contextual y seleccionar la opción Save Picture As …

contacto@albertomejia.com

38) Luego aparecerá la siguiente ventana:

39) Seleccionar la carpeta Recursos ubicada en Desktop (Escritorio), luego pulsar el botón Save, para guardar la imagen llamada evolsofteduc112.jpg.

40) Ahora regresamos al escritorio de Blogger. 41) Activamos el botón azul Nueva Entrada.

contacto@albertomejia.com

42) En este segundo post ingresaremos como Título del segundo post: Diseño Multmedia e ingresamos el siguiente texto como parte del cuerpo del post: En este caso presentamos un diagrama que resume la evolución del software educativo donde se resumen las etapas, las categorías, propiedades, medios, formas de trabajo y como han evolucionado las relaciones alumno profesor. Como etiquetas del post podemos colocar: diseño, multimedia, software, educativo, alter4media. 43) Ahora insertaremos la imagen que descargamos usando el buscador Google. Activamos el ícono añadir imagen de la barra de herramientas, luego aparecerá la ventana que permite Añadir una imagen desde su equipo o Añadir una imagen desde el web. 44) Activar el botón Browse, se abre la ventana Choose file y seleccionar la imagen evolsofteduc112.jpg. Luego pulsar el botón Open. 45) Luego elegir un diseño seleccionar la opción izquierda y como tamaño de la imagen Pequeñas. Finalmente pulsar el botón SUBIR IMAGEN. Recuerde que debe aceptar las condiciones del servicio para poder pulsarlo. 46) Dependiendo del tamaño de la imagen aparecerá una ventana que indica que la imagen se esta cargando en el servidor. 22

contacto@albertomejia.com

47) Luego que el proceso termina aparece la siguiente pantalla. Luego pulsar el botón azul FINALIZADO. 48) Podremos entonces ver como esta quedando el segundo post con la imagen que hemos incluido.

49) Luego publicar el post activando el botón PUBLICAR ENTRADA. 50) Para visualizar el blog recuerde activar la pestaña Ver Blog.

contacto@albertomejia.com

D. ¿Cómo “embeber” o incrustar materiales digitales en un blog? Una de las mayores potencialidades de un blog es que podemos “embeber” o incrustar otros tipos de materiales dentro de él, de tal forma que podamos incorporarlos a entradas (o posts) mucho más ricos y potentes desde el punto de vista del contenido y de la información. Es así que podemos incrustar en un blog materiales provenientes de diferentes sitios web (herramientas Web 2.0) como: http://www.youtube.com http://www.slideshare.net http://www.slides.com http://www.issuu.com http://www.flickr.com http://www.scribd.com http://www.xtimeline.com/ http://www.archive.org/index.php Para este ejemplo incrustaremos una presentación de slideshare en nuestro blog. Este mismo método se puede aplicar con casi todas las herramientas Web 2.0, de hecho si alguien esta interesado en conocer las herramientas Web 2.0 más importantes tendría que revisar de manera obligatoria http://www.go2web20.net/ y se dará cuenta que es imposible verlas todas y tenemos que centrarnos en aquellas que a nuestro juicio consideremos puedan agregar valor al proceso educativo por el que transitan nuestros estudiantes. 51) Ingresar al campo dirección (ó URL) de Internet Explorer la siguiente dirección http://www.slideshare.net 52) En este sitio podemos encontrar muchas presentaciones que nos puede interesar incrustar en nuestro blog. Para poder hacer esto, primero tenemos que ser parte del club. Esto significa registrarnos (sign up) para una nueva cuenta. 53) Por ello activamos en enlace sign up y aparecerá la pantalla que nos permite Get a free SlideShare account. 54) Completar la información con sus propios datos. •

• • •

En Username colocar un usuario con el cual Ud. se identificará al ingresar a SlideShare.net, les recomiendo usar su nombre completo sobre todo para que no se olviden de él. Luego de digitarlo el sistema les dirá si esta disponible o no, es decir si otra persona no lo esta usando. En Email Address colocar un usuario de correo válido. En Confirm Email Address volver a ingresar el usuario de correo anterior, esto se hace dos veces con fines de verificación. En Password colocar una contraseña para el Username que esta creando, esta contraseña puede ser la misma o ser diferente a la contraseña de su correo. 28

contacto@albertomejia.com

• •

contacto@albertomejia.com

En Confirm Password colocar nuevamente la misma contraseña, este segundo ingreso es solo para fines de verificación. En Account Type dejar la opción Default

55) Luego pulsar el botón Join Now 56) Aparecerá una segunda pantalla que solicita información adicional • • • • • • •

En Gender colocar el sexo En Country colocar el País Perú (si lo desea puede colocar otro país) En City colocar Lima (si lo desea puede colocar otra ciudad) En State no es necesario colocar algo, sin embargo puede colocar Lima (si lo desea puede colocar otra ciudad) Luego digitar el texto en la casilla Enter text to verify Si lo desea puede desactivar el que le sea enviado el SlideShare Newsletter, para ello quite el check de la casilla de verificación. Lo que si debe activar es la casilla de verificación de I accept SlideShare's . Y al igual que en el caso de Blogger se sugiero ingresar a los términos, seleccionar el texto, copiarlos en un documento word y guardarlo en un lugar seguro.

57) Luego pulsar el botón siguiente 58) Aparecerá esta tercera pantalla que se debe mirar con cuidado porque nos pide compartir con SlideShare nuestra agenda de correos, esta acción queda a discreción de los usuarios. En este caso activaremos el boton Skip this. 59) Finalmente ya estamos registrados en SlideShare.

contacto@albertomejia.com

60) Ahora usando el campo Search ubicado en la parte superior derecha de la ventana ingresar el texto Multimedia Educativo y pulsar el botón Search. 61) Aparecerán 2990 documentos como resultado de la búsqueda. Para simplificar seleccionaremos el primero haciendo doble click sobre él. 62) Ubique la casilla Embeb 63) Luego seleccione el código que esta dentro de dicha casilla, asegúrese de seleccionar todo el texto. Pulse la combinación de teclas CONTROL+ C (copiar) y péguela en alguna parte dentro de un documento. Edición > Pegado Especial > Texto sin formato. 64) El texto que se pega es el que se muestra en la página 34

contacto@albertomejia.com

<div style="width:425px;text-align:left" id="__ss_1074652"><a style="font:14px Helvetica,Arial,Sans-serif;display:block;margin:12px 0 3px 0;textdecoration:underline;" href="http://www.slideshare.net/manarea/gestionarelaboracin-multimedia-educativo" title="Gestionar la Creacion de Multimedia Educativo">Gestionar la Creacion de Multimedia Educativo</a><object style="margin:0px" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=gestionarmultimediauam2009-090226133707-phpapp02&stripped_title=gestionarelaboracin-multimedia-educativo" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=gestionarmultimediauam2009-090226133707-phpapp02&stripped_title=gestionarelaboracin-multimedia-educativo" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object><div style="font-size:11px;fontfamily:tahoma,arial;height:26px;padding-top:2px;">View more <a style="textdecoration:underline;" href="http://www.slideshare.net/">documents</a> from <a style="text-decoration:underline;" href="http://www.slideshare.net/manarea">Manuel Area</a>.</div></div>

contacto@albertomejia.com

65) Activar nuevamente nuestro blog, ingrese al escritorio y active el botón NUEVA ENTRADA. 66) En este tercer post ingresaremos como Título del primer post: Presentaciones de SlideShare e ingresamos el siguiente texto como parte del cuerpo del post: Este es un ejemplo de cómo incrustar presentaciones de SlideShare en un blog de Blogger. Como etiquetas del post podemos colocar: diseño, multimedia, alter4media, slideshare.

67) Active la pestaña Edición en HTML, coloque el cursor al final del texto y pulse la tecla Enter. 68) Luego copie el texto anterior en el cuerpo del post. 69) Publique el post y active la pestaña Ver Blog

contacto@albertomejia.com

70) Observará que aparece la presentación de SlideShare incrustada dentro del Blog anterior. 71) Es posible visualizar el blog visitando http://alter4media.blogspot.com/

contacto@albertomejia.com