Entrevista en Radio Web 2.0

World Bridges

Radio Web 2.0 es una nueva emisora Educativa a través de Internet, que forma parte de Puentes al Mundo.

Comparto con ustedes la alegría de saber que en el próximo programa me van a entrevistar, para hablar del grupo de autoformación de Squeak:

Radio web 2.0

En este segundo programa conversaremos con Iris Fernández una profesora argentina que lleva muchos dedicándose a la informática educativa.

Grupo de autoformación sobre Squeak: formándonos colaborativamente

Squeak es una herramienta muy poderosa que permite crear mundos donde los elementos interactúan gracias a nuestra programación. Se trata de un ambiente donde incorporamos objetos y programamos guiones que nos permitirán que se muevan, que dejen marcas (como si se tratara de Logo), que realicen acciones de acuerdo a ciertos eventos. Todo esto hace que se puedan crear animaciones, presentaciones, simulaciones sobre gravedad o sobre sensores, etc. El grado de complejidad que tiene Squeak conlleva una dificultad importante a la hora de intentar aprenderlo por cuenta propia. Por eso creamos este grupo, con el objetivo de darnos apoyo mutuo en la investigación, cada uno a su ritmo, pero basada en un libro y con la ayuda de todo el grupo.

El Grupo de Autoformación sobre Squeak, tutorizado por la Lic. Iris Fernández, funciona gracias a Gleducar, y con el apoyo del Lic. Gonzalo Zabala, investigador experto en Squeak.

Nombre: Iris Fernández, Licenciada en Educación y trabaja en informática educativa.
Web: www.irisfernandez.com.ar/betaweblog/
Web del proyecto Squeak: Squeak – Grupo de autoformación

Os agradeceríamos que promocionarais el programa en vuestras webs, blogs, redes sociales, microblogs, contactos personales, etc…
Muchas gracias a tod@s
Organiza RadioWeb 2.0

Más información sobre Radio Web 2.0 en el sitio de David Hispano

Crear nubes de palabras con tu texto

Wordle

Wordle es una página con una aplicación que genera una nube de palabras. Podés pegar el texto en un cuadro de texto o simplemente indicar la URL donde está publicado. También se le puede ingresar un usuario de Del.icio.us y ver una nube de palabras creadas a partir de sus tags.

Esta es la nube que Wordle creó con mi blog, según los post que hoy están en la portada:

Nube de palabras con el contenido de mi blog

Esta la creó con mi usuario de Del.icio.us:

Nube de tags de Del.icio.us

Este sitio fue recomendado por Alejandro Piscitelli en Facebook. ¡Gracias!

Cargando #17: Telemarketing 2

Tira Cargando

Cargando… es una tira de IrisFernandez.com.ar y AgenciaBlog.
Publicada bajo una licencia Creative Commons Atribución.
Si bien su lenguaje es mayormente visual, quisiéramos que todos la puedan disfrutar y para ello la publicamos con un código que permite a los lectores de pantalla, usado por invidentes, leerles un texto equivalente a la imagen.
Si desea reproducirla, le pedimos que lo haga con estas mismas características.
Puede copiar y pegar este código para publicar la tira:

<img src=”http://agenciablog.net/media/cargando17.png” title=”Cargando” alt=”Tira Cargando” longdesc=”http://www.irisfernandez.com.ar/cargando/cargando17.html” />

Dos premios el mismo día

¡Gracias Gustavo! ¡Gracias Marina!

Tic’s en un Clic me otorga el premio Limonada, que ya había recibido antes 🙂

Premio limonada

“Para que sepan” me otorgó el premio Compromiso Educativo.

Premio compromiso educativo

El premio pretende reconocer y dar valor a:

1.- El Compromiso por una Educación de Calidad.
2.- La apuesta por la inclusión de las TIC en el aula.
3.- El esfuerzo de padres, profesionales y centros educativos por incorporar las TIC al proceso educativo.
4.- La lucha por defender a través de la enseñanza valores como: Solidaridad, Amor, Cariño, Respeto, Esfuerzo, Ayuda, Apoyo, Compartir y Compromiso con el futuro de nuestros hijos y alumnos.
5.- Reconocer y valorar el esfuerzo de las familias, profesionales y centros educativos por integrar de forma efectiva en los coles y en la sociedad a los niños y alumnos especiales, procurándoles toneladas de amor y posibilitándoles todos los recursos a nuestro alcance.

Paso este premio a:

–Marcelo Duschkin

–María Jesús Rodríguez Arena

–Fernando Pelillo

–Gustavo Cucuzza

¡Gracias por su labor cotidiana!

La Red de Educadores Latinoamericanos cumple un año!

¡¡Hoy cumplimos un año!!

El 6 de mayo de 2008, buceando por la red, andaba en búsqueda de alguna comunidad de docentes latinoamericanos que no necesariamente fueran bloggers, y no la encontré. Así que decidí crear la Red de Educadores Latinoamericanos en Ning.

La Red de Educadores Latinoamericanos fue creciendo permanentemente. Hoy somos 124 miembros de (por orden de aparición en la lista de miembros): Perú, Chile, Argentina, México, Bolivia, Colombia, Venezuela, Uruguay, España, Ecuador, Costa Rica, Honduras, Brasil, USA.

¡Y esperamos ser muchos más! Están todos invitados a formar parte de este espacio de intercambio de experiencias y opiniones sobre educación:

Red de Educadores Latinoamericanos

¿Cómo se ve mi sitio en otros sistemas?

El principio básico del concepto de accesibilidad web es que todos los usuarios puedan acceder a toda la información de un sitio.

Normalmente diseñamos haciendo pruebas y más pruebas en la computadora propia, pero cuando subimos la página a un hosting empezamos teniendo problemas con los caracteres especiales (¡no se ven los acentos!), que se resuelven definiendo correctamente la codificación, indicando al usuario cómo configurar su navegador (¡Gracias, Claudio Segovia!), o directamente usando los códigos para los caracteres especiales (solución menos correcta pero infalible).

Pronto algunos amigos que entran a nuestra página con sus diferentes monitores, en diversas resoluciones, con variados navegadores y sistemas operativos, empiezan a avisarnos que la página No se ve bien. ¿Cómo saberlo de antemano?

Una posibilidad es utilizar  un servicio como browsershot.org, que muestra nuestra página en diversos navegadores de diversos sistemas operativos y configuraciones de pantalla. Podemos ver nuestro sitio en pantallas de 800 x 600 o en una de 1680 px de ancho; en Internet Explorer, en Opera, o en Safari; en un sistema sin JavaScript o sin Flash, etc. etc.:

Browsershot

¿Y cómo resuelvo las diferencias?

En muchos casos veremos que el sitio se ve muy bien, tan bien como en nuestro querido Mozilla Firefox, pero que el malvado Internet Explorer muestra algunas cosas un poco diferentes. Esto se debe a que Internet Explorer no cumple con los estándares para la web, así que tendremos que tomarnos un trabajito extra para este navegador: emezetablog propone utilizar una hoja de estilos agregada, con diferentes definiciones de formato, que sólo se lea cuando el usuario tiene Internet Explorer.

Un ejemplo:

<!–[if gte IE 5.500 ]>
<link rel=’stylesheet’ type=’text/css’ href=’estilosIE.css’>
<![endif]–>

Otros posts de BETA Weblog sobre accesibilidad y CSS:

Más sobre CSS: Float y Clear

Imágenes en CSS

Sombras nada más… o ¿sombras en el texto de una web accesible?

Ayuda para crear hojas de estilo

Cómo saber el código de un color

Cómo saber si tu sitio es accesible

 

Reducir el peso de las imágenes para web

Estoy armando un sitio web y necesito reducir el peso de mis imágenes sin alterar la calidad visible ni el tamaño.

Conozco Photoshop y sé que tiene una opción en el menú que lo hace, así que pensé que probablemente existiera algo parecido en Gimp.

Busqué y encontré (¿cómo vivíamos antes de Google?):

Para usuarios de Gimp 2.6 en Windows, hay que

  • bajar el plugin,
  • descomprimir el archivo,
  • copiar webexport.exe en el archivo de plugins del usuario (por ejemplo, si el usuario se llama “Administrador”: C:UsersAdministrador.gimp-2.6plug-ins)

¡Listo! Ya podemos usar la opción Save for web, en el menú Archivo.

Save for web, plugin de Gimp

Imágenes en CSS

Cuando uno empieza a hacer páginas web accesibles, empiezan a surgir algunas preguntas cuya respuesta no es tan sencilla.

¿Cómo centrar una imagen usando CSS?

Existen muchas formas de hacerlo, pero la que me parece la más sencilla  es la que proponen en este post del blog lamateporunyogur.

En la hoja de estilo, debemos crear una clase para cada alineación de imagen.
Por ejemplo, para imágenes centradas, en el CSS podemos escribir esto:

img.centrado {

display: block;

margin: auto;

}

Y en el archivo HTML tendremos que escribir, cada vez que ponemos una imagen:

<img class=’centrado’ src=’archivo de imagen’ alt=’texto alternativo’>

¿Cómo usar imágenes de fondo para escribir sobre ellas?

Muchas veces queremos incluir una imagen en nuestra página, pero no porque tenga una foto o un dibujo interesante sino porque queremos escribir dentro de ella, como en estos ejemplos:

Texto en globos Texto en nubesTexto en un papel

Lo que se hizo en los tres casos es exactamente lo mismo:

-En la hoja de estilo se creó una clase cuyo fondo tiene la imagen, y al texto se le alteraron los tamaños (altura/height, ancho/width) y la alineación para que coincidan con el centro de la imagen:

p.comentario {

height: 5.5em;

width: 7.3em;

text-align: center;

vertical-align: middle;

line-height: 5.5em;

color: #ffffff;

background-image: URL(‘nube.jpg’);

}

-En el archivo HTML simplemente se usó la clase “comentario” para escribir un pequeño texto:

<p class=”comentario”>¡Hola!</p>

No debemos olvidar nunca que las imágenes que están en el archivo HTML tienen que tener un texto alternativo que la reemplace en su función (por ejemplo, si la imagen tiene un enlace, el texto alternativo debe decir “ir a tal dirección”), y una descripción larga (longdesc=”archivo.html”) en caso de tratarse de una imagen que contenga información. En cambio, cuando una imagen no transmite información, podemos ponerla como fondo de un DIV.

Otros posts de BETA Weblog sobre accesibilidad y CSS:

Más sobre CSS: Float y Clear

¿Cómo se ve mi sitio en otros sistemas?

Sombras nada más… o ¿sombras en el texto de una web accesible?

Ayuda para crear hojas de estilo

Cómo saber el código de un color

Cómo saber si tu sitio es accesible

 

Buscando imágenes en la web

busqueda en Tineye

Cuando uno necesita imágenes para cualquier fin, seguramente el primer lugar en el que piensa en buscar es en Google Imágenes o en Wikimedia Commons. También puede buscar en un banco de imágenes. Por supuesto, si la imagen va a ser publicada hay que cuidar el tema de la licencia y los derechos de autor.

Navegando por ahí, esta semana me enteré de otras dos formas de buscar imágenes. Buscás una imagen de “El pensador”, de Rodin, pero una que esté dibujada o decorada y tal vez no te acordás el nombre de la escultura. Tenés dos opciones:

  • Buscar en Google Imágenes, restringiendo la búsqueda por color (¡Gracias Educared!). Para eso, basta con hacer una búsqueda en Google imágenes y agregar al final de la URL:

&imgcolor=blue

La dirección quedaría así:

http://images.google.com/images?q=pensador&imgcolor=blue

El Pensador, en color azul

http://images.google.com/images?q=pensador&imgcolor=green

El pensador, en color verde

  • Encontrar una foto de “El pensador” y buscarla en TinEye, subiéndola o indicando su URL (¡Gracias Eliax!). TinEye es un buscador reverso de imágenes: en lugar de pedirnos una frase o una palabra, nos pide una imagen. Por ahora tiene un conjunto muy restringido de imágenes en las que busca, pero de a poco irá aumentando esa cantidad. En la imagen lateral podemos ver los tres primeros resultados de esta búsqueda.

Cargando #16: Pecados 2.0

Tira Cargando

Cargando… es una tira de IrisFernandez.com.ar y AgenciaBlog.
Publicada bajo una licencia Creative Commons Atribución.
Si bien su lenguaje es mayormente visual, quisiéramos que todos la puedan disfrutar y para ello la publicamos con un código que permite a los lectores de pantalla, usado por invidentes, leerles un texto equivalente a la imagen.
Si desea reproducirla, le pedimos que lo haga con estas mismas características.
Puede copiar y pegar este código para publicar la tira:

 <img src=”http://agenciablog.net/media/cargando16.png” title=”Cargando” alt=”Tira Cargando” longdesc=”http://www.irisfernandez.com.ar/cargando/cargando16.html” />