SESIN

Diseo e Implementacin de un Blog

CAPACIDADES EN ESTA SESIN
El participante al final de esta sesin:
Entiende de que estn compuestas las pginas web. Comparara las etiquetas entre las distintas fuentes de cdigo visitadas. Implementa un web blog.

TEMAS A DESARROLLAR EN ESTA SESIN

Nociones Bsicas de Blog. Publicacin de Imgenes. Publicacin de un Avatar, video y audio.
Autoevaluacin.

http://www.ucv.edu.pe/cis/ cisvirtual@ucv.edu.pe

Estimado alumno: Estimado participante del curso virtual, te doy la bienvenida a esta sesin 01 a nombre del CIS de nuestra universidad Csar Vallejo. El propsito de la sesin es aprender a utilizar los formatos web en distintas formas y formatos as como la publicacin de los mismo en un servidor gratuito llamado MIARROBA. Necesitamos de tu compromiso para que juntos podamos generar el conocimiento suficiente en esta nueva aventura. Debes seguir las instrucciones planteadas a modo de ejemplo y tus dudas o sugerencias anotarlas para alcanzrmelas por correo o sesin de chat. Disfruta de este tpico titulado:

Importante: Los detalles de los temas tratados en esta sesin se encuentran en la carpeta lecturas. Asimismo los archivos a usar en toda esta sesin debes descargarlos desde el campus virtual hacia la Unidad D: de tu PC.

BLOGS
Un blog, o en espaol tambin una bitcora, es un sitio web peridicamente actualizado que recopila cronolgicamente textos o artculos de uno o varios autores, apareciendo primero el ms reciente, donde el autor conserva siempre la libertad de dejar publicado lo que crea pertinente.

Cargar la aplicacin
Cargamos en internet la pgina www.blogger.com

Procedimiento: Para la creacin de un blog debes tener en cuenta tres pasos y son los siguientes:

1. Crear una cuenta en Blogger. 2. Crear un Blog.

Pgina |-2-

1 UNA CUENTA EN BLOGGER 1. CREAR

Se llenan los datos de la ventana que aparece para poder pasar al siguiente paso. Es importante para este paso tener una cuenta en Hotmail o Gmail.

Pgina |-3-

2. 2

CREAR UN BLOG
En este paso se debe asignar un ttulo y una direccin con la cual se va identificar nuestro blog. En este caso el ttulo del blog ser:DERECHOS HUMANOSy la direccin del blog serderhumespino.Luegodebemos seleccionar una plantilla.

La direccin del blog creado ser: derhumespino.blogspot.com Es con esta direccin con la que se podr visitar este espacio creado y compartir con los usuarios.

Despus de estos pasos nuestro blog ha sido creado y podemos empezar a publicar.

Pgina |-4-

3. 3

PUBLICANDO EN NUESTRO BLOG

Para publicar tenemos dos opciones. Primero ingresamos a nuestro blog y aparecer la ventana principal y podemos ir directamente a crear entradas haciendo clic en NUEVA ENTRADA. Segundo, en la opcin Editar entradas hacemos clic, se mostrara una ventana donde vemos todo lo que hemos aplicado a nuestro blog y es all donde se crea una nueva entrada en el botn crear.

Tambin podemos suprimir alguna aplicacin que hemos hecho a nuestro blog y no deseamos que se muestre; para esto debemos seleccionar la aplicacin y hacer clic en SUPRIMIR SELECCIN.

Crear

Aplicaciones

Seleccionar una seleccin

Suprimir seleccin

Pgina |-5-

Al hacer clic en Crearaparece la ventana con la que podemos trabajar nuestras entradas. Para publicar en un blog se debe trabajar en la pestaa Creacin de entradas, es all donde

podemos aplicar diferentes acciones tales como: publicar textos,imgenes, videos, audios, etc.

Botones

La ventana del blog presenta 4 botones las cuales sirven para aplicar diferentes acciones segn la necesidad que tenga el usuario o lo que desee realizar a su blog.

4. 4 PUBLICACIN DE TEXTO
En nuestro blog podemos publicar lo que creamos conveniente, opiniones, temas de lo que uno desea compartir con los dems usuarios(polticos, sociales, religiosos, etc.) para esto debemos hacer clic en NUEVA ENTRADA, luego debemos trabajar en la pestaa Creacin de entradas, es all donde uno efecta la accin que desea ,en esta caso publicaremos un texto.

Pgina |-6-

Para la publicacin de un texto se trabaja en la pestaa Redactar con las herramientas que se puede apreciar en la ventana que son muy parecidas a las propiedades de Word. Se sebe titular el texto que se desea publicar, ej.: Mensaje de Bienvenida; luego se procede a escribir lo que se desee compartir en el blog y se le da el formato personalizado para que finalmente sea publicado.

Ttulo

Herramientas Publicar

Entrada

Antes de publicar el texto, verificamos que todo est de acuerdo a lo que queramos compartir y luego procedemos a hacer clic en PUBLICAR ENTRADA para terminar con esta accin.
Para poder ver el resultado de nuestra entrada, debemos hacer clic Ver entrada y para ver el blog la opcin Ver blog.

Pgina |-7-

5 5.

PUBLICACIN DE IMGENES
En la pestaaCreacin de entradasy luego en la pestaa Redactar encontraremos el icono de aadir imagen, es all donde procederemos a hacer clic par poder insertar una imagen y luego poder publicarla.

Aadir Imagen

Al aadir una imagen se abrir una ventana y presentara las siguientes opciones: Subir desde este blog Subir desde lbumes web de Picasa Desde URL En este ejemplo publicaremos una imagen desde el equipo (Subir desde este blog), haremos clic en examinar y buscaremos la imagen que se desea insertar luego aceptamos, hacemos clic en ABRIR. Luego clic en AADIR IMGENES SELECCIONADAS.

Pgina |-8-

Seleccionamos la imagen para poder configurarla como: tamaos, centrados, leyenda y eliminar. Una vez insertada la imagen, hacemos clic en PUBLICAR EN TRADA.

Finalmente sale una ventana que verifica que la entrada del blog se publicado correctamente y lo podemos ver en Ver entrada, como se muestra en la siguiente pgina y para finalizar clic en la opcin VER BLOG.

Pgina |-9-

6 PUBLICACIN DE UN AVATAR 6.

Un avatar es un grfico representativo de una persona, animal u objeto que se puede utilizar en las habitaciones de discusin virtual, blog o chat. Cualquiera que haya participado en un chat se dar cuenta que intercambiar mensajes escritos puede resultar aburrido rpidamente. Pero si se pudiese adquirir una identidad visual? Es all donde el avatar juega su papel de una representacin para una identificacin. Procedimiento:

Cargar la aplicacin
Cargamos en internet la pgina www.voki.com

Al cargar la pgina aparecer la ventana principal en la cual vamos realizar nuestro avatar, para ello debemos hacer clic en CREATE o enCreateYourOwnVoki.

P g i n a | - 10 -

En la siguiente ventana aparecer activa la primera opcin Create a SpeakingCharacterAnd AddYourVoice (Crear un carcter de uso de la palabra y aadir su voz), escogeremos segn las opciones que se nos presenta nuestro personaje que publicaremos despus en nuestro blog.

En la siguiente ventana encontramos las herramientas que nos permitirn escoger nuestro personaje, darle una apariencia teniendo en cuenta sus opciones:

P g i n a | - 11 -

A. Customize Your character (personalizar tu personaje)

En esta opcin se aplica la apariencia que uno desea; como vemos en el ejemplo del personaje escogido, hemos aplicado algunas atributos que nos da esta opcin(head,clothing, bling)para que represente al avatar, una vez escogido el look que queremos hacemos clic en Done. En este ejemplo escogeremos a un personaje y le daremos algunos atributos de esta opcin al gusto del usuario.

Una vez finalizado el primer paso, tenemos que presionar en el botn DONE.

P g i n a | - 12 -

B. Give it a Voice (darle una voz)

Aqu podemos dar la voz a nuestro personaje en la opcin Text ToSpeech(Texto a voz) tenemos que escoger el idioma y la voz (femenino y masculino) En este caso elegimos aadir voz a nuestro personaje con el teclado (Text ToSpeech) aqu escribimos el mensaje que queremos que escuchen los dems usuarios y elegimos: Accent/Lenguaje(spanish)y Voice(Isabel).Luego escribimos el mensaje y reproducimos para verificar que este bien, finalmente hacemos clic en DONE.

C. Backgrounds (fondos)
Aqu podemos dar un fondo a nuestro avatar pudiendo elegir los diferentes paisajes que tiene esta opcin. En este ejemplo elegiremos el primer fondo, luego procederemos a hacer clic en DONE.

P g i n a | - 13 -

D. Players (marcos)
Aqu podemosseleccionar los diferentes marcos que tiene esta opcin.
Seleccionamos el marco que deseamos y luego se da clic en

DONE.

Al personaje le podemos cambiar el tono y forma de su rostro y cuerpo en las opciones que se presenta bajo la figura,como en el ejemplo. Una vez ya terminado nuestro avatar damos clic en Publish (publicar).

Al publicar nuestro avatar saldr una ventana en la cual debemos escribir el Title (nombre)del avatar, en este ejemplo ser Marilyn, luego hacemos clic en SAVE(grabar) y esperamos a que termine de cargar.

P g i n a | - 14 -

Aparecer una ventana para poner

tu email y

contrasea a esta opcin se la descarta y a continuacin se mostrar a la ventana con la codificacin del avatar creado, este ser copiado y se pegar en la entrada delblogcomo vemos a continuacin.

Copiar el cdigo

Para publicar el avatar en nuestro blog, primero tenemos que ingresar con nuestro usuario y contrasea a Blogger y luego debemos crear una NUEVA ENTRADA, en la pestaa Creacin de entradas,ingresamos a la pestaaEdicin de HTML en donde tenemos que pegar la codificacin del Avatar y hacemos clic enPUBLICAR ENTRADA aparecer la ventana que nos indica que hemos publicado correctamente nuestra entrada, luego daremos clic Ver entrada.

P g i n a | - 15 -

Pegar el cdigo del Avatar

Finalmente veremos nuestro avatar en nuestro blog publicado.

7 7.

Publicacin de un video
En nuestro blog podemos publicar videos para esto debemos trabajar conpginasque nos permitan acceder a la codificacin del video en este caso trabajaremos con la pginas de www.youtube.com.

P g i n a | - 16 -

Procedimiento:

Cargar la aplicacin
Cargamos en internet la pgina www.youtube.com

Una vez en la pgina de youtube buscamos el video que queremos para nuestro Blog, luego copiamos su codificacin en una nueva entrada para proceder a publicarlo.

Para publicar el video previamente hemos entrado a nuestro blog y en la pestaaCreacin de 9 y luego lo entradasy en la opcin de Edicin de HTML copiamos la codificacin del video cargado. Procedemos con los pasos para En este ejemplo copiamos la codificacin del video medio ambiente de youtube, en la parte insertar tenemos la codificacindel video, luego nos vamos a nuestro blog y en Creacin de entradas pegamos la codificacin; hacemos clic enPUBLICAR ENTRADAyaparecer la ventana que verifiqueque hemos publicado correctamente, luego daremos clic Ver en blog oen una ventana nueva.

Tema Para Buscar Video

P g i n a | - 17 -

Seleccionamos el video

Activamos la opcin Embed

Copiamos la codificacin

P g i n a | - 18 -

Luego, ingresamos a nuestra cuenta de Blogger para crear una NUEVA ENTRADA en nuestro Blog.

Pegar el cdigo del Video

Finalmente veremos nuestro video en nuestro blog publicado.

P g i n a | - 19 -

8. 8 Publicacin de un audio
En nuestro blog podemos publicar audio, para esto debemos trabajar con pginas que nos permitan acceder a la codificacin de la pista musical, en este caso trabajaremos con la pgina de www.goear.com. Procedimiento:

Cargar la aplicacin
Cargamos en internet la pgina www.goear.com

Una vez en la pgina de goear buscamos la pista musical del artista que deseamos publicar en nuestro blog, en este ejemplo buscaremos msica de mar de copas para proceder a publicarlo.

P g i n a | - 20 -

Al cargar saldr una lista de las canciones del artista, de esta manera podremos elegir la pista musical, en el ejemplo escogimos A tu corazn, luego procederemos a copiar su codificacin.

En la siguiente ventana aparecer la pista, la cual podremos reproducir y en la parte derecha inferior de la pgina, encontramos la codificacin de la cancin que luego ser copiada y pegada en nuestro blog.

En este ejemplo copiamos la codificacin de la cancin A tu corazn (Pon esta cancin en tu web),luego nos vamos a nuestro blog y en Creacin de entradas pegamos la codificacin;

P g i n a | - 21 -

hacemos clic enPUBLICAR ENTRADAyaparecer la ventana que verifique que publicado correctamente, luego daremos clic Ver entrada .

hemos

Pegar el cdigo de la cancin

9 PUBLICACIN DE ENCUESTA 9.

En nuestro blog podemos publicar encuesta de una manera fcil y profesional. Y los resultados lo obtendremos a tiempo real. Como el siguiente Ejemplo:

Procedimiento: Acceder al blog Primero: Hacer clic en nueva entrada y hacemos un clic en la pestaa Diseo.

P g i n a | - 22 -

Segundo: Hacemos clic en cualquier ubicacin de la opcin Aadir un gadget y luego clic en Encuesta.

Edicin de la encuesta: Tercer: Luego editamos la encuesta planificada como se muestra en la siguiente venta y guardar.
Luego ingresamos la pregunta y sus respectivas alternativas; As como aadir, eliminar respuestas o permitir a los visitantes seleccionar varias respuestas, luego seleccionar la fecha y la hora de la finalizacin de esta.

Cuarto:Luego de guardar haremos clic en la opcin ver blog.

10 INSTALACIN DE UN CHAT 10.

El beneficio relevante es la comunicacina tiempo real, situacin que le permite al usuario obtener respuestas instantneas. Adems, puedes estar en comunicacin con personas de cualquier parte del mundo y no tienes costo adicional, solo el del servicio de internet. Agregamos tambin en el caso empresarial se podr atender cualquier nueva solicitud de nuestro cliente teniendo una mejor socializacin. Usaremos el servicio de Cbox: www.cbox.ws

P g i n a | - 23 -

Procedimiento: 1. Hacer un clic en la opcin de Cbox.

2. Llena la tus datos como nombre de cbox, direccin, password, tu web en blogger, tambin elegirs el Style de la pequea plataforma chat y por ltimo crea la cuenta con clic en el botn CreatemyCbox.

P g i n a | - 24 -

3. Luego con una cuenta ya generada ingresaremos por esta opcin que se muestra:

4. Luego en esta ventana en el link superior Publish para obtener el cdigo

5. Luego en esta ventana copiars el cdigo haciendo clic en el botn Copytoclipboard

Copiar

6. Luego vamos a nuestro blog y en la ficha Diseo aadiremos un gadget:

P g i n a | - 25 -

7. Luego hacemos clic en la opcin HTML/Javascript

8. Ingresamos el cdigo copiado y pegamos en el rea de contenido y luego clic en GUARDAR.

9. Para luego hacer clic en la opcin ver blog. Glosario de Trminos

Blog (bitcora): Es un sitio web peridicamente actualizado que recopila cronolgicamente textos o artculos de uno o varios autores, apareciendo primero el ms reciente, donde el autor conserva siempre la libertad de dejar publicado lo que crea pertinente. Avatar: Es un grfico representativo de una persona, animal u objeto que se puede utilizar en pginas web, blog o chat.

IMPORTANTE: Hemos culminado la Sesin 01 y como se puede dar cuenta el acceso, manejo de las herramientas que es muy sencillo. Sin embargo debemos reforzar nuestro aprendizaje viendo el video del tema. Nos encontraremos nuevamente en la Sesin 02. Cudate! DOCENTE DEL CURSO

P g i n a | - 26 -