Muy buena implementación de la propiedad CSS3 transform para crear un efecto 3D en un menú desplegable.

Agradable set de botones CSS3 sobre las principales redes sociales.

¿Lo mejor? Para mostrar los logos de cada sitio no se utiliza ninguna imagen: todas se encuentran contenidas en una fuente tipográfica, permitiendo también que los botones sean 100% escalables, sin perder calidad.

Y por si fuera poco, también estan disponibles como extensión para Compass.

Para cuando no estamos seguros si utilizar algún estilo CSS: Browser Support es un sitio que permite buscar e indagar el soporte de propiedades CSS entre diferentes navegadores web.

Quien haya realizado un diseño para emails, sabrá que es un mundo aparte, ya que cada cliente de correo/webmail tiene sus peculiaridades. Emailology es un sitio que recopila varios recursos para la creación de este tipo de diseños.

Stitch es una extensión para Compass que otorga la posibilidad de utilizar un gran número de patrones y utilidades CSS para diferentes situaciones.

Algunos ejemplos:

@import 'stitch/patterns'

// Habilitar la aceleración por hardware para las animaciones
@include enable-hardware-acceleration

// Utilización del guión ortográfico: https://developer.mozilla.org/en/CSS/hyphens
@include hyphen(none);

// Crear columnas: https://developer.mozilla.org/en/CSS/columns
@include text-columns(2,20px);

Vieron que Twitter Bootstrap esta basado en Less. Bueno, si quieren utilizarlo con Sass/Compass, existe un plugin que permite hacerlo de forma sencilla, de forma tal que, una vez instalada la gema podemos utilizar el framework completo:

@import "compass_twitter_bootstrap";

o sólo algunas características:

@import "compass_twitter_bootstrap/variables";
@import "compass_twitter_bootstrap/mixins";
@import "compass_twitter_bootstrap/buttons";

Muy buena demostración para crear un efecto de dobles de papel con CSS3, pero sobre todo, excelente el contexto en donde esta implementado.

Por si estamos arrancando un diseño sensible y necesitamos algunas ideas, aquí una buena lista de patrones de navegación, con sus pros y contras.

Me gustó mucho DocHub, ya que permite buscar de forma sencilla y clara en la documentación de las especificaciones de CSS, HTML, JavaScript, DOM, sumando también las de jQuery, PHP y Python. Toda la información es sacada de los sitios oficiales o confiables.

Muy recomendado para tener guardado entre los marcadores.

Les comparto un Workshop sobre Sass y Compass que estuve dando en Enero pasado.

En más de 50 diapositivas explico cómo y porqué utilizar estas herramientas, instalación, requerimientos, conceptos básicos hasta temas más avanzados.