Porque hay vida más allá de Blogger…

Estoy valorando la posibilidad de cambiar de plataforma de blogging para el próximo curso. Actualmente uso Blogger (como saben todos mis fans de eduTICándomeeeee). Dudo entre seguir en Blogger o dar el salto a WordPress.

Blogger: parece más sencillo, llevo un par de cursos usándolo, tiene a Google detrás, es la plataforma del grupo de trabajo.

WordPress: parece más completo, más opciones, es nuevo para mi, no depende de Google.

Este verano se presenta interesante: inglés + blogging + carrera-continua-detrás-de-niño.

Como primer ejercicio he hecho un intento de migración de este blog a WordPress:

http://eduticandomeeeee.wordpress.com/

Cómo organizar el contenido del blog: etiquetas.

Cuando publicamos un artículo en nuestro blog podemos clasificarlo usando etiquetas. Un texto así clasificado tiene una etiqueta al pie del dicho artículo. Esta etiqueta es un enlace a una página con todos los artículos marcados con esa misma etiqueta.

Cómo añadir etiquetas a un artículo.
Podemos etiquetar un artículo en cualquier momento: cuando empezamos a escribirlo, durante su redacción, al final o en posteriores revisiones.
En la pantalla del editor de texto de Blogger buscamos en la parte inferior de la ventana la casilla “Etiquetas” y la rellenamos con las etiquetas que creamos convenientes. Las distintas etiquetas las separamos con comas.

Si hemos definido previamente otras etiquetas en el blog, podemos utilizarlas (y evitamos así la molesta duplicidad de etiquetas). Pulsamos sobre la opción “Mostrar todo” y se despliegan todas las etiquetas definidas anteriormente. Así nos ahorramos también escribirlas de nuevo: basta con hacer clic con el ratón sobre las que deseemos añadir a nuestro artículo.

Añadir un “gadget” para las etiquetas.

En el menú “Diseño” de nuestro blog seleccionamos “añadir un gadget“. Según la plantilla que tengamos instalada podremos situar las etiquetas en un lugar u otro de la pantalla: bajo la cabecera, en la barra lateral, al pie de la página.

El gadget se llama -sorprendentemente- “Etiquetas”.

En la siguiente ventana podremos configurar algunas opciones del gadget “Etiquetas”:

• Título del gadget (un original “Etiquetas” es el título por defecto).
• Mostrar todas las etiquetas o sólo las seleccionadas.
• Ordenar las etiquetas alfabéticamente o por frecuencia.
• Mostrar las etiquetas como una lista o como “nube”.
• Mostrar el número de entradas que contienen cada etiqueta.

La nube de etiquetas.
Es una forma de mostrar las etiquetas que resulta práctica cuando su número es considerable. Las etiquetas más frecuentes aparecen resaltadas (normalmente en negrita y con un tamaño de letra mayor). De este modo el lector puede hacerse una rápida idea de qué temas predominan en el blog.

Cómo añadir páginas a nuestro blog.

La estructura habitual del blog consiste en una página (portada) en la que van apareciendo los artículos publicados. El orden de presentación de los artículos en la página del blog es cronológico: el último artículo publicado queda en la parte superior de la página hasta que es reemplazado por otro más reciente y así sucesivamente.

Esta distribución puede enriquecerse con la adición de distintas páginas al blog. Así podemos contar con una página que contenga un formulario de contacto con el administrador del blog, otra página puede incluir un índice con enlaces a las principales secciones del blog, etc.

Si deseamos contar con más de una página en el blog podemos añadirlas desde el menú “Diseño“.

En la pantalla para añadir y organizar elementos de la página del blog seleccionamos la opción “Añadir un gadget“.

Y el gadget que vamos a añadir es “Páginas“:

En la siguiente pantalla podremos personalizar la nueva página que hemos creado, por ejemplo añadiendo un título (el título por defecto es “Páginas”).

Podemos añadir más páginas del mismo modo. La siguiente imagen muestra cómo queda el blog con tres páginas: una portada (la página principal del blog), otra con una lista de entradas (enlaces a las entradas que el administrador considera importantes) otra de contacto (con un formulario de contacto con el administrador del blog).

Y eso es todo.

Cómo descargar vídeos desde páginas como Youtube.

En ocasiones resulta interesante ver un vídeo sin estar conectados a internet. Todos sabemos que con el advenimiento -vía Segunda Modernización de Andalucía- de la web 2.0 disfrutamos de conexiones eficientes, baratas y seguras, tanto en casa como en el centro de trabajo. Sin embargo, todos sabemos que internet es caprichosa y puede dejarnos tirados, compuestos y sin vídeo que mostrar.

Para evitarlo, podemos instalar en nuestro navegador favorito un complemento que nos permite descargar los vídeos de sitios como Youtube, MySpace, Google videos, DailyMotion, iFilm, DreamHost u otros.

Requisitos:

1. Un ordenador con conexión a internet.
2. Navegador web Mozilla Firefox instalado. Es un navegador web que funciona en Windows y en GNU/Linux, además de en otros sistemas operativos. Si no dispones de este programa, puedes descargarlo desde su web: http://www.mozilla.com/en-US/firefox/upgrade.html . 
3. Entre 3 y 4 minutos de tiempo.

Aspecto del navegador web Firefox:

Iniciamos el navegador Firefox y vamos al menú “Herramientas”. Elegimos la opción “Complementos”.

Se abre una ventana (titulada “Complementos”) con una pestaña activa (“Obtener complementos”) en la que tecleamos el nombre del complemento que deseampos instalar. Escribimos “Video DownloadHelper”.

Pulsamos el botón “Añadir a Firefox” y confirmamos nuestra elección en la siguiente ventana haciendo clic sobre el botón “Instalar ahora”.

La instalación lleva sólo unos segundos, tras los cuales se nos indica que debemos reiniciar Firefox.

Al volver a arrancar Firefox aparece cargada la página del programador del complemento Video DownloadHelper.

Para comprobar que la instalación ha sido correcta y que el complemento funciona vamos a descargar un vídeo de Youtube.
Visitamos Youtube.com y buscamos un vídeo. Cuando tenemos en pantalla y reproduciéndose el vídeo pulsamos en el icono que nos aparece en la barra de herramientas del navegador web Firefox, justo al lado de la barra de direcciones URL. Este icono está formado por 3 esferas y aparece en gris si no hay un vídeo que se pueda descargar en la página que esté en ese momento cargada en el navegador. Si hay un vídeo disponible, el icono aparece animado: tres esferas de colores (rojo, azul y amarillo) girando. Para descargar el vídeo hacemos clic sobre la parte derecha del icono animado.

Si no modificamos las opciones del complemento video downloaderhelper, todos los vídeos los descargará en una carpeta llamada dwhelper. Al guardarlo podemos elegir el nombre que deseemos para el vídeo.

Los vídeos se guardan en formato .FLV (Flash Video, el formato de los vídeos de Youtube y similares). Para reproducirlos podemos usar prácticamente cualquier reproductor moderno. Como recomendación: VLC (Videolan). Es un reproductor excelente: sencillo, rápido, reproduce casi todos los formatos de vídeo conocidos, multiplataforma (Windows, GNU/Linux, Mac) y es Software Libre.

NOTA: he elegido Firefox porque tiene la posibilidad de instalar cientos de complementos, lo que hace a este programa mucho más flexible que otros navegadores.

NOTA 2: he elegido el complemento “Video DownloadHelper” porque me parece sencillo y eficaz. Sin embargo, existen muchos otros complementos que realizan la misma función (descargar vídeos). Os animo a que exploréis entre los complementos disponibles y comuniquéis los que os parezcan interesantes.

Cómo insertar animaciones flash.

El sencillo editor de Blogger nos permite incluir en nuestro blog enlaces, fotos y vídeos de Youtube. Las animaciones hechas en flash no pueden insertarse directamente. Si deseamos insertarlas en el blog debemos dar un “rodeo”.

Debemos disponer de una cuenta en un servicio de alojamiento de archivos online. Como disponemos de una cuenta en Google (la que nos permite tener nuestro propio blog), no necesitamos darnos de alta en ningún otro servicio. Activamos Google Sites: desde la pantalla de Gmail podemos acceder haciendo clic en la pestaña “Más” de la barra superior de la pantalla y seleccionando “Sites“. Si es la primera vez que usamos Google Sites nos pedirá confirmación del registro y deberemos seleccionar una plantilla para el sitio (Google Sites es un servicio para crear páginas web, más flexible que Blogger). Para el ejemplo he escogido una plantilla llamada “Student Virtual Space”, pero sirve cualquiera. 

Subimos el archivo con la animación a la página web que hemos creado. La animación flash debe haber sido descargada con anterioridad a nuestro disco duro. Para subir un archivo debemos buscar en la plantilla de nuestro sitio la opción de añadir archivos. En el ejemplo dicha opción se encontraba dentro de la sección “Documents & Assignements“. Tras pulsar “Add file” indicamos dónde se encuentra el archivo en nuestro disco duro y es subido a la página web.  

Desde nuestra página abrimos el archivo de la animación con el navegador web y copiamos la dirección URL que nos muestra el navegador. 

En el editor de entradas de nuestro Blog, activada la pestaña de “Edición de HTML” insertamos este código html:

<embed src=”dirección URL de la animación flash” quality=”high” allowscriptaccess=”always” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” align=”middle” height=”150″ width=”150″></embed>

Reemplazamos en nuestra entrada el texto “dirección URL de la animación flash” por la dirección que hemos copiado anteriormente.

Si lo deseamos, podemos cambiar también el tamaño que tendrá la animación en nuestro blog (“height” y “width”).

Ya está. Podemos publicar la entrada con nuestra flamante animación flash insertada en ella. Aquí tenemos el resultado:

Cómo añadir un formulario de contacto en el blog.

No es práctica aconsejable añadir nuestra dirección de correo electrónico como un texto al blog. Hay navegando por la red muchos programas destinados a cazar direcciones de correo para bombardearlos con spam. El spam no es cosa de risa: puede arruinar tu dirección de correo (y recordemos que tu buzón es la cuenta de GMail que te permite usar Blogger, entre otros servicios).

De modo que debemos proteger nuestro buzón del spam, a la vez que ofrecemos la posibilidad de contactar con el administrador del blog.

Una alternativa simple y eficaz es la de añadir nuestra dirección de correo como una imagen en alguna parte (mejor bien visible) de nuestro blog. Ejemplos de esta solución los tenéis aquí:

          

En ocasiones puede ser interesante (y queda bastante resultón) añadir un formulario de contacto como el siguiente:

Veamos cómo podemos incluir este formulario de contacto y recibir a través de él mensajes de los visitantes de nuestro blog.

Primero debemos darnos de alta en un servicio (online, faltaría más) que ofrezca este tipo de formularios. He escogido EmailMeForm, web que tras registrarnos (gratis) nos permite crear un formulario bastante personalizable sin demasiadas complicaciones. Además tiene la ventaja de estar en perfecto inglés. [No obstante, una rápida búsqueda (con Google, por ejemplo), nos ofrecerá otros resultados como Kontactr y similares, Emailmeform no es el único servicio de este tipo en la red, por supuesto.].

Completar el proceso de creación de un formulario es sencillo. Una secuencia de unos pocos pasos basta para obtener el código html que debemos incluir en nuestro blog:

A tener en cuenta:

• Pulsando en el botón “Next” avanzamos al siguiente paso del proceso de creación del formulario.
• “Recipients email” es la dirección de correo que recibirá los mensajes enviados a través del formulario. En mi caso, este buzón de correo es mi email de Gmail.
• No es necesario rellenar todos los campos: sólo los campos señalados con asterisco [*] son obligatorios.
• Después de 7 sencillos pasos terminamos de diseñar el formulario, cuyo código html podemos obtener pulsando un enlace que nos ofrece la página (“Click here to get the HTML Code“).

• Copiamos el código html.
• Nos vamos al blog, a la pestaña de “Diseño“.
• Allí donde deseemos -y donde nos permita la plantilla que en su momento elegimos para nuestro blog- podemos insertar el código html. Por ejemplo: en la pestaña de “Diseño“->”elementos de la página“, selecciono “añadir gadget” en un recuadro situado en la base de la plantilla de mi blog.

• Elegimos la opción “HTML/Javascript” y pegamos el código html obtenido anteriormente.

¡Ya está! Después de guardar volvemos a la página principal del blog y disfrutamos de nuestro flamante formulario de contacto.

Cómo colgar los trabajos de los alumnos con Box.net

Cuando los alumnos entregan trabajos, puede resultar interesante que queden disponibles para toda la clase. Una manera de “subir” los trabajos a la red y que puedan descargarse desde el blog es utilizar el servicio box.net. Box.net permite almacenar archivos y acceder a ellos desde cualquier ordenador conectado a internet.

1. Nos registramos en box.net (es gratis para la modalidad “lite”).
2. Entramos en box.net con el usuario y la contraseña que hayamos elegido.

3. Ya en nuestra cuenta de box.net, podemos crear y borrar carpetas (como si fuera un espacio en el disco de nuestro propio ordenador). También podemos subir y descargar archivos.

4. Es interesante la opción para compartir carpetas enteras. Así podemos crear una carpeta para subir todos los trabajos de un grupo y la pondremos a disposición de los alumnos el el blog. Copiamos el código html (que aporta Box.net para cada carpeta) en el texto de nuestra entrada en el blog (para ello es necesario redactar la entrada en el modo “edición de html”, seleccionable en una pestaña cuando estemos creando la entrada del blog).

5. El resultado es:

Los trabajos (o cualquier otro documento) quedan disponibles para ser descargados con sólo hacer clic sobre el icono del archivo correspondiente.

Primera entrada en el blog.

Este blog queda inaugurado. Como se indica en la columna de la derecha, se trata de una bitácora que servirá de laboratorio de pruebas de los contenidos que trabajaremos en el grupo de trabajo.

De momento he hecho poco:

• Elección de una plantilla sencilla (del propio Blogger).
• Diseño de una cabecera “estilo Google” con LogoCreator.
• Elección de algunos “gadgets” para la columna de la derecha: texto de bienvenida, presentación de fotos (grupo “Beautiful Biology” en Flickr) y nube de etiquetas.

Bienvenidos a este blog.