Sebastián Thüer

Comunicación, diseño y tecnología

Diseño Web

El arte de combinar colores [infografía]

· ·

Una buena combinación de colores es clave en el diseño. Crear una paleta equilibrada, personal y armoniosa es un talento que no se obtiene fácilmente. Esta infografía presenta algunos de los principios más habituales que deben tenerse en cuenta para la combinación de colores.

Tan importante como lograr una buena combinación es mantener la coherencia entre la paleta de colores de la página y el de los elementos que la componen. Texo e imagen son elementos independientes pero conforman un todo a nivel de percepción. Un detalle que no siempre se puede manejar en el diseño web por la actualización que sufren las páginas.

Vía KissMetrics

CSS Terminal, una forma rápida editar estilos al instante

· ·


Los ajustes finos de CSS en un sitio suelen llevar bastante tiempo y una de las tareas más odiosas es estar modificando el archivo y actualizando el navegador a cada instante. Hasta ahora la herramientas de edición de CSS en línea dentro de un navegador no habían funcionado demasiado bien o eran bastante incómodas.

CSS Terminal viene a solucionar el problema de una manera muy sencilla: inserta una capa semitransparente por encima del sitio web y admite que escribamos el CSS de forma directa. Como dice el autor, es un bookmarklet que permite insertar reglas de CSS directamente en una página en vivo. Algo que se agradece mucho para depuarar CSS y crear prototipos de forma rápida.

La herramienta es compatible con Opera, Mozilla Firefox, Google Chrome, Apple Safari y Microsoft Internet Explorer 9 o superior. Muy sencilla pero tremendamente útil.

Internet ayer y hoy: 1996 vs. 2011 [infografía]

· ·

Quince años es mucho tiempo, y en el caso de la web, prácticamente toda su historia al menos en su vertiente más masiva. Esta infografía resulta interesante para recordar cómo era la red en sus comienzos y el enorme progreso que ha tenido, fundamentalmente en la parte visual porque parece que los primeros sitios había omitido el progreso del diseño en la historia de la humanidad.

Además, la cantidad de usuarios, el número de páginas existentes y el tiempo dedicado a la red han crecido de forma increíble. La lista de los sitios más visitados muestra muchas entradas y salidas entre ambos años. Pero mejor que leerlo, es verlo en este gráfico:

Vía Mashable

Un ebook gratuito con los mejores artículos de diseño web de Smashing Magazine

· ·

Smashing Magazine es una revista de referencia en el diseño web con artículos que van desde tutoriales, cuestiones conceptuales del diseño y muestras de trabajo de diseñadores talentosos. La publicación con sede en , Alemania, está cumpliendo cinco años y para celebrarlo hay hecho un recopilación de sus mejores artículos para ofrecerlos en formato de ebook.

La listas completa de los artículos publicado es la siguiente:

  • “Thirty Usability Issues to Be Aware Of”  —  Vitaly Friedman
  • “Ten Principles of Effective Web Design”  —  Vitaly Friedman
  • “Clever JPEG Optimization Techniques”  —  Sergey Chikuyonok
  • “Typographic Design Patterns and Best Practices”  —  Smashing Editorial team
  • “Ten Useful Usability Findings and Guidelines”  —  Dmitry Fadeyev
  • “Setting Up Photoshop for Web and iPhone Development”  —  Marc Edwards
  • “The Ails of Typographic Anti-Aliasing”  —  Tom Giannattasio
  • “Mastering Photoshop: Noise, Textures and Gradients”  —  Marc Edwards
  • “Better User Experience With Storytelling”  —  Francisco Inchauste
  • “The Beauty of Typography, Writing Systems and Calligraphy”  —  Jessica Bordeau
  • “Web Designers, Don’t Do It Alone”  —  Paul Boag
  • “Making Your Mark on the Web Is Easier Than You Think”  —  Christian Heilmann
  • “Responsive Web Design: What It Is and How to Use It”  —  Kayla Knight
  • “I Want to Be a Web Designer When I Grow Up”  —  Michael Aleo
  • “Persuasion Triggers in Web Design”  —  David Travis
  • “What Font Should I Use?”  —  Dan Mayer
  • “The Design Matrix: A Powerful Tool for Guiding Client Input”  —  Bridget Fahrland
  • “Why User Experience Cannot Be Designed”  —  Helge Fredheim
  • “Dear Web Design Community, Where Have You Gone?”  —  Vitaly Friedman
  • “Make Your Content Make a Difference”  —  Colleen Jones
  • “Two Cats in a Sack: Designer-Developer Discord”  —  Cassie McDaniel
  • “Print Loves Web”  —  Mark Cossey

El libro aniversario está disponible en PDF o a través de iTunes.

Under The Site, una herramienta para espiar qué tecnología utiliza cada sitio

· ·

Es inevitable que  cuando vemos un buen sitio nos preguntemos… ¿cómo lo habrán hecho? Podemos investigar el código fuente, analizar las respuestas que proporciona el servidor y mirar con detalles las rutas de los archivos para descubrir directorios familiares pero lleva demasiado tiempo.

Under The Site facilita esta tarea y con sólo escribir la dirección del sitio nos devuelve un listado bastante complejo de la tecnología empleada en el sitio web. Por ejemplo, vemos que TechCrunch – sitio de referencia en temas de tencología- usa jQuery, Google Analytics, WordPress, el plugin BatCache y HTML5. O que la web de Mozilla está sobre un servidor Apache, programada en PHP y usa Google Chrome Frame para mejorar la visualización de las páginas en Internet Explorer.

El sitio también lista las tecnologías más populares entre las que encontramos:

  • Apache HTTP Server
  • UTF-8 Unicode charset
  • Google Analytics
  • jQuery
  • FBML
  • script.aculo.us
  • Twitter Widgets

Una buena herramienta para jugar un poco y espiar lo que están utilizando los sitios de nuestro segmento.