Los materiales tradicionales como las presentaciones, PDFs, documentos de texto, infografías, etc. no suponen un problema para su distribución al alumnado, ya que cualquier plataforma educativa lo hace, ya sean servicios del estilo de Classroom o Google Sites.

El problema aparece cuando hablamos de materiales creados con inteligencia artificial, como recursos cuyo formato es el de una página web, o programas educativos creados con la técnica del vibe coding así como con programas especializados en la creación de recursos educativos como eXeLearning, Lumi (H5p), JClic, etc. Entonces las plataformas habituales empiezan a dar problemas, puesto que normalmente no soportan el uso de materiales que estén en el formato de Internet: la página web, es decir, el formato HTML.

Visor Web-ZIP soluciona este problema proporcionando una dirección de Internet permanente para los recursos creados como página web. Estos recursos pueden estar en cualquier parte, siempre que dispongan de un enlace público de descarga como en Google Drive, Dropbox, Nextcloud, etc.

Preparación del recurso

Nuestro recurso ha de estar en formato de página web (HTML) y tenemos dos posibilidades: lo obtenemos directamente de una IA o utilizamos un programa que nos permite exportar el recurso en forma de página web.

Caso 1: Copiamos el código directamente de la inteligencia artificial

Por ejemplo, si hemos realizado un documento con Canvas de Gemini, disponemos de una opción para convertirlo en página web:

Los documentos de Gemini disponen de la opción de convertir en página web.

ChatGPT y otras IA no disponen de esta opción para convertir directamente en página web (HTML), pero basta con decirles que, a partir del documento de texto, nos hagan una página web. El código de estas páginas web lo podemos copiar y pegar directamente en Visor Web-ZIP.

El mismo documento anterior convertido en un recurso interactivo. Podemos copiar el código que contiene para pegarlo en Visor-Web-ZIP.

Con la opción Crea un ZIP, podemos crearlo a partir del código que hemos copiado o de los archivos que lo contienen, si es que lo hemos descargado.

Si no tenemos los archivos que deseamos publicar y compartir elegriremos la opción Crea un ZIP.
Esta opción nos permite pegar directamente el código HTML que hemos copiado de la IA.
La imagen tiene un atributo ALT vacío; su nombre de archivo es imagen-9.png
Si hemos copiado el código directamente de la IA, lo pegamos y pulsamos el botón Crear ZIP desde HTML.

Caso 2: Estamos usando un programa que nos permite exportar el recurso en formato HTML

Si utilizamos programas que permiten descargar los recursos educativos en formato de página web, como eXeLearning, Lumi, etc., debemos buscar la opción para descargar el recurso como archivo comprimido en ZIP o bien, descargarlo sin comprimir en una carpeta y luego comprimir la carpeta con Visor Web-ZIP.

Esta opción nos permite comprimir en un archivo ZIP, uno o más archivos HTML que ya tengamos previamente. Si están dentro de una carpeta la podremos comprimir completa.
En la parte izquierda añadimos los archivos o carpeta y en la derecha, pulsando el botón Crear y descargar ZIP, bajamos los archivos comprimidos en un archivo ZIP.

Subir el archivo ZIP a nuestro almacenamiento en la nube

Una vez tenemos el archivo ZIP creado (ya sea a través del programa de origen o a través de Visor Web-ZIP), lo tenemos que subir a nuestro servicio de almacenamiento en la nube favorito, como Google Drive, Dropbox, GitHub, Nextcloud y otros, lo compartimos para que todos puedan verlo y copiamos la dirección (URL) que nos proporciona.

Debemos tener en cuenta:

  • OneDrive a veces da problemas y probablemente no consigas crear el enlace para compartir.
  • Google Drive tiene un límite de unos 20-25 MB para las descargas de este tipo de archivos sin iniciar sesión. El resto de servicios no tienen este límite, aunque probablemente tengan otro que será más alto.
  • Cualquier servicio que permita la descarga directa funciona con Visor Web-ZIP.

Creación del enlace permanente para compartir

Una vez que tenemos el enlace público de nuestro archivo ZIP, volvemos al programa y en la segunda ficha: Ya tengo un ZIP, la pegamos. Obtendremos el enlace que podremos distribuir a nuestro alumnado.

Al pulsar «Crear enlace» aparecerá una barra de progresión mientras se baja y se prepara la web. El enlace generado lo podemos copiar con el botón «Copiar enlace» y distribuirlo al alumnado. Podemos ver nuestro recurso tal como lo verán ellos en «Abrir vista previa». También podemos copiar el código para insertarlo en otra página web.

Una vez hemos creado el enlace, tenemos las siguientes opciones:

  • Copiar enlace: Este es el enlace para compartir y es el que podemos distribuir entre el alumnado.
  • Insertar en una web: Es el código HTML de un Iframe para incrustar el recurso en otra página y que se vea como parte de ella. Incluye ajustes para una buena visualización (tamaño/altura). Pégalo en el editor HTML de tu web (Google Sites, Moodle, WordPress, eXeLearning, etc.). Si la incrustación está limitada, el visor mostrará un aviso con un botón para abrir el recurso en una pestaña nueva.
  • Abrir vista previa: Veremos el recurso tal como lo verán los que lo abran a través del enlace para compartir.

Gestor de recursos

Esta sección nos permite controlar los archivos que hemos descargado a través del programa en un navegador particular. Los recursos se almacenan en la memoria del navegador y, para evitar que con el tiempo esta se acabase llenando, se eliminan cuando hace más de un mes que no se abren y también se borran las más antiguas si superan el 70% del espacio disponible.

Desde aquí podemos controlar estos parámetros, así como volver a obtener los enlaces para compartir y el código para insertar en otra web. También podremos modificar el título, ver el recurso, descargar los archivos comprimidos ZIP y eliminarlos de la memoria del navegador. Los recursos se pueden ordenar en orden ascendente o descendente por título, fecha y tamaño. El botón «Restaurar valores por defecto» restaura el porcentaje y los días de borrado.

Con el gestor de recursos podemos administrar los que están almacenados en el navegador.

Un ejemplo

  • Si abres este enlace, se descargará la página web comprimida, se descomprimirá y se almacenará en el navegador. Entonces verás el ejemplo utilizado antes. La primera vez tardará un rato, sin embargo, las siguientes veces que lo abras, será instantáneo, porque se usa la versión que tienes guardada en tu navegador.
  • Si ahora accedes al programa directamente pulsando aquí y vas a la pestaña «Gestor de recursos», verás la página almacenada en tu navegador.

Límites de Visor Web-ZIP

  • El programa funciona con páginas estáticas (HTML, CSS, imágenes, audio, vídeo, PDF…), que son las que se utilizan habitualmente con los recursos educativos.
  • No funciona con páginas que utilizan la IA como parte del programa (como cuando se añaden funcionalidades inteligentes a los programas hechos con Gemini), ya que esas páginas no pueden ser ejecutadas fuera del entorno donde fueron creadas.
  • No funciona con webs que requieren servidor (formularios con BD, PHP, etc.).

Resumen

Con este programa se soluciona el problema de dónde publicar los recursos creados como página web para poder compartirlos libremente, sin problemas y sin dedicarles tiempo. El proceso es considerablemente más sencillo y rápido que utilizar servicios dedicados, como pueden ser GitHub o Netlify.

Para compartir nuestro recurso, basta con (1) comprimirlo, (2) subirlo a Internet y (3) pegar la dirección de acceso público en Visor Web-ZIP.

Nota: El texto de este artículo tiene nivel 0 en el Marco para la integración de la IA generativa.