Compilarlo: 11 extensiones de Chrome brillantes para desarrolladores web

Anuncio

Chrome capturó recientemente una participación del 25% del mercado de navegadores de Internet, lo que lo convierte en el segundo navegador más utilizado en el mundo después de Internet Explorer (que se está convirtiendo en Project Spartan Project Spartan: un navegador delgado e inacabado para la web modernaSpartan comienza la pelea con competidores de navegadores como Chrome y Firefox. ¿Estará a la altura de los ideales de los soldados espartanos? Pusimos a prueba esta primera versión y no nos impresionó. Lee mas ). En definitiva, esto significa que Chrome es el de facto Inicio para desarrolladores web.

Aunque soy partidario de Firefox, puedo apreciar por qué la gente ama a Chrome. Tiende a dominar los puntos de referencia del navegador Browser Wars: Firefox vs. Chrome vs. Opera, el punto de referencia definitivoSi solo pudieras elegir un navegador, ¿cuál sería? ¿Qué es mejor: Firefox, Chrome u Opera? Te lo mostraremos. Lee mas y hace que sea fácil para la gente normal convertirse en usuarios avanzados de Chrome

Cómo convertirse en un usuario avanzado de Chrome, Parte 1 - Domina el tecladoGoogle Chrome durante algún tiempo ha sido el navegador elegido por muchos y, aunque la mayoría de nuestros navegadores web pueden hacer cosas bastante impresionantes, Chrome ha seguido obteniendo energía usuarios, ... Lee mas . Otros realmente odian Chrome pero son atrapado usándolo Odio Google Chrome pero estoy atrapado en él. Este es el por quéEn el Chrome vs. Guerra de Firefox, estoy del lado de los usuarios de Google. Pero no quiero hacerlo. Chrome es mi navegador preferido porque tiene características sin las que no puedo vivir. Lee mas debido a la disponibilidad de ciertas extensiones.

Esa es una razón por la cual Chrome es tan bueno para los desarrolladores web: el Tienda virtual de Chrome ¿Qué tan seguro es Chrome Web Store de todos modos?Un estudio financiado por Google descubrió que decenas de millones de usuarios de Chrome tienen complementos que albergan malware instalado, lo que representa el 5% del tráfico total de Google. ¿Eres una de estas personas y qué debes hacer? Lee mas y su conjunto de extensiones. Si alguna vez planea diseñar o codificar un sitio web, aquí hay algunas herramientas esenciales que debe instalar de inmediato.

ColorZilla comenzó como un complemento de Firefox, pero se hizo tan popular que muchos solicitaron una versión de Chrome. Ahora aquí estamos. Esta práctica extensión es básicamente una versión avanzada de la herramienta de cuentagotas que encontrarás en un programa como Paint o Photoshop.

Con él, puede apuntar a cualquier punto en su navegador e inmediatamente extraer la información de color en ese punto. Una vez tirado, puede ajustarlo (ya sea mediante RGB, HSV o hexadecimal) antes de copiarlo en su portapapeles. Extremadamente fácil de usar.

También viene con un generador de gradiente CSS, un analizador de color de página web y algunas paletas de colores preinstaladas para su conveniencia.

Uno de los peligros del desarrollador web es asegurarse de que la experiencia de visualización de un sitio web sea agradable para los usuarios en todo tipo de dispositivos. No solo estamos hablando de dispositivos móviles vs. escritorio - que es importante, pero también la diferencia entre tabletas pequeñas y monitores masivos.

Redimensionador de ventana es una manera fácil de cambiar el tamaño de la ventana del navegador sobre la marcha. Con solo hacer clic en un botón, podrá probar su sitio web en varias resoluciones para ver lo que ven sus usuarios, y luego puede ajustarlo en consecuencia.

Otro gran peligro del desarrollador web son los estándares del navegador (o la falta de ellos). Internet Explorer, Firefox, Chrome, Opera y todos los demás navegadores menores mostrarán los sitios web de formas ligeramente diferentes. Mientras tanto, algunos navegadores son más lentos para adoptar estándares que otros.

O en el caso de Internet Explorer, los estándares se tiran por la ventana y los desarrolladores web se ven obligados a arrancarse el pelo cuando se ven obligados a hacer ajustes.

Con Pestaña IE, este proceso se hace un poco más fácil. Le permite ver un sitio web en una nueva pestaña de Chrome, pero se muestra como aparecería en IE. No es una solución revolucionaria para el problema de IE, pero al menos es algo.

No todo el código HTML es igual. Mientras que los navegadores juegan un papel importante en el cumplimiento de los estándares, parte de la responsabilidad recae también en el desarrollador web para seguir las buenas prácticas de HTML. Por eso hay herramientas disponibles para probar y validar HTML Los 5 mejores editores HTML gratuitos en línea para probar su códigoPara los momentos en que solo quiere jugar con un pequeño fragmento de HTML para que pueda modificarlo a su gusto, un editor de HTML en línea le servirá mejor. Lee mas .

Validez es una extensión que te permite hacer todo eso sin tener que visitar sitios de terceros. Simplemente abra su sitio web, haga clic en el botón y mostrará todos los mensajes HTML no válidos en la consola del navegador. La validación se realiza a través del Servicio de Validación W3C.

Una cosa que odio del desarrollo web es que hay Tantos bibliotecas, marcos y motores disponibles para su uso. La libertad de elección es excelente, pero es una molestia cuando la cantidad de tecnologías se vuelve tan grande que no puede mantenerse al día con todas ellas.

¿Alguna vez ha visitado un sitio web y se ha preguntado cuál es la tecnología subyacente?

los Construido con La extensión es un solo botón que analiza la página web actual para ver todos de las bibliotecas web, los marcos y los motores que lo impulsan, incluidas las redes de publicidad, las plataformas de distribución de contenido e incluso el software de alojamiento detrás de todo.

Postman REST Client [ya no está disponible]

Para aquellos de ustedes que trabajan con API REST, Cartero es la herramienta que necesita para un flujo de trabajo optimizado. Con él, puede construir solicitudes HTTP y obtener respuestas formateadas en JSON y XML. Las respuestas se abren en una ventana separada como HTML.

También puede agrupar varias solicitudes en algo llamado colección, que es una excelente manera de mantenerse organizado y eficiente. También puede probar en múltiples entornos cambiando las variables ambientales dentro de la extensión.

Una forma de generar texto de relleno es copiar y pegar "asdf" una y otra vez cien veces. Una mejor manera sería instalar Ipsum corporativo y deja que genere texto de relleno para ti en un abrir y cerrar de ojos.

Hemos cubierto varios Generadores Lorem Ipsum 10 alternativas prácticas si está cansado de los textos habituales de Lorem Ipsum FillerLos diseñadores web probablemente tengan un conjunto de herramientas de Lorem Ipsum guardadas cerca que son útiles para su trabajo de desarrollo web. Los generadores Lorem Ipsum vienen en varias formas; algunos de ellos permiten personalizar el texto ficticio ... Lee mas antes, pero el atractivo de Corporate Ipsum es que se encuentra justo en su navegador. Puede levantarlo con un solo clic en el botón. No hay razón para no usarlo, si me preguntas. ¡Ahora puede volver a codificar su sitio web!

El desarrollo web a veces ocurre en múltiples máquinas. Mientras control de fuente para desarrolladores ¿Qué es Git y por qué debería usar el control de versiones si es desarrollador?Como desarrolladores web, muchas veces tendemos a trabajar en sitios de desarrollo local y luego cargamos todo cuando terminamos. Esto está bien cuando solo eres tú y los cambios son pequeños, ... Lee mas es la forma principal de mantenerse sincronizado y actualizado, ¿qué sucede si desea transferir varias pestañas a través de las computadoras? Ahí es donde TabCloud viene en.

TabCloud sincroniza tus pestañas con la nube, lo que te permite volver a abrirlas en otro lugar. También se puede usar localmente como un protector de sesión, lo que le permite almacenar un conjunto de pestañas para volver a visitarlo más tarde. Las pestañas se guardan en su cuenta de Google.

El diseño de fuentes es un gran componente del desarrollo web, por lo que servicios como Fuentes web de Google Cómo usar las fuentes de Google en su próximo proyecto web y por qué deberíaLa elección de fuente es una decisión de diseño integral en cualquier sitio web, pero la mayoría de las veces estamos contentos con la misma familia serif y sans-serif. Si bien el cuerpo principal del texto siempre debe ser algo ... Lee mas se han vuelto tan populares La buena noticia es que estas fuentes gratuitas ahora son algunas de las fuentes web más bellas Arregle su sitio web con estas 12 hermosas fuentes web de GoogleDurante la última década, comencé una serie de blogs personales con los que nunca seguí realmente, pero algunos de mis mejores recuerdos se basan en el diseño de temas y ajustes de fuentes. Hay algo satisfactorio cuando ... Lee mas actualmente disponible.

Pero admítelo: hay momentos en los que navegas por la web y te encuentras con una fuente impresionante que nunca has visto antes. Hay muchas formas de identificarlo, pero la forma más rápida es usar WhatFont. Con él, puede inspeccionar las fuentes simplemente flotando sobre ellos. ¿Cómo podría ser más fácil?

Captura de pantalla impresionante [ya no está disponible]

Si las capturas de pantalla no son parte de su rutina habitual de desarrollo web, Captura de pantalla impresionante ayudará a cambiar eso. Las capturas de pantalla son excelentes para documentar cambios en el diseño y compartir trabajos en progreso con su cliente o miembros del equipo.

Esta extensión tiene varias funciones de captura, incluida la página completa, el área seleccionada o el área visible. También le permite agregar anotaciones, desenfocar partes sensibles de la imagen y compartirlas con un solo clic. O subir a su Google Drive en su lugar.

Si el concepto te intriga pero prefieres usar un programa de escritorio más potente, mira esto comparación de herramientas de captura de pantalla Las 4 mejores herramientas para crear capturas de pantalla comparadasCTRL + MAYÚS + 4. Tres teclas: eso es todo lo que necesitas para capturas de pantalla perfectas. ¡No tiene por qué ser una molestia! Pruebe estas herramientas avanzadas de captura de pantalla y nunca volverá a mirar atrás. Lee mas y comience a usar el que mejor funcione para usted.

Muchos errores de desarrollo web frustrarán a sus visitantes, y los enlaces rotos son uno de los peores infractores. Un enlace roto puede estar bien, pero nada más que eso y su sitio web comienza a perder credibilidad y reputación. Afortunadamente, este es un error fácil de evitar.

Revisa mis enlaces hace exactamente lo que promete: comprueba tus enlaces. Los enlaces válidos están marcados en verde mientras que los enlaces rotos están marcados en rojo y al final le dará un puntaje porcentual. ¡Todo lo que tienes que hacer después es ir y reparar esos enlaces!

¿Qué extensiones utilizas?

Uno mas extensión para la productividad 15 extensiones imperdibles de Chrome para la productividadHoy te traemos algunas extensiones esenciales más orientadas a ayudarte a trabajar mejor en línea. Lee mas Yo recomendaría es StayFocusd. Es más una extensión de propósito general que una extensión de desarrollo web, pero sin duda es útil de todos modos. ¡Evita que la web te distraiga mientras trabajas!

¿Qué opinas de estos? ¿Hay alguna otra extensión de desarrollo web esencial que recomiende? ¡Comparte con nosotros en los comentarios a continuación!