Webmaster Libre

Marquee Tool es una herramienta Javascript, creada por Sergey Koksharov, que te permitirá seleccionar áreas rectangulares en elementos <div> e <img>, calcular las coordenadas de la selección, mostrarlas o enviarlas al servidor.

Marquee Tool usa una versión reducida de Prototype, como resultado se obtiene un archivo pequeño, que cargará rápido y hará todo lo necesario.

De momento sólo se puede definir un área por imagen pero en la próxima versión, marcada para finales de Marzo, podrán definirse múltiples areas.

Sin duda es una herramienta práctica, con un bonito resultado y sencilla de utilizar. ¡Se acabó tener que explicar quien eres en las fotografías! (mas o menos). Lamentablemente, según se puede leer en los comentarios, no funciona en Opera.

Marquee Tool: http://marqueetool.net/

Slideshow es una clase Javascript para Mootools 1.0 que te permitirá mostrar presentaciones animadas de imágenes en tus sitios.

Características:

• Dimensiones variables
• Opciones de panorámica y zoom
• Presentaciones “wipe and push”
• Navegación basada en flechas
• Modo de navegación rápida
• Presentaciones con fade, pan y zoom y presentaciones combo
• Controla la duración de tus presentaciones
• Navegación basada en miniaturas
• Posibilidad de agregar comentarios a las imágenes

Para funcionar necesita Mootools 1.0 con Fx.Style, Fx.Styles, Fx.Elements y DOM.

Slideshow: A Javascript Slideshow for Mootools 1.0

heySilver es la nueva creación de Andrés Nieto un sistema que permitirá a tus usuarios interactuar con tu sitio mediante combinaciones de teclas, de forma muy similar a como trabaja Quicksilver en Mac OS X.

heySilver, es un sistema de navegación modular para aplicaciones web que aporta una funcionalidad extra a toda aplicación.

heySilver está compuesto de un sistema de plugins que se encargan de añadir funcionalidades extra mediante ficheros cargados con objetos JSON. De esta forma conseguimos una flexibilidad limitada por la imaginación del webmaster. Dispone de una miniAPI con la que podremos hacer más fácil nuestras creaciones.

Si queréis, que estoy segura que si, ver algún ejemplo de uso y conocer más sobre este interesante script no os perdáis el blog que han creado para la ocasión: http://heysilver.anieto2k.com/blog/

Enhorabuena Andrés, te sigues superando cada día. A mi, al menos, me has dejado sin palabras.

Permitir a quienes comenten en nuestro sitio previsualizar lo que han escrito antes de enviarlo nos ahorra muchos post dobles y mucho ups me confundí poniendo eso (si, me lo apunto). No obstante, hacer que nuestros usuarios tengan que recargar la página para verlo puede resultarles molesto, terminando por enviar sin previsualizar con lo que no se soluciona nada.

En sitios como Digg han implementado un interesante sistema, previsualización al vuelo. Según vas escribiendo vas viendo el resultado.

Si te interesa conseguir este efecto para tus sitios web estás de suerte, en Dream It han publicado un script de Javascript con el que podrás implementarlo facilmente.

Javascript Preview - Like Digg

Con Ajax AutoSuggest podras facilitar la labor de introducir texto en los campos de los formularios de tu sitio.

La clase AutoSuggest añade un menú emergente con valores sugeridos a un campo de texto. El usuario podrá o hacer click directamente sobre cualquiera de los valores sugeridos o navegar por la lista usando las flechas arriba y abajo, seleccionando las opciones con el tabulador.
Los valores de la lista de sugerencias serán extraídos de un archivo XML.

Mas información y descarga: Ajax AutoSuggest v2

Sin duda, de entre todos los cambios que le hice al blog este fin de semana, el más interesante desde el punto de la usabilidad y la accesibilidad ha sido mejorar los formularios y una de las mejoras ha sido la siguiente.

Como dicen las pautas de accesibilidad (Prioridad 3, en este caso)

10.4 Hasta que las aplicaciones de usuario manejen los controles vacíos correctamente, incluya valores por defecto en campos de texto y cuadros de verificación.

Muy bien, introducimos un valor por defecto en los campos de texto. No obstante, es realmente molesto tener que borrar el texto para poder comenzar a escribir. Ahí es donde entra el Javascript, este blog siempre ha tenido un simple toquecito de Javascript para solventar el problema (más o menos)

Esta opción siempre me había parecido una pequeña chapuza, había que incluirla a mano en todos los campos de texto, rompía con la validación del XHTML y, una vez habíamos eliminado el texto éste no volvía a aparecer.

Ayer se me ocurrió mirar si había algunasolución mejor por el mundo, de esas listas para usar (y poco pensar) y dí con esta:
Clearing Default Text
Mucho más limpio y más sencillo.

Simplemente importamos dos archivos javascript y agregamos la clase cleardefault a los campos de texto donde queramos utilizarlo.

Podéis ver un ejemplo en cualquier formulario de este sitio.

Para descargar los archivos o si queréis más explicaciones sobre el script, su funcionamiento y el código, dirigios artículo original: Clearing Default Text

Que la mayoría de nosotros ya usamos Firebug es algo que no podemos ocultar pero ¿le sacamos tanto partido como podríamos?

Lo que os dejo a continuación es un video de Joe Hewitt presentando Firebug 1.0 hace unos días

Nota: La noticia proviene de Ajaxian con la diferencia de que en su artículo se utiliza un vídeo antiguo en lugar de este

Scott Schiller ha creado un interesante API que nos ayudará a cargar, reproducir y controlar sonido - via Flash 8 - con Javascript.

SoundManager2 es una librería de 2 archivos: un API en Javascript y una pequeña película en Flash 8 que provee de las capacidades de audio. Al combinarlos, puedes manejar tus sonidos directamente con javascript, sin necesidad de editar ninguna película Flash (aunque se incluye el código ActionScript por si te apetece).

Se trata de un proyecto totalmente libre y gratuito, liberado bajo licencia BSD.

Puedes aprender más y ver unos cuantos ejemplos en la página del proyecto: SoundManager 2

Via Ajaxian

Un año y 12 días después de que la primera beta de Firebug viese la luz, por fin, el día 24 de este mes, ha visto la luz la versión 1.0 de Firebug.
Para la mayoría de nosotros no supondrá un gran cambio ya que, estoy segura, venimos usando la 1.0 beta pero todos los que sigan con versiones anteriores se van a llevar una agradable sorpresa al reiniciar su Firefox.

Como ya comentamos en su momento, Firebug 1.0 sigue siendo Libre

Anuncio Oficial: One dot Oh
Descarga: Firebug en Mozilla Add-On

Cuando trabajamos con sitios grandes (y no tanto) suele resultarnos mucho más útil y cómodo manejar muchos archivos más pequeños en lugar de uno grande. En principio, no hay ningún mal en ello salvo que, cuando la página vea la luz, realizará muchas peticiones al servidor y esto es especialmente importante en el caso del Javascript que detiene el renderizado de la página mientras carga.

Una solución sencilla consiste en unir manualmente los archivos antes de subirlos al servidor, con los subsiguientes cambios y molestias que nos supondrían las actualizaciones y las nuevas versiones.

Para ahorrarse todo este trabajo de unir y versionear manualmente los archivos de sus sitios, Ed Elliot, ha creado un script en PHP que se encargará precisamente de todo ese trabajo sucio. Además, y como detalle extra a una gran idea, los archivos JS pueden comprimirse con JSMin

Toda la información de uso y demás en el post original, en inglés: Automatic merging and versioning of CSS/JS files with PHP