Recopilación de enlaces varios sobre diseño gráfico y recursos web (IV)

Live Tools

Hacía más de un año que no recaía en este tipo de entrada, entre otras cosas porque -la verdad- no parece que os interese demasiado el tema. Es lo que pasa por tener un blog ecléctico. Pero, bueno, como a fin de cuentas a mí si me sirve como back-up y para repasar de vez en cuando las páginas que almaceno, aquí lo dejo: Para mi yo futura y para quién caiga despistado por aquí y se lleve una alegría al encontrarse con estos freebies.

Agilizando el trabajo con CSS

Live Tools

  • Live Tools de UIParade.com [eng]. UI Parade pone a nuestra disposición 4 herramientas de libre uso con las que podremos crear de forma intuitiva y visual botones, formularios, iconos y efectos de lazo (ribbon). Una vez toqueteados los mandos de creación, podremos obtener tanto el código CSS como el correspondiente HTML para su inserción en cualquier página web, a excepción de los iconos, caso en el que se generarán imágenes descargables.
  • 25 Fragmentos CSS para algunas de las tareas más comunes y frustrantes [esp]. Artículo del blog Webintenta que recopila pequeños fragmentos de código CSS de lo más habitual, por ejemplo: sombras, bordes redondeados, degradados, citas, estilos por tipo de enlace, fuentes y otros hacks.
  • Snippets de CSS-Tricks.com [eng]. En programación los snippets son pequeños fragmentos de código reutilizables. Esta web emplea este nombre para listar un buen puñado de ejemplos de código que podemos usar libremente en nuestros proyectos. Es un recurso similar al anterior, pero con otras variantes y algunos truquillos más no sólo de CSS.
  • Styleneat [eng]. Poco que ver con los enlaces previos ya que a esta web hay que llegar con el código escrito, pero tremendamente útil cuando se nos descontrola la estructura del CSS en el que trabajamos. Styleneat servirá para organizar nuestra hoja de estilos haciéndola inteligible para el ojo humano.
  • CSS compressor [eng]. Justamente lo contrario del punto previo. En esta ocasión, se trata de comprimir espacios, saltos de línea y demás posibles (que, por otra parte como decía, hacen legible un CSS para el desarrollador web) de manera que ocupe menos y ayude a cargar antes la web a la que estén asociados. Ayuda a la optimización web, no a nuestra comprensión lectora de código.

Continuar leyendo «Recopilación de enlaces varios sobre diseño gráfico y recursos web (IV)»

Una de la montaña yendo a por Mahoma: Vinilos personalizados de Futurama para MacBook Pro

Vinilos personalizados de Zoidberg y Zapp (Futurama)
[Off-topic, si es que hay algún topic en este blog,
digamos que este tema se sale un poco porque NO soy Yo Vs. La Tecnología]

Cansada de no encontrar ningún diseño que me convenciera para personalizar mi nuevo MacBook Pro (es lo malo de tener que renovar equipo, que las pegatinas y vinilos del antiguo no son transferibles, bye bye Bender), me dije: qué demonios, si tengo las herramientas para crear el que yo quiera. Dicho y hecho: Se dibujan, se mandan a imprimir y esperas pacientemente a recibirlos…

Vinilos personalizados de Zoidberg y Zapp (Futurama)

Mi problema ahora es saber dónde pego a Zapp Brannigan, porque Zoidberg me pudo y es el que ha ocupado el lugar de honor. Por ahora se queda en el banquillo, de reserva. Por cierto, si alguien está interesado en personalizar sus gadgets (y no sabe cómo) con algún diseño que no se encuentre habitualmente parecido a estos o no, no me importa echar una mano ^_^

Recopilación de enlaces varios sobre diseño gráfico y recursos web (III)

Aquí vuelvo, con una remesa de enlaces interesantes sobre lo de siempre: el diseño web. Lo hago, como las dos veces anteriores, para localizar recursos a golpe de click, pero en esta ocasión me he tomado la molestia de comentar brevemente de qué trata cada enlace sugerido, por si sus nombres no fueran (que no suelen ser) lo suficientemente descriptivos.

CSS3

Bear CSS

HTML5

HTML5 Please
  • HTML5 Please, lista de las funcionalidades de HTML5 soportadas por los navegadores habituales, advertencias y consejos [eng]
  • HTML5 Presentation, presentación/demostración en diapositivas sobre qué es HTML5 [eng]
  • HTML5 Codrops, ejemplos y tutoriales de lo que se puede hacer con HTML5 [eng]

JS/jQuery

Scrollorama
  • Minimit Gallery Plugin, slider personalizable con transiciones CSS3 [eng]
  • Scrollorama, ejemplos y código de animaciones a ritmo de scroll [eng]
  • SlabText, plug-in para crear grandes titulares en negrilla y autoajustables [eng]

Recursos Web

ColorHexa
  • ColorHexa.com, herramienta web que proporciona información acerca de cualquier color [eng, aunque el idioma importa poco]
  • Font Squirrel, crea paquetes de fuentes optimizadas para web [eng]
  • Foundation, buen framework para ahorrar tiempo y trabajo [eng]
  • IE NetRenderer, si tienes un Mac y necesitas saber cómo se ve una web en iE… [eng] 
  • Photoshop Grids, plantillas base en Ps para web adecuadas a distintos tamaños y resoluciones. Se trata de guías para diseñar, no de diseños en sí [eng] 
  • Spoon.net, ejecuta cualquier navegador de forma instantánea desde la web sin ninguna instalación. Actualmente sólo funciona en Windows, pero tiene potencial [eng]
  • Twitter Bootstrap en Español, adaptación al español de los recursos ofrecidos por Twitter para usar elementos HTML, CSS y Javascript de manera simple y flexible [esp]
  • Typography by Codrops, sección de la web de Codrops dedicada a la tipografía en la que se pueden encontrar artículos experimentales, ejemplos de buen uso, tutoriales… [eng]
  • When can I use…, guía de compatibilidad de atributos CSS3, HTML5 y navegadores para saber si los soportan y en qué medida [eng]
Espero que cunda. ¡Hasta la próxima!