CAMenALLER

Material elaborado para la optativa de CAM: Los Blogs

NDICE APARTADO 1:
QUE ES INTERNET? QUE ES LA WEB? MS SOBRE LA WEB LA WEB 2.0 GOOGLE PGINAS WEB: PGINAS ESTTICAS GESTORES DE CONTENIDOS: PGINAS DINMICAS EL BLOG ESTRUCTURA DE UN BLOG PANEL DE ADMINISTRACIN DEL BLOG CREA TU PROPIO B LOG ADMINISTRAR UN BLOG EN BLOGGER MEN PLANTILLA MEN DISEO CREACIN DE ENTRADAS REALIZAR UN ENLACE AADIR UN IMAGEN INTRODUCIR CONTENIDOS MULTIMEDIA INSERTAR UNA PRESENTACIN INSERTAR UNA GALERA DE IMGENES INSERTAR UN VDEO

APARTADO 2

APARTADO 3

APARTADO 4

APARTADO 5

APARTADO 6

Aunque la creacin de una pgina web utilizando el lenguaje HTML no es un procedimiento difcil, si es un proceso lento. Por esta razn se han desarrollado numerosos programas que permiten crear una pgina web de una forma grfica. Estos programas editores de pginas web se denominan editores WYSIWIG (What You See Is What You Get, que significa lo que ves es lo que obtienes). Algunos de ellos son FrongPage que entra dentro del paquete Office de Microsoft, Dreamweaver de Adobe o Kompozer dentro del software libre desarrollado bajo licencia GNU

En la pgina oficial puedes descargarte el programa: http://www.kompozer.net/ Tambin existe una versin portable que podrs descargarte en Educastur desde la Mochila Digital

GESTORES DE CONTENIDOS: PGINAS DINMICAS Los gestores de contenidos son aplicaciones que se encuentran en el servidor para crear pginas web dinmicas, que nos permiten administrar el diseo del sitio de forma independiente a su contenido, de modo que cuando cambiamos el diseo no afecta al contenido y cuando cambiamos el contenido el diseo no se ve alterado. Los gestores de contenidos podemos modificarlos desde nuestro ordenador conectndonos a Internet. Para trabajar independientemente diseo y contenido y evitar complicaciones, las pginas web dinmicas te dan a elegir entre diversas plantillas, en las

cuales nosotros nos encargamos de introducir los contenidos: artculos, enlaces, categoras. El diseo de estas plantillas puede ser fijo, pero la mayora de ellas permiten personalizar muchos aspectos relativos a la composicin, al color, al tipo de letra, a la imagen de la presentacin, etc. El blog: Es el medio ms extendido de la wed 2.0. Se trata de una especie de diario, que recopila artculos por fechas presentados cronolgicamente apareciendo en primer lugar el ltimo creado. Su nombre en espaol es bitcora. Un usuario puede crear un blog y administrarlo incluyendo en l contenidos, enlaces, imgenes. Los lectores pueden participar en l con comentarios a los que puede contestar su creador entablando un dilogo. Existen muchos ejemplos: Audiovisio o Las TIC en Plstica son algunos de ellos. ACTIVIDAD 2 Entra en el blog Audiovisio o Las TIC en Plstica a travs de Google y observa la distribucin de los diferentes partes. El wiki: Es un sitio colectivo en el que el grupo participante puede editar publicar, modificar y construir su propio conocimiento. El ejemplo ms conocido es la Wikipedia. ACTIVIDAD 3 Una vez que sabe lo que es un Wiki, prueba a entrar en la pgina http://educacionplasticayvisual.wikispaces.co m/ perteneciente a luciaag a travs de Google y observa las diferentes partes. El foro: Lugares de opinin o debate, generalmente de carcter temtico. Suelen presentarse como complemento en otros sitios web formando grupos de inters comn.

APARTADO 3__________________________________________
EL BLOG Blog proviene de abreviar la palabra inglesa weblog, compuesta a su vez de web y de log. Esta ltima significa diario por lo que ahora resultar ms fcil comprender que es un blog.

Un blog es un sitio de Internet en el que de forma peridica una persona o grupo de personas pueden publicar noticias, o artculos. A esa persona la llamamos administrador, y a la noticia o artculo lo denominamos entrada. En espaol un blog recibe el nombre de bitcora. Los artculos aparecen en la pantalla en orden cronolgico, del ms reciente al ms antiguo segn te desplazas hacia la zona inferior de la pantalla y todos ellos se acompaan de un ttulo y de la fecha de su publicacin. Existen diferentes servicios online que nos permiten crear y administrar un blog, como Blogger, Worpress, Edublogs . Nosotros crearemos nuestro blog en Blogger. ESTRUCTURA DE UN BLOG: LO QUE EL VISITANTE VE EN UN BLOG.

Aunque puede variar en funcin del diseo, bsicamente tienen tres partes bien diferenciadas: Cabecera: es el lugar donde va el ttulo y una imagen (dependiendo de la plantilla podrs o no elegir una tuya o no). Columna principal: es el lugar donde aparecen las entradas, en las que aparecer el ttulo de la entrada, la fecha, el contenido, un enlace para hacer comentarios y las etiquetas que hayas signado al artculo. Columna/s lateral/es: aqu aparecern para accesorios o Gadget, como por ejemplo: Archivo del blog: enlaces a los ltimos artculos publicados. Buscador: espacio para buscar los contenidos del blog. Listado de enlaces o blogroll: listado de blogs que nos interesen. Etiquetas: tambin llamados categoras. Se trata de palabras que identifican al tema o temas tratados en cada artculo. Textos Presentaciones

Vdeos Imgenes Publicidad ACTIVIDAD 4 Entra en el blog A pie de noticia a travs de Google y observa la distribucin de los diferentes partes.

PANEL DE ADMINISTRACIN DEL BLOG O VISTA GENERAL. Una vez que hayas introducido tu nombre y contrasea en la pgina de blogger acceders al escritorio. Aqu encontrars un listado con los blogs que hayas creado.

Junto a ellos tienes algunos iconos para acceder de modo rpido a la administracin del blog: editar entradas, desplegable con acceso a diferentes aspectos del blog y otro para ver el blog.

Para poder personalizar tu blog podrs acceders al panel de administracin, llamado Visin general.

En la parte izquierda vers un un men vertical con enlaces a diferentes los aspectos que puedes gestionar.

APARTADO 4__________________________________________
CREA Y ADMINISTRA TU PROPIO BLOG Si ya tienes cuenta en Google, puedes teclear tu nombre de usuario y contrasea en los espacios de la parte superior derecha.

ACTIVIDAD 5 Teclea Blogger en la barra de Google pues te vas a disponer a crear tu propio blog. Antes de nada piensa en el nombre. Sigue los pasos que te van indicando en la pantalla. Enva el nombre del blog a tu profesora.

MEN PLANTILLA El primer men que vamos a manejar es el men Plantilla. En l puedes elegir entre bastantes plantillas prediseadas y ver previamente como queda el resultado final y aplicarlo si te interesa.

Adems se puede personalizar la plantilla elegida en Personalizar. Aqu y dentro de las posibilidades de cada plantilla podrs personalizarla a tu gusto. Una vez que te decidas pulsars Aplicar al blog. Una vez que te encuentres en la ventana de Personalizar, observars en la columna izquierda un men que te da acceso a diferentes opciones: Plantillas, Fondo, Ajustar ancho, Diseo y Avanzado.

Lo primero que debes elegir el la estructura de las columnas y filas en el men Diseo.

En Avanzado puedes elegir colores personalizados para cada uno de las diferentes partes.

MEN DISEO Este men es muy interesante, pues en el puedes cambiar aspectos relacionados con el contenido en la cabecera, las entradas o incluir en la columna lateral enlaces imgenes, vdeos, presentaciones, listados de enlaces, etc.

A. Cabecera La cabecera se distingue porque en ella aparece el ttulo y el texto con una breve descripcin. Podis editarlos siempre que queris aunque no es bueno cambiarlo si el blog responde a unos objetivos previamente establecidos. Es mejor pensarlo un poco ms y mantenerlos fijos. Si en no vas a incluir ninguna imagen, ve al men Diseo y en el espacio rectangular dedicado a la cabecera pulsa Editar. Debers poner el nombre de tu blog y una descripcin breve del mismo.

Puedes incluir una imagen en la misma. Es posible que tengas que adaptar el tamao de la misma. Depender del diseo elegido. En la plantilla llamada Sencillo, un tamao adecuado puede ser 960x220. Para incluir la imagen ve al men Diseo y en el espacio rectangular dedicado a ella pulsa a Editar e inserta la imagen. Tambin debers rellenar el espacio del nombre pero marcars En lugar del ttulo y la descripcin . En este caso ten en cuenta estos consejos: Pero si no es esta plantilla, y quieres que ocupe todo el ancho, tendrs que tener en cuenta el ancho del blog completo, que podrs saber en Plantilla>Personalizar>Ajustar ancho. Cuando insertes la imagen en Diseo>Cabecera, no marques la opcin Reducir hasta ajustar.

Luego vas a Plantilla > Personalizar > Avanzado >Aadir CSS, y en el campo para aadir CSS, agregas esto: #header-inner{ margin:-10px 0 0 -10px; } Si no quieres que la imagen ocupe todo el ancho, y es demasiado grande, se saldr en algunas navegadores y tendrs que pulsar Reducir hasta ajustar. Si la imagen es demasiado pequea para centrarla agregar en CSS: #header-inner img { margin: 0 auto; } Y si quieres cambiar el tamao de la imagen, tendrs que definir el ancho y el alto: #header-inner img { width: 960 px; height: 220 px; } Para usar la imagen debajo del ttulo y la descripcin debes pulsar Reducir para ajustar y Detrs del ttulo y la descripcin. Para mover estos elementos en Agrega CSS: . header h1{ margin: 10px 0 0 40 px; } .header .descripcion { margin:-20px 0 0 0; } ACTIVIDAD: Introduce una imagen en la cabecera de tu blog. Abre el programa Gimp y crea una nueva imagen en Archivo>Nuevo del tamao de tu cabecera o ms pequea . Haz tu diseo personalizado. Puede contener el nombre y la descripcin o bien insertarlos en el propio blog. B. Columna lateral En funcin del diseo de plantilla que hayas elegido, tendrs diferentes estructuras, pero en todas ellas tendrs recuadros en los que se situarn los diferentes contenidos. Algunos aparecen por defecto: Favicon Barra de navegacin Cabecera Entradas del blog Archivo del blog Datos personales

De estos algunos son fijos y no puedes eliminarlos Favicon Barra de navegacin Cabecera Entradas del blog Los dems, aunque aparecen por defecto si que puedes borrarlos. En otros recuadros puedes aadir Gadget. Cuando quieras aadir un Gadget, solo tienes que pulsar en dicho enlace y se abrir, en una nueva ventana, un listado de posibilidades para incluir.

Aadir una imagen ACTIVIDAD Busca una imagen en Flickrcc y preocpate de conocer el ttulo y el autor y apuntarlo, as como de la direccin de flickr del fotgrafo. Guarda la imagen en tu ordenador. Entra en la solapa de Diseo y pulsa Aadir un Gadget en el bloque superior. Elige Imagen e introdcela desde tu equipo, incluyendo el ttulo y el autor, as su URL. Crear una lista de enlaces a blogs o pginas web Es muy interesante disponer de una lista de blogs y pginas web que te gusten de modo que puedas acceder a ellos desde tu blog. Es tan fcil como aadir de nuevo un Gadget y elegir del listado el gadget deseado. ACTIVIDAD Incluye en el bloque inferior de la columna lateral: Un gadget en el que incluirs los ttulos de los blogs de tus compaeros de clase con los enlaces correspondientes. Un gadget en el que incluirs ttulos de tres blogs educativos que te gusten. Un gadget con al menos tres enlaces a pginas web, entre las que se encuentre la pagina web del centro. C. Columna principal La columna central es el lugar donde aparecern las entradas que se vayan escribiendo y publicando. Aparecen en lista por fecha de la ltima a la ms antigua. Puedes acceder a una entrada para editarla o eliminarla, buscndola en el buscador, o bien seleccionando etiquetas relacionadas con el tema abordado en la entrada.

APARTADO 5 __________________________________________
CREACIN DE ENTRADAS Puedes crear entradas pulsando en Nueva entrada o bien en Personalizar>Creacin de entradas>Crear. Dentro de la edicin de las entradas puedes trabajar en la solapa Redactar o bien en Edicin de HTML.

Observa que tienes una barra en la parte superior que pone Ttulo: es el espacio en el que tendrs que escribir un ttulo para tu artculo. En Redactar tienes varias opciones para personalizar el formato de texto de modo similar a un procesador de texto (aunque ms limitado). Puedes hacer una Vista previa de lo que ests trabajando o Cerrar. A la derecha tienes una columna para aspectos para editar la Configuracin de las entradas. Solo necesitas un tema y ponerte a escribir. Para terminar tienes la opcin de Publicar la entrada, con la que haras pblico en la web tu artculo, o bien puedes dar a Guardar, que no te lo publica, pero te lo guarda, por si quisieras seguir trabajando en otro momento con l antes de publicarlo. ACTIVIDAD: Crear tu primera entrada Crea una entrada de bienvenida a tu blog, dndole el ttulo que creas ms apropiado para ella. Tendrs que contar a tus lectores quien eres, cual es la razn de la creacin del blog, tu experiencia con los blogs, tu inters en la materia de CAM y lo que esperas de ella. REALIZAR UN ENLACE Crear un enlace es muy sencillo. En el men superior de la edicin de las entradas, hay un icono de enlaces:

Pulsando sobre l saldr una ventana en la que podrs escribir o pegar la direccin del enlace. Y ya est AADIR UN IMAGEN

Cuando ests escribiendo una entrada puedes incluir una imagen. En el men superior hay un icono de imagen.

Si colocas el cursor sobre l aparecer a una ventana nueva con la que podrs incluir una imagen. Es bastante intuitiva:

Puedes tener problemas para incluir una imagen de la web. En este caso, otra opcin que no suele fallar es pasarte a Edicin en HTML. Para esto debes conocer cual es el cdigo de la fotografa. Recuerda que las imgenes de la web pertenecen a su autor y que debes mostrarte respetuoso con su trabajo. Existen otras webs al estilo de Flickr, como: Openphoto: http://openphoto.net/ PublicDomainPictures http://www.publicdomainpictures.net/ Para obtener el cdigo: Colcate sobre la imagen y pulsa con el botn izquierdo del ratn para conseguirla a mayor tamao. Pulsa de nuevo y podrs copiar el cdigo que aparece debajo de la imagen en la casilla Inline Image. Solo tendrs que pegarla en la entrada que ests elaborando en Edicin en HTML ACTIVIDAD: Introducimos imgenes y enlaces en una entrada Vas a realizar una investigacin sobre algn artista del mundo de la msica o de la imagen que te llame la atencin. En la investigacin tendrs que incluir biografa, trayectoria artstica y obras destacadas. Apunta la webgrafa, es decir, los lugares que has visitado y en los que has obtenido tu informacin. Entra en tu blog y crea una entrada en que expondrs tu investigacin. Crea enlaces e inserta imgenes que enriquezcan tu artculo. Recuerda que no debes copiar y pegar, sino crear tu propia redaccin. Puedes leer el artculo creado por vuestro compaero Pablo Castan en el blog A pie de noticia Descubrimos artistas: Keith Haring, el padre del grafitti

APARTADO 6 __________________________________________
INSERTAR CONTENIDO MULTIMEDIA En este apartado veremos cmo insertar en nuestro blog presentaciones, galeras de imgenes, documentos o archivos de sonidos.

INSERTAR UN DOCUMENTO DE SCRIBD Que es Scribd? Scribd es una red que permite de forma gratuita publicar, compartir, encontrar o descargar documentos en diferentes formatos: .doc, .pdf, .txt, .ppt o .xls.

Registrarse en Scribd. Para registrarte pulsa en el enlace: Sign Up

Puedes crear la cuenta con tu nombre de usuario y contrasea de Facebock. Pero en esta ocasin, pulsa en el enlace que dice: I don't have a Facebook account y cumplimenta los campos de correo electrnico, nombre de usuario y contrasea. Para acceder a tu cuenta lo hars pulsando en Log In, pulsar en Already have a Scribd account? , y rellenar los campos de usuario y contrasea. Subir un documento Para subir un documento solo debers pulsar Subir, y en la nueva ventana volver a pulsar Subir.

Tambin puedes importar documentos creados en Google Docs. Solo tendrs que marcar en el crculo para seleccionar y pulsar en el enlace que aparecer.

Pasos para insertar un documento de Scribd Podemos localizar l documento que se desea inserta buscando por Usuarios o por Documentos en Explore. Tambin puedes hacerlo con un documento tuyo. Una vez que hayas decidido el documento,

Se selecciona Embed en una ventana como esta y copias el cdigo en Copy:

Pega este cdigo en el editor de entrada de tu blog, pero en la pestaa HTML. Para confirmarlo debes guardar o publicar la entrada.

ACTIVIDAD Regstrate en Scribd. Sube los documentos realizados para la materia en Google Docs: Trminos Web y Pginas Dinmicas. Crea una entrada en la que expliques lo que trabajamos en las sesiones 1 y 2 para realizar estos trabajos. Inserta los dos documentos en esta entrada.

Pega este cdigo en el editor de entrada de tu blog, pero en la pestaa HTML. Para confirmarlo debes guardar o publicar la entrada.

INSERTAR UNA GALERA DE IMGENES DE PhotoPeach Que es PhotoPeach? Es un sitio que genera presentaciones de vuestras imgenes en galeras una vez subidas (hasta un mximo de 30 para cada galera). Como en la mayor parte de estos sitios, lo primero que debes hacer es crear una cuenta y despus subir tus imgenes. Estas se guardarn en una galera que podrs editar cuando desees. Subir un fotos para crear una galera. Primero debes tener las imgenes guardadas en tu equipo, y despus, una vez en tu pgina de PhotoPeach, pulsa en:

Y a continuacin elige las imgenes:

Pasos para insertar una galera de PhotoPeach Para obtener el cdigo acceders a la galera que quieras, te situars sobre el icono del lpiz, que es del obtencin del cdigo y copiars el primer cdigo para pegarlo en tu entrada en la Edicin HTML:

ACTIVIDAD Busca 10 imgenes obtenidas de Flickrcc que tengan un aspecto en comn, por ejemplo, un color dominante, que estn hechas en un determinado plano, que tengan un tema comn...No olvides apuntar autores y obras. Gurdalas en tu lpiz. Sbelas a Slide para hacer con ellas una galera de imgenes en tu pgina.

INSERTAR UNA PRESENTACIN DE SLIDESHARE Que es Slideshare? Es una herramienta utilizada para almacenar, agrupar, distribuir, y administrar presentaciones en formatos .ppt, .pptx, .odp y .pdf .

Registrarse en Slideshare Para registrarse en Slideshare basta con pulsar Sign up situado en la parte derecha de la barra superior y completar los datos que te piden, dejando el campo del tipo de cuenta Account Type en Default, es decir, por defecto, y aceptando TOS & Privacy Policy

Antes de poder empezar a trabajar debes verificar tu cuenta en Slideshare, entrando en la cuenta de correo que hayas escrito al crearla. Subir una presentacin Se pulsa en UPLOAD, situado en la parte superior, y se busca en el equipo el archivo.

Buscar presentaciones Se pueden buscar presentaciones desde el buscador de la barra superior. Puedes buscar por cuentas o por contenidos.

Pasos para insertar una presentacin de Slideshare en tu blog Se sigue un proceso similar a los anteriores, copiando el cdigo y pegndolo en la edicin HTML de la entrada. Para localizar el cdigo, pulsa sobre la presentacin que desees aadir en tu entrada para acceder a ella y pulsar en Insertar

INSERTAR UN VDEO DE YOUTUBE Youtube es un lugar para ver, subir y descargar vdeos. Para enlazar introducir uno en tu blog, es tan fcil como en el caso de Slideshare. ACTIVIDAD Entra en Youtube y crea una entrada en la que vas a incluir un enlace a un vdeo de Youtube. El vde debers buscarlo previamente en este sitio y ser el que tu quieras, pero deber estar relacionado con el cine, la fotografa, el arte o la informtica.

RECURSOS UTILIZADOS EN ESTE MATERIAL: Fuentes: http://blog.educastur.es/eduweb20/ http://www.eduteka.org/Web20Intro.php http://es.wikipedia.org/