diseño web

Uno de los aspectos que más me gustan de Google Chrome su gran flexibilidad puesto que, gracias a sus extensiones y aplicaciones, podemos transformar este navegador en una potente herramienta con la que desarrollar nuestro trabajo o disfrutar de la red y, por ejemplo, pasar un rato en nuestras redes sociales favoritas. En el caso que nuestro trabajo esté vinculado al mundo del desarrollo web, podemos encontrar extensiones de Google Chrome que pueden ayudar mucho tanto a los desarrolladores y como a los diseñadores.

Si trabajamos en el ámbito del diseño web, seguramente, al navegar por la red nos hemos fijado en alguna página en la que destaca su tipografía o los colores que utilizan, aspectos que nos pueden servir de inspiración para algún proyecto en el que estemos trabajando. Si además de abrirnos la puerta a contenidos, queremos que Chrome también nos ayude a identificar algunos aspectos vinculados al diseño de las webs que visitamos, en la Chrome Web Store podemos encontrar algunas extensiones de Google Chrome que no está de más tener bien cerca:

  • WhatFont es una extensión que tiene como objetivo ayudarnos en la identificación de tipografías, es decir, visitamos una página web y, al posicionar el puntero del ratón sobre un texto, podremos ver cómo aparece el nombre la fuente que se ha utilizado. Quizás pueda parecer una extensión que no aporta mucho pero, realmente, nos permite acceder a esta información de una manera muy rápida y, sobre todo, de una manera más sencilla que usando Firebug o Webkit Inspector.

  • Eye Dropper es un complemento con el que podremos identificar colores de cualquier web que estemos visitando. El funcionamiento es muy simple y, en el fondo, es similar a la típica función que encontramos en las aplicaciones de diseño en la que podemos tomar el color de un objeto y llevarlo a nuestra paleta de colores. En el caso de Eye Dropper, lo único que tendremos que hacer es usar el botón de la extensión (que se ubica en la zona superior derecha del interfaz) y obtendremos el valor hexadecimal o en RGB del color que esté siendo apuntado por el ratón. La lista de colores identificados se almacenarán en un historial personal que luego podremos usar para reproducir en nuestros diseños.

  • Color Picker es otra extensión con la que podremos identificar colores que encontremos en las webs que estemos visitando. Al igual que ocurre con Eye Dropper, esta extensión de Google Chrome nos devuelve el color que estemos apuntando con el ratón solo que, en esta ocasión, lo realiza usando la codificación HSL y también la RGB. Este tipo de extensiones es interesante porque son capaces de identificar colores en imágenes y, en el caso de Color Picker, nos ofrece un zoom de la zona apuntada por el ratón para que podamos escoger la porción concreta a identificar (por si hubiese matices de tonalidad distintas).

  • ColorZilla también nos puede ayudar en la identificación de colores puesto que podremos identificar el color apuntado por el ratón e, incluso, obtener la paleta de colores completa que se utiliza en la página web que estemos visitando. Otros detalles interesantes son la posibilidad de identificar colores de objetos flash, generar gradientes de color para CSS y copiar, automáticamente, el código del color identificado para que podamos llevarlo a una aplicación de diseño como Gimp o Photoshop.

  • Rulers, Guides, Eye Dropper and Color es, quizás, una de las extensiones de Google Chrome más completas que podamos encontrar para Chrome dentro del ámbito del diseño web. Además de la identificación de colores, la extensión nos permite agregar una "capa de guía" sobre la web que estamos visitando, es decir, añadir una cuadrícula (o un grid) con una regla (en píxeles) para poder revisar el diseño de una web o verificar el que estamos haciendo. Sobre esta cuadrícula podremos añadir marcadores en forma de líneas horizontales y verticales (para verificar la alineación de objetos), marcar el centro del interfaz y, lo más importante, guardar la configuración del grid* para que éste se muestre cada vez que volvamos a visitar la página.

Recibe cada mañana nuestra newsletter. Una guía para entender lo que importa en relación con la tecnología, la ciencia y la cultura digital.

Procesando...
¡Listo! Ya estás suscrito

También en Hipertextual: