¿Cuántos navegadores conocéis? Y no, no valen Vasco de Gama o Colón… ;). Antes, esa respuesta era mucho más sencilla, con el monopolio de Internet Exporer, era mucho más fácil también el diseño web, pero se perdían multitud de experiencias de usuario. Cuando diseñamos nuestras plantillas WordPress las hacemos compatibles con todos los navegadores (especificamos las versiones), pues entendemos que casi hay un navegador para cada tipo de usuario.
Sin embargo, como decíamos, hace uno años ahora estaríamos hablando de Internet Explorer, pero hoy el más usado, el que más terreno le ha comido en los últimos años a y el más usado por diseñadores y maquetadores es sin duda Chrome.
Una de las razones por la que la mayoría de diseñadores usamos este navegador es por la posibilidad de poder instalar extensiones, que nos faciliten nuestro trabajo. Por si alguien no sabe lo que es una extensión, son como pequeños programas que instalamos en Chrome y que nos pueden facilitar algunos aspectos de nuestra navegación. Extensiones hay infinidad, desde juegos, alarmas de temperatura, ayudas para aprender un idioma…. Y aunque hay de pago, la mayoría son gratuitas.
Pues bien, dentro de esas extensiones podemos encontrar algunas que nos harán nuestro trabajo, y por lo tanto la vida, un poquito más fácil. La instalación es muy sencilla, así que…. seguro que alguna de esta lista te interesa!
Si necesitas tomar imágenes de una web…
1. FireShot
¿Cuántas veces buscas hacer una captura de pantalla, pero con ImprPant pierdes calidad? Esto ya nunca será un problema. Con esta extensión podrás tomar una captura entera de la pantalla o bien del área seleccionada, como tu prefieras!
Una vez lo decidas, puedes guardar la captura en el formato que más te interese .png, .pdf …. y retocarla con el programa de retoque fotográfico que tengas.
2. PicMonkey
Siguiendo con las imágenes, esta extensión te permitirá capturar todas las imágenes de una página web y trabajar independientemente con ellas. Una vez que seleccionamos la imagen podemos retocarla con el editor de la misma extensión.
Que el color no sea el problema…
3. ColorZilla
Se acabó encontrar un color en una web y tener que hacer una captura de pantalla para usar el cuentagotas y saber cual es 😉 No más colores parecidos, pero no exactos.
Con esta extensión puedes tomar el color directamente de la web y partir de ese mismo color o bien usar un degradado.
4. Palette para Chrome
Otro de los problemas relativos al color que podemos encontrar es que tenemos una imagen con una gama de colores y queramos obtener la paleta de ellos. Con esta extensión, eso quedo atrás. Basta con señalar la imagen y esta nos dará la paleta de colores correspondientes.
Combinaciones de tipografías… donde quieras!
5. Font Playground
Una de tipografías! Cuantas veces estas muy indeciso sobre cuál es la mejor tipografía para tu web, o como quedaría con tal o cual Google Font… Con esta extensión se acabaron los problemas, pues podemos probar cualquiera de las Google font en situ en nuestra web.
¿Vas a usar una combinación sans serif, o prefieres una serif?
6. What Font
Y otra más! Si por el contrario lo que nos pasa es que hemos encontrado una fuente genial en una web, pero no sabemos cuál es, esta es tu extensión. Con solo hacer «hover» encima de la fuente, sabremos qué tipo es e incluso el tamaño de la misma.
Si eres maquetador… aquí van tu top de extensiones
7. Responsive Web Design Tester
Que tu web tiene que ser responsive, creo que nadie tiene alguna duda. Pero a veces comprobarlo en todos los dispositivos se puede hacer algo difícil. Puede ser que un dispositivo especifico con un navegador determinado dé algún problema.
Pues bien, con esta extensión ya no los hay. Podrás probar tu web en multitud de dispositivos de manera que estés seguro que es responsive allá donde vaya!
Instala Responsive Web Design Tester
8. PerfectPixel by WellDoneCode
Esta puede ser tu herramienta perfecta si eres maquetador. Con ella podrás superponer el diseño con el resultado web y ver los puntos en los que estas no coinciden.
La extensión coloca un imagen en superposición con cierta transparencia para poder así, realizar una comparación de cada uno de los píxeles y garantizar así, el 100% de precisión.
9. Check My Link
Son muchas las ocasiones en las que tras escribir un post con múltiples enlaces, alguno de ellos no funciona. Seguro que hemos puesto una «h» de más, o se nos ha colado una coma. Sea como fuere, con esta extensión podemos comprobar cuales de los enlaces de nuestra web funciona y cuáles no.
Código de color universal: en verde lo que está bien y en rojo los no válidos!
Ante todo… no pierdas el tiempo!
10. StayFocusd
Esta extensión puede venir bien a más de uno… Internet es taaannn amplio que a veces incluso mientras estamos trabajando, tendemos a perder el tiempo en webs, que no deberíamos. Si quieres aumentar tu productividad, esta es tu extensión. Además de poder comprobar de el tiempo que pasas en cada una de las web por las que navegas, podrás bloquear ciertos contenidos durante un periodo de tiempo.
Estas son algunas de las extensiones que pueden ayudarte en tu trabajo como maquetador o diseñador. ¿Conoces algunas más? 🙂
Mil gracias!!!
What Font es la extensión de mis sueños.
Es muy buena!
Gracias Por tu comentario, Gabriel!
La herramienta para probar responsive que trae el propio Chrome me parece lo mejorcito. Trabajo con ella todos los días (… que me toca maquetar) y no la cambio por ninguna extensión extra xD
Añadimos otra más a la lista!
Gracias Myddna
Gracias por las recomendaciones!!
Auqneu hecho en falta la extensión de la RAE…
Muy interesante y útil, Alfonso!
Gracias por la recomendación.
Un saludo!
El mejor de todos, el último, jajaja me va a venir de perlas 🙂
Muchas gracias por el aporte, es genial¡¡
A mi concretamente la extensión PicMonkey me encanta, solo le falta que quitara la marca de agua de las imágenes y ya sería increible.
Muy buenas todas. Justo estaba necesitando una como What font. Yo no soy diseñador, soy copy y créeme valoro mucho este tipo de información. Muchas gracias por compartir.
Muchas gracias Luis!
A mi también me gusta mucho esta extensión!
Un saludo
Un contenido para el diseño web realmente genial y de gran utilidad! Gracias! 🙂
Cada día me impresiona silo creativo éxitos 😀