La semana pasada mi compañero Álex C nos presentaba Mozilla Webmaker, un programa de aprendizaje colectivo para todos aquellos que quieran iniciarse en el mundo de la creación de páginas web. Dentro de este contexto se enmarca Thimble, el editor web de Mozilla en la nube ideal para principiantes.
La idea de la Fundación Mozilla es simplificar al máximo el proceso de creación de sitios, a la vez que aprendemos el código necesario para tal fin. Con Mozilla Thimble podemos escribir y editar HTML y CSS de forma correcta empleando el navegador, obteniendo al instante una vista previa del trabajo, y pudiendo organizar y compartir el resultado con un solo clic.
La web de Thimble está ahora en fase de pruebas y no ha habido un lanzamiento oficial que yo sepa. Las funcionalidades a las que podemos acceder en este momento parecen muy básicas, aunque nos permiten tomar el pulso de lo que puede ser esta aplicación.
Thimble, la sencillez y el minimalismo al servicio del aprendizaje
Por el momento y a falta de conocer hasta dónde quiere llegar Mozilla con este proyecto, una vez que accedemos al editor (no requiere registro previo), nos encontramos con una interfaz de sencillez llevada al extremo.
Como podéis apreciar en la captura de pantalla, el editor está organizado en dos columnas presididas por un menú situado a la izquierda con pocas opciones: deshacer y rehacer, tamaño del texto (pequeño, normal o grande) y un checkbox para ocultar las ayudas, que vienen habilitadas por defecto. En el lado derecho el botón para publicar.
La columna izquierda es la zona donde iremos escribiendo el código y la derecha presenta los resultados al instante. La zona para escribir está plagada de texto con explicaciones (en inglés), sobre las etiquetas básicas que muestra por primera vez.
Thimble es un editor online con una clara vocación hacia la enseñanza del neófito y no al usuario con conocimientos medios o avanzados. La posibilidad de ver los resultados mientras escribimos brinda la oportunidad de detectar y corregir errores.
El sistema de ayudas de Thimble
Cuando señalamos con el ratón una etiqueta HTML, inmediatamente ésta queda resaltada junto con el número de línea. Entonces es cuando aparecen las ayudas (hints), donde Thimble nos ofrece una explicación sobre la etiqueta y su cometido.
Si pulsamos “more…“, se abrirá otra pestaña del navegador que nos llevará a la página de Mozilla Developer Network, directamente a la sección donde se explica dicha etiqueta con todo lujo de detalles; sumario, uso contextual, atributos si los hubiere, ejemplo de uso e información adicional.
Publicar con Thimble
Una vez terminado nuestro trabajo ya sólo queda guardar o publicar. Aquí también las opciones son simples. Si pulsamos Yes, dispondremos de las siguientes opciones: compartir en redes sociales, copiar la URL que suministra Thimble para incrustarla en nuestro sitio, o bien obtener un enlace para volver sobre el trabajo realizado (teóricamente queda guardado).
Mozilla Thimble, conclusiones
Para la mayoría de lectores de Genbeta, Mozilla Thimble puede representar lo mismo que para un matemático la tabla de multiplicar. Aunque mirando por aquellos que empiezan, resulta un excelente método de aprendizaje a mi entender, que si bien puede ser lento frente a editores del tipo WYSIWYG, garantiza que comprendemos y aprendemos correctamente los conceptos y no adquirimos los vicios y defectos de las aplicaciones que hacen todo por nosotros.
Pensando en cómo fueron mis primeras horas aprendiendo HTML, me hubiera encantado tener a mano una herramienta como Mozilla Thimble, que me enseñara de verdad los fundamentos, en vez de “pegarme” con Adobe Dreamweaver por muy sencilla que fuera entonces la aplicación.
Thimble está en inglés, siendo esta circunstancia una bendición más que un inconveniente. Para todo aquel que quiera iniciarse y convivir profesionalmente con el mundo de la web, el idioma de Shakespeare (o la versión transatlántica de Edgar Allan Poe), es tan necesario como el PC.
Web | Thimble
En Genbeta | Webmaster Academy, aprende con Google a diseñar páginas web de calidad a través de ejemplos
Ver 10 comentarios