Las 25 mejores extensiones de Google Chrome para diseñadores y desarrolladores web

Las 25 mejores extensiones de Google Chrome para diseñadores y desarrolladores web

Hay un muchas extensiones de Chrome gratuitas para hacer tu vida más fácil. Aquí están 25 de las mejores.

Google Chrome ha ganado mucha popularidad en los últimos años entre los profesionales del diseño y desarrollo web. Y ahora, con una colección creciente de extensiones, se está convirtiendo en la primera opción para muchos desarrolladores y diseñadores web.

1. iMacros para Chrome 

iMacros permite grabar las acciones realizadas y guardarlas

Como desarrollador web, tendrás que probar tus páginas web. La repetición de las mismas acciones una y otra vez puede ser un proceso tedioso. iMacros es una extensión de Chrome con la que podrás grabar tus acciones y guardarlas, por lo que sólo tienes que hacerlo una vez. Esto te permitirá ahorrar tiempo y concentrarte en asuntos más urgentes.

2. Font Playground

Permite experimentar con fuentes locales en una página web online

Font Playground te permite experimentar con las fuentes locales y toda la biblioteca de fuentes de Google en una página web en vivo sin realizar ningún cambio real. Lo mejor de esta extensión es que incluye todos los diferentes estilos y efectos de una fuente para que puedas visualizarlos en tu página web antes de implementar los cambios.

3. Proyecto Naptha

Si alguna vez te encuentras trabajando desde un Mockup con texto incrustado, gracias a algunos OCR inteligentes puedes resaltar, copiar y pegar texto desde cualquier imagen; e incluso traducirlo también.

4. What Font

¿Qué fuente están utilizando? 

Una extensión de Google Chrome muy útil, permite a los desarrolladores y diseñadores identificar las fuentes que se utilizan en una página web.

5. Yslow

YSlow indica qué es lo que está ralentizando la página

Esta herramienta no sólo comprueba la rapidez de la carga de tu página web, sino que también te dice qué es lo que la está frenando. Yslow pone a prueba tu página web frente a las 23 de las reglas 34 identificadas por el equipo de Yahoo. Es una herramienta muy útil para analizar las páginas web y también sugiere formas de mejorar su desarrollo.

6. Web Developer

La extensión de Chrome Web Developer proporciona una serie de herramientas Dev útiles

Se añade un botón de la barra de Chrome con una gran cantidad de herramientas para el desarrollo web.

7. Web Developer checklist

Solucionar problemas de manera rápida con esta extensión de Chrome

Esta herramienta permite comprobar todo si tus páginas web están siguiendo las mejores prácticas cuando se trata de SEO, usabilidad, accesibilidad y rendimiento (velocidad de la página). Por lo tanto, si, por ejemplo, no tienes una etiqueta H1 en una página web o si a una página web le falta el título o la descripción, te lo notificará para que puedas solucionar el problema rápidamente.

8. DevTools Autosave

Guardar automáticamente los cambios en el CSS y JS de una página directamente en el archivo de origen

Una verdadera joya para todos los desarrolladores web, DevTools Autosave permite guardar automáticamente cualquier cambio que realices en el CSS o JS, a través de herramientas de entorno Chrome Dev, en tu archivo de origen. Es fácil de configurar y usar, y te ahorrará mucho tiempo.

9. Instant Wireframe

Ver tus páginas web online con una capa wireframe

Convierte cualquier página web en un wireframe con un solo clic.

10. Ripple Emulator

Ripple emulator ofrece depuración, inspección DOM y pruebas automatizadas

Ripple Emulator es un emulador multiplataforma que puede ayudarte a probar tu aplicación web usando diferentes dispositivos y resoluciones de pantalla. Ripple puede ser utilizado en conjunción con herramientas de desarrollo ya existentes para realizar la depuración, la inspección DOM y pruebas automatizadas.

11. Streak

Marca una conversación de correo electrónico como un ticket rastreable

Streak es la última herramienta para la gestión de correos electrónicos de CRM y de apoyo dentro de Gmail. Permite convertir un solo correo electrónico o una conversación entera en un ticket rastreable, organizado y que se puede gestionar o compartir con otros.

12. Search Stackoverflow

Obtener respuestas a sus preguntas de forma rápida con esta extensión

Si eres un desarrollador web, entonces probablemente has oído hablar de Stack Overflow, el sitio al que ir para cualquier problema de desarrollo. Esta extensión agrega un cuadro de búsqueda directamente en tu navegador. Una extensión Must-have!

13. PHP Ninja Manual

Toda la documentación de PHP 5.5 que necesitas sin salir del navegador

Puede ser difícil recordar todas las funciones, por lo que, si has estado perdiendo horas en Google en busca de funciones PHP específicas, esta extensión la debes de tener. El PHP Ninja Manual proporciona toda la documentación de PHP 5.5 con ejemplos en ocho idiomas sin tener que salir de tu navegador.

14. PerfectPixel

Esta extensión ayuda a asegurarte de que tu sitio cumple con el diseño pixel for pixel

Los diseñadores odian cuando crean un diseño que luego no coincide perfectamente cuando está codificado. Perfect Pixel es la extensión perfecta para los desarrolladores web que se esfuerzan por desarrollar sitios que son representaciones exactas de los diseños. Coloca una imagen de superposición semitransparente en la parte superior de su página web y realiza una comparación por cada píxel para garantizar el 100% de precisión.

15. Code Cola

Editar CSS en tus páginas web “en el acto”

No sólo te permite ver el código fuente de lo que has estado trabajando, sino que también funciona como un editor de CSS que significa que puedes editar el estilo CSS de sus páginas web “en el lugar” y ver los cambios al instante.

16. Chrome Sniffer

Inspeccionar y detectar las aplicaciones web y bibliotecas JavaScript

Esta extensión ayuda al desarrollador web a inspeccionar y detectar las aplicaciones web y las bibliotecas de JavaScript que se ejecutan en el sitio. 

17. User Agent Switcher

Ver cómo tu sitio web se ve utilizando diferentes dispositivos

Una gran herramienta para saber como se ve un sitio web al utilizar diferentes dispositivos como un iPad, iPhone o un dispositivo Android.

18. IE tab

Ver una página web con diferentes versiones de IE

Uno de los emuladores de IE más populares y útiles disponibles en la web. Esto permite a los desarrolladores web probar las páginas web con diferentes versiones de IE directamente en su navegador Chrome.

19. PicMonkey

Coge todas las imágenes de una página web con un clic de un botón

PicMonkey permite capturar cada imagen y una captura de pantalla de la página con un clic de un botón. Una vez seleccionada la imagen se puede editar como desee a partir de la aplicación de efectos a cambiar la exposición.

20. Chrome Daltonize

Crear imágenes más adecuadas para ser vistas por personas con problemas en la visión del color

El daltonismo afecta a millones de personas en todo el mundo. Esta extensión utiliza una técnica que permite la creación de imágenes más adecuadas para su visualización por aquellos con enfermedades de la vista. 

21. Page Ruler

Dibuja una regla en cualquier página con Page Ruler

Esta sencilla pero útil herramienta te permite dibujar un área en cualquier página y te proporciona la anchura, altura y posición de un elemento.

22. Check My Links

Esta extensión va a comprobar todos los enlaces de una página web, destacando los válidos en verdes y los rotos en rojo.

23 Flickr Tab

Embellecer las pestañas de Chrome con imágenes de Flickr.

Esta extensión muestra una fotografía de Fickr cada vez que se abre una pestaña vacía. Puedes hacer clic en la foto para verla en Flickr, o en el nombre de usuario para ver más fotos del fotógrafo.

24 Google Art Project 

Cada nueva pestaña de Chrome convertida en una obra de arte con el Google Art Project.

Igual que la extensión anterior pero en este caso con obras de arte servidas por el Google Art Project.

25 Data Saver (Beta) 

Ahorra dinero al visualizar los diseños en tu móvil con la compresión de Google basada en Data Saver.

Esta extensión reduce la cantidad de datos que se utilizan cuando se navega por la web. Cuando se activa, Chrome utilizará los servidores de Google para comprimir páginas antes de descargarlas. Sólo hay una salvedad: SSL y navegación de incógnito cuyas páginas no se incluirán.

Comentarios

Sin comentarios
Ha habido un error en el envío
Comentario enviado. Será revisado por la moderación antes de ser publicado.

Deja tu comentario

Tu nombre:
Tu email:
Tu comentario: