•  
  •  
  •  

Gracias a Codrops, a Codyhouse y a Codemyui últimamente he estado haciendo algunas pequeñas ampliaciones en la web de Inglés de la E.O.I.:

1.- Irregular Verbs

2.- Book: A Christmas Carol

(Dejo la oscarizada película de animación de 1971 de “A Christmas Carol”, subtitulada en inglés, para quién le dé pereza leerse el libro).

3.- Placement test

4.- British Isles

CODROPS

Codrops es una web que publica artículos y tutoriales sobre las últimas tendencias de diseño web. Casi todos los tutoriales enlazan a una demo, de donde se pueden descargar los archivos de las creaciones (los html5, css3, javascript, etc.). Con cada nuevo tutorial que publican, y además lo hacen con relativa frcuencia, se superan. Hay algunos que son más fáciles de implementar o más útiles que otros, pero todos te dejarán con la boca abierta.

Ya los mencioné en una ocasión, pues de ahí (aunque a través de otra web: ajaxshake) había sacado las plantillas para hacer los “mapas del sitio” de la web de Inglés: el de la Escuela Oficial de Idiomas, y el de los Tests de Inglés:

Y este mes de diciembre, me ha servido de inspiración para adaptar otras cosillas:

Una minipágina para poder enlazar una lista de verbos irregulares ingleses, con su correspondiente audio para repasar su pronunciación. Se trata de la lista que viene en las páginas finales del “Student’s Book” del libro English File Intermediate third edition, pero curiosamente, el audio de pronunciación, a pesar de que sí que indica que está accesible, no se encuentra entre los recursos que proporciona este libro con el DVD del libro.

Para tal menester, necesitaba algo sencillo, pero lo quería bonito, y como me había fijado ya en un tutorial de codrops llamado “Caption Hover Effects”, he sacado de allí la plantilla de la página de los verbos irregulares:

Otra cosa que quería hacer era subir algún cuento o libro en inglés “para leer estas Navidades”. Qué mejor  que “A Christmas Carol” de Charles Dickens. El texto del libro original está disponible en la web del Proyecto Gutenberg, y los audiobooks en inglés también se hallan en ivoox. Lo que he combinado en la página donde he subido y/o enlazado este material: ingleseoi.es/book, gracias al tutorial de codrops llamado Look inside:

El “look inside” viene de que cuando clickas en la ficha de cada libro (o de cada “stave” o capítulo en mi adaptación), se abre un desplegable a pantalla completa con el texto del libro y unos controles para pasar o retroceder página y cerrar el libro o capítulo.

CODYHOUSE

Codyhouse es otra web similar a la de codrops, que contiene tutoriales para crear efectos web y plantillas base, y en la que también podemos ver las demos de los tutoriales, así como bajarnos todos los archivos que intervienen.

Me había enamorado, entre otras muchas, de la plantilla/framework llamada en el tutorial de Codyhouse “3d Folding Panel”, que la he aprovechado para colgar los tests y soluciones del denominado “Placement Test” de Speakout, un test de 200 preguntas de inglés de dificultad progresiva que, en función de los aciertos, sirve para “encuadrar” aproximadamente tu nivel de inglés.

La plantilla, básicamente, se divide en 4 cuadrantes que, cuando pulsas en uno se abre un desplegable en medio, que va desplazando los cuadrantes, con la información o enlaces de lo que indique el cuadrante en cuestión.

También me había fijado en otra plantilla de Codyhouse, la denominada 3D Curtain Template, y había visto un efecto en otra web de tutoriales de código:

CODEMYUI

Una página que recopila código libre, de otros sitios webs (por ejemplo, he visto que hay bastante de codrops).

Como decía, utilizando una plantilla de Codyhouse…  y copiándome e integrando los archivos intervinientes de otro efecto hallado en Codemyui, el “Mouse Pointer Animation”, me ha servido de base para la mini-página “British Isles”, para explicar de una manera gráfica la diferencia entre Islas Británicas (British Isles), el Reino Unido (The United Kingdom) y Gran Bretaña (Great Britain):

british

 

Codrops (o Tympanus/codrops), Codyhouse y Codemyui son unas webs que no tienen desperdicio, juntas conforman una gran biblioteca de recursos de desarrollo web totalmente libre y gratuita, donde además existe la posibilidad de dejar comentarios en los tutoriales (eso sí, en inglés) para pedir a los autores u otros intervinientes que nos resuelvan las dudas.