2. Mejorar nuestro Blog

Mejorar nuestro Blog

¿Un artículo sin ninguna imágen? ¿No hay vídeos en tu blog? El alumnado perderá interés por lo que cuelgas, no hay diferencia entre tu blog y repartir fotocopias a los alumnos, no hay cambio metodológico, porque no hay cambio en tu forma de representar la información.

Hay que tener en cuenta que NO SE PUEDE ABUSAR DE TEXTO, un artículo que obliga a desplazar hacia abajo la ventana, crea cansancio, no es lo mismo leer en la pantalla que en papel. Las nuevas tecnologías están para aprovecharlas: saca el máximo partido a la misma información.

La forma es tan importante como el contenido.

Objetivos

Enumeraremos la lista de objetivos a alcanzar con el trabajo en este módulo:

En este tema nos dedicaremos a dar potencialidad al blog creado en el módulo anterior. Pero no olvides que aún nos falta más interacción, de momento la información va en un sentido Blog =>Alumno, o Profesor=>Alumno

No nos pasemos de innovación

Si no hay un cambio metodológico, de nada sirve hacer lo mismo pero usando las metodológico

via GIPHY

Embeber Blogger

Embeber en informática significa"incrustar" quizás sea una castellanización del inglés "embed". Con los blogs podemos incrustar código de una fuente en otra y de esta manera conseguimos que nuestros artículos cobren vida, es una herramienta tan potente que está estandarizada en Internet. ES UN CONCEPTO CLAVE EN LOS BLOGS.

¿Qué puedo embeber?

etc... hay muchos portales y muchos servicios, *un mundo en continuo cambio.

Cómo embeber

En general la técnica es común a los editores WYSIWYG. (es el acrónimo de What You See Is What You Get,"lo que ves es lo que obtienes") los editores WYSIWYG están también en Blogger. WordPress... y en casi todos sitios (por ejemplo este curso se realizó inicialmente en una herramienta que se llama Exelearning, y también tiene un editor WYSIWYG).

La TÉCNICA es sencilla:

LO PRIMERO QUE TIENES QUE HACER es conseguir el código embed. Hay que utilizar la intuición para buscar el código embed, a veces con el botón <> otras con la palabra compartir o con el símbolo , etc... (botón derecho copiar)

PEGAR EL CÓDIGO EMBED QUE HAS COPIADO- Entrar en el artículo donde quieres insertar, y buscar el botón HTML, y pegar el código embed (botón derecho pegar)

Puedes pegar el código donde quieras en medio de la redacción por ejemplo "Mira el siguiente vídeo ... y pegas el código ahí

y luego

También puedes modificar el tamaño de lo embebido, por ejemplo en la figura anterior se podría modificar los números width="1000" y height="800" si lo embebido sale de tu plantilla elegida en tu blog

Embeber WP

Paso 1 Activar el pluging Unfiltered MU

Debido a que no tendrás los roles de super-administrador, hay que activar este pluging para que puedas embeber código en tus artículos de WP Entras:

  1. en Plugins
  2. Buscas Unfiltered MU
  3. lo activas (espérate unos segudos a que se active)
  4. lo seleccionas
  5. Aplicar

Paso 2 embeber

  1. Consigue tu código Embed, lo copias
  2. Creas un nuevo artículo
  3. Herramientas - <>Código fuente y pegas el código ahí

Si tienes problemas técnicos puedes preguntar a soportecatedu@educa.aragon.es

Embeber en otros WP que no son de CATEDU

Cada vez hay más problemas de seguridad para embeber, por ejemplo WORDPRESS.COM no permite embeber códigos embed que tengan iframe, frame, embed (que son muchos) o javascript [ver]

Por lo tanto WordPress.com sí que permite embeber documentos de Drive, Youtube, Issu... pero otros, no los permite, al menos que exista un código especial para Wordpress, por ejemplo en Slideshare, no tenemos que utilizar el código embed normal, sino el específico para WordPress

Youtube

Este servicio de alojamiento de videos gratuito, es posiblemente el mayor repositorio de videos de los existentes, actualmente. Para subir nuestros videos, debemos contar con una cuenta en youtube, que no asi para poder verlos. Aquí en este tutorial puedes ver cómo se embebe un vídeo en tu blog:

EdPuzzle

Mira la diferencia entre este vídeo...

Y este otro..

¿Qué te ha parecido?

Parece una chorrada, pero se ponen dos preguntas en un vídeo, y sin querer se presta más atención

¿Cómo se hace?

Existen varias páginas para insertar preguntas interactivas en los vídeos.

Nosotros hemos elegido esta última EDPuzzle.

  1. Vamos a https://edpuzzle.com y nos registramos
  2. Vamos a Youtube https://www.youtube.com
  3. Elegimos un vídeo por ejemplo va a ser este https://www.youtube.com/watch?v=-6dxwYZUgFQ
  4. Volvemos a https://edpuzzle.com y vamos a Youtube
  5. Ponemos en el cuadro de búsqueda el vídeo que hemos elegido

También podemos subir un vídeo a EdPuzzle en Mi contenido - Crear contenido, pero recomendamos hacerlo siempre dede Youtube: Subir el vídeo nuestro en Youtube y en EdPuzzle elegirlo

6.- Pinchamos en el vídeo y le damos a editar en el lápiz:

7.- Elegimos si queremos insertar una nota de audio, una pregunta abierta, una nota escrita... aquí por ejemplo se inserta una pregunta de tipo test: ¡¡espero que sepas cual es la respuesta correcta !!!

8.- Al pulsar grabar y después al pulsar finalizar nos sale un diálogo donde nos sale el link del vídeo y el código embebido

Aquí tienes el link. https://edpuzzle.com/media/5ca31d31cfe253416dd3bd42

IMPORTANTE

Hazlo PUBLICO PUES DE OTRO MODO OBLIGAS AL USUARIO A REGISTRARSE PARA VERLO

y aquí está embebido:

Este mismo tutorial pero en flash:

Míra cómo se hace en esta página (Flash SWF)

Si no lo ves bien, aquí lo tienes en (PDF)

IMPORTANTE PARA USUARIOS DE WORDPRESS

Si tu blog es un WordPress no se puede tal y como dice aquí

If you're a WordPress user, you can share the assignment with a link which will redirect your students to Edpuzzle (the embed feature isn't currently supported).

O sea no está soportado, que pongas un enlace que redirija a tus estudiantes al vídeo de EdPuzzle

Fotos Google

Otra opción es entrar en Google Fotos, igual que Flick NO PERMITE EMBEBER PRESENTACIONES pero sí hacer un enlace

Presentamos Fotos Google pues permite COLABORAR es decir, que cualquier persona puede añadir fotos, esto nos parece interesante para las actividades extraescolares.

PEGA No se puede embeber

Por ejemplo ESTE ENLACE

  1. Crear un álbum (no vamos a exponer como crear un álbum y subir fotos para no extendernos)

  1. entrar en el álbum deseado tenemos en opciones

  1. Opciones para compartir

  1. Opciones muy interesantes

Por ejemplo el de COLABORAR, podemos hacer que cualquiera añada fotos al álbum. Esto es útil por ejemplo en viajes de estudios, actividades extraescolares,... donde mucha gente tiene fotos de una actividad pero no un sitio común para compartirlas

  1. Le damos a copiar en enlace y ya está

Podcast

¿Qué es?

Aunque la definición técnica la puedes ver en la Wikipedia, te lo podemos resumir como la posibilidad de subir tus audios en tu blog, de esta manera puedes tener una radio a la carta, subir tus audiciones de música, ejercicios de idiomas, entrevistas....

¿Con qué herramientas?

Hay muchas (Ivoox tutorial y otras muchas como por ejemplo Audioboo y AudioPal) pero la que te recomendamos es Podomatic.

¿Cómo queda?

Aquí tienes un ejemplo:

¿Cómo se hace?

Nos registramos en Sign Up

Nos podemos registrar por Facebook o por correo electrónico, nosotros recomendamos correo electrónico

Una vez registrado, entramos en Create Podcast

Y vemos esta web para subir el archivo de audio

Subimos el archivo de audio (Hay que usar un programa de grabación, recomendamos AUDACITY) Una vez subido, (nos insistirá que nos inscribamos a la cuenta no gratuita) podemos encontrar el código embed aquí:

Historias

StoryBoard

Puedes hacer historias visuales y embeberlas

¿Cómo se hace?

Un video-tutorial muy completo:

Agradecimientos a Raul Diego http://www.rauldiego.es/historias-visuales-con-storyboardthat/

¿Cómo se embebe una historia de otro?

Vamos a Mi panel de control

story1.png

Nos vamos abajo y encontramos historias libres

story2.png

Elegimos la historia

story3.png

Y la copiamos

story4.png

Lo tenemos en mis historias

story5.png

La elegimos

story6.png

Elegimos TODAS LAS OPCIONES

story7.png

Le cambiamos la PRIVACIDAD

story8.png

Como PUBLICA

story9.png

ya le podemos dar a EMBED

STORY10.png

y YA TENEMOS EL CÓDIGO

STORY11.png

ASI QUEDA

 


Made with Storyboard That

Bannersnack

Integrar fotos en un blog siempre ha sido necesario (por las extraescolares y la necesidad de los alumnos de verse) y siempre difícil pues los servicios han cambiado mucho.

Actualmente (diciembre 2020) vemos que un servicio que funciona es https://www.bannersnack.com/es/

¿Cómo queda?

Así queda embebido :

¿Cómo se hace?

Y así queda en una página de un Blog de Blogger


Presentaciones

¿Cómo ponemos presentaciones en nuestro blog?

Hay dos posibilidades:

Presentación Google Drive (recomendado)

Si hemos realizado una presentación online en Drive, lo podemos incrustar (embeber), dando a Publicar:

Y luego en Insertar - Publicar y nos enseña el código incrustado (embed) para ponerlo en nuestro artículo (antes pide una confirmación si estamos seguros pues la presentación queda totalmente visible al público).

Aquí tienes cómo queda:

Embeber un documento de Google

Insertar documentos de Google

Supongamos que tenemos un documento de Google que queremos insertar en nuestro blog o en un BookStack, vamos pues al código de inserción de Google :

2022-03-31 17_24_26-Kit de iniciación - Hojas de cálculo de Google.png

Y lo pegamos en la ventana de código

2022-03-31 17_27_56-Editing Page 3. Está chupao con Boo... _ Librería CATEDU.png

ATENCIÓN SALE MUY PEQUEÑO para ello modificamos el código indicando el píxeles el ancho y alto, por ejemplo si queremos 800 de ancho y 600 de alto se indica así: width="800px" height="600px"

O mejor pon width="100%"

2022-03-31 17_32_41-Editing Page 3. Está chupao con Boo... _ Librería CATEDU.png

No restringido

Cuidado, asegúrate que NO ESTA RESTRINGIDO en caso contrario el publico no lo puede ver

restringido.jpg

Aquí tienes un ejemplo de insertar una presentación de Google:


Y aquí otro ejemplo de embeber una hoja de cálculo:


Genially

Es una excelente herramienta https://app.genial.ly/ pues permite crear contenidos muy visuales y muy educativos

Crea un contenido, en la versión PLAN FREE tienes mucho dónde elegir (en la Premium mucho más evidentemente), no sólo puede hacer presentaciones, sino también GAMIFICACIÓN, IMÁGENES INTERACTIVAS, INFOGRAFÍAS, HISTORIAS, ... un mundo donde motivar a nuestros alumnos...

OJO: tiene que ser PUBLICO para poder compartir

Una vez creado un contenido puedes conseguir tu código embed seleccionando tu creación y dando al icono de compartir

Entra en Insertar y copiar el código:

Hay una opción de hacerlo colaborativo pero es añadiendo usuarios que tienen que estar registrados y por lo tanto con correo electrónico.

Cómo queda

Pues de cine :

Libros

Scribd

¿Cómo queda?

Manual Básico Medusav2.5 by FRAN

¿Cómo se hace?

En este vídeo tutorial explica cómo conseguir el código de este portal de libros electrónicos.

Lineas de tiempo

¿Qué es?

Es una representación de conceptos o eventos que están separados por el tiempo. La representación de la línea de tiempo es con orden cronológico, y tiene el potencial que nos permite las nuevas tecnologías (vídeos, textos, enlaces...)

Dónde?

Hay muchos servicios, pero se están cerrando muchas y cada vez hay menos oferta, https://www.preceden.com/ es otro servicio de líneas de tiempo con el que se pueden hacer cosas como ésta:

HISTÓRICO CATEDU:

El código EMBED esta muy bien señalizado abajo a la derecha:

Un inconveniente es que sólo se puede crear una línea de tiempo por cada correo electrónico, una solución es usar varios correos electrónicos.

Otro inconveniente es que si pasa más de dos años sin utilizarse, te borra la cuenta

Quizizz

En https://quizizz.com/ nos permite embeber en nuestro blog preguntas, aquí puedes ver sus posibilidades

Creamos un usuario como siempre en Sign Up
quizizz1.jpg
Y nos da la posibilidad de registrarnos como escuela
quizizz2.jpg
Y como alumno, profesor o administrador
quizizz3.jpg
Podemos crear nuestra batería de preguntas en Create o  explorar las creadas por otros compañeros
quizizz4.jpg
En Classes podemos ver los progresos de nuestros estudiantes pero ellos se tienen que loggear 
Pare meterlo en tu blog, nos facilita el código embed
quizizz5.jpg

Mapas mentales

¿Qué es?

Los mapas mentales son otra forma de representar la información cartografiando las reflexiones acerca de un concepto mediante una estructura orgánica en la que el conocimiento se organiza para conseguir un aprendizaje significativo y activo. Los servicios Web 2.0 que permiten construir mapas mentales suelen añadir un valor nuevo e importantísimo para el aula: la colaboración entre iguales a la hora de construir el entramado conceptual, de forma que el resultado final es obra de un equipo coordinado. Por otra parte, la posibilidad de añadir cualquier elemento de la red a la estructura: vídeos, imágenes, enlaces, sonidos, además de textos, convierten a estas representaciones en organismos vivos en los que la multidireccionalidad de nuestro pensamiento queda representada y lista para seguir toda una red de conexiones neuronales. JR Olalla 9/11/13

¿Qué herramientas hay?

Hay muchísimas como gustos: Popplet , Spicesnode, Mind42... (Ver artículos JR Olalla). ¿Cuál recomendamos? Nuestras favoritas son:

  1. GOCONQR
  2. MINDOMO

1.1 GOCONQR

En esta web https://www.goconqr.com/ nos gusta porque - El plan Basic es gratis permite ilimitadas creaciones pero mientras lo creas hay publicidad. - Sólo dispones en el plan Basic de 50M luego no abuses subiendo documentos. - Cuando te registras como profesor, te pregunta tu nivel y las materias que das, entonces automáticamente te enseña los materiales que hay colgados de tu especialidad, lo hemos probado con una difícil, por ejemplo FP de grado superior de Electricidad y Electrónica y ya nos sugiere material colgado por otros compañeros:

1.2 GOCONQR EMBEBER

Los pasos de creación de mapas mentales, historias, etc.. son intuitivas, una vez creado tienes el código embebido en este símbolo :

1.3 GOCONQR ¿COMO QUEDA?

Pues así

2.1 MINDOMO REGISTRO

Mindomo está muy completo, puede añadir vídeos, ser colaborativo ... pero la versión Free sólo permite 3 mapas.

Entramos en la web y nos pide registrarnos

Nos pregunta por nuestro perfil, evidentemente PROFESOR

2.2 MINDOMO CREAR MAPA MENTAL

En CREAR tenemos muchas opciones, no sólo el mapa mental, sino esquemas, historias, comparativas, debate .... navega por las plantillas y verás las posibilidades didácticas de esta herramienta

La creación es fácil, se puede realizar online o descargar su aplicación, podemos insertar vídeos, enlaces, documentos, imágenes...

2.3 MINDOMO EMBEBERLO 

Entramos en COMPARTIR arriba a la derecha

Y pulsamos en CAMBIAR y le damos acceso PUBLICO PARA QUE TODO EL MUNDO PUEDA VERLO y nos proporciona el código EMBED para ponerlo en nuestro blog

2.4 MINDOMO COMO QUEDA

Nubes de palabras

Una nube es crear un conjunto de palabras y cada palabra al pinchar puede ir al sitio que quieras

¿Cómo se hace?

¿Cómo queda?



Quizlet

Quizlet nos permite ver fichas que tienen dos caras, en una la pregunta y en otra la contestación, y lo podemos embeber en nuestro blog.

Aquí tienes un ejemplo:

¿Cómo se hace?

Primero nos registramos y luego pulsamos en Create - Set

Vamos rellenando las fichas (cards). no intentes subir una imagen o poner cuestionario, sólo se puede si tienes cuenta no gratuita

¿Donde está el código embed?

Aquí

¿Puedo usar Quizlet de otros?

Por supuesto, y como algunos usuarios tienen cuenta no gratuita, tienen otras opciones mejores

LiveWorksheets

Tal y como dice en su página:

Liveworksheets te permite transformar tus tradicionales fichas imprimibles (doc, pdf, jpg...) en ejercicios interactivos autocorregibles, que llamamos "fichas interactivas". Los alumnos pueden completar estas fichas online y enviar sus respuestas al profesor. Esto es bueno para los alumnos (más motivador), para el profesor (le ahorra tiempo de corrección) y para el entorno (ahorra papel). Además de esto, nuestras fichas interactivas aprovechan las ventajas que nos ofrecen las nuevas tecnologías aplicadas a la educación: pueden incluir sonidos, videos, ejercicios de arrastrar y soltar, unir con flechas, selección múltiple... e incluso ejercicios hablados, que los alumnos tienen que completar usando el micrófono.

Nos gusta mucho y además se puede embeber en tu blog ¿qué más se puede pedir?. Puedes utilizar una ficha ya creada o crearte la tuya, ver su tutorial en su página.

Atención, para que se embeba bien tienes que buscar esta opción NO TODAS LAS FICHAS DE LIVEWORKSHEETS TIENEN ESA OPCIÓN2023-05-20 19_40_56-Ficha de El adjetivo para Primaria.png

¿Cómo se embebe?

Tiene un enlace que te facilita el código, con unas ¡ mininstrucciones! y con posibilidad de fijar en ancho ¡¡ójala todas las webs facilitasen así las cosas!!

A la derecha verás unos botones para incrustar la ficha en Facebook, Twitter, Pinterest, Classroom y Blogger, realmente NO lo embebe, sino pone una imagen de la ficha en el artículo 
PARA QUE VEAS LA DIFERENCIA MIRA ESTE ARTÍCULO DE BLOGERR https://javierquintana.blogspot.com/2023/05/ficha-de-el-adjetivo-para-primaria.html

Enlace personalizado

La opción personalizar enlace y añadir un enlace al blog pues permite algunas opciones de comprobación y calificación


Scratch

Scratch es una excelente herramienta, perfecta para enseñar el pensamiento computacional, para saber más de esta herramienta entra en aularagon.es

Entra en tu cuenta, en tus cosas y selecciona un proyecto tuyo

scracth1.jpg

scratch2.jpg

Mira cómo queda:


Robotica Tinkercad, Arduino ...

Excelente herramienta para nuestros diseños 3D y electrónicos 
Si quieres saber más de esta herramienta en diseños 3D entra en aularagon.es en Impresión 3D

Entramos en nuestros proyectos y seleccionamos las propiedades de nuestro proyecto 

tinker1.jpg

Y lo hacemos publico

tinker2.jpg

Damos dos cliks al proyecto y ya nos sale el código embed

tinker3.jpg

Este es el resultado


EDITORES DE ARDUINO

Arduino tiene un editor online https://app.arduino.cc/sketches que tus códigos pueden ser incrustados en tu blog

arduino-embed1.png

Y ya nos da el código

arduino-embed2.png

Este es el resultado

PHT SIMULACIONES CIENTÍFICAS

La página https://phet.colorado.edu/es/ tiene simulaiciones sobre Física, Química, Biología... hechas 

Elegimos una y pulsamos en el código Embed abajo con el símbolo <>


Calendarios

Vamos a ver cómo compartir un calendario con Google Calendar. Útil para visualizar eventos,  exámenes, extraescolares....

Entramos en Google, con nuestra cuenta y entramos en Google Calendar

calendar2.png

Creamos un calendario, (es muy intuitivo) y le damos a los tres puntos a compartir

calendar1.png

Y entramos en Integrar el calendario, en código, y tenemos el código a insertar

calendar3.png

El resultado es ...

Wordwall

Es una web que permite crear actividades y embeberlas en tu blog. Su registro es sencillo y es muy intuitivo

Una vez registrado se pueden crear muchas actividades en Mis Actividades

wordwall.png

O en Comunidad podemos ver de otra gente

wordwall2.png

El código lo tenemos aquí 

wordwall3.png

El resultado es

 

Agradecimientos a Ulpiano Pérez