Herramientas online para desarrolladores frontend

Publicado el - Última modificación el

Cada vez es más común que en el día a día de nuestro trabajo, mezclemos el uso de aplicaciones nativas de escritorio con herramientas online, sobre todo con la explosión de RIA (Rich Internet Applications) que ha habido en los últimos años. Haremos un resumen de algunas herramientas o recursos online útiles (algunos casi imprescindibles) para cualquier desarrollador frontend. herramientas online para desarrolladores front end Can I use... La web caniuse.com es un recurso de consulta rápida para conocer el soporte actual de los navegadores a alguna característica de CSS o de HTML. Con solo teclear lo que queremos buscar ya nos mostrará tablas de compatibilidad entre navegadores, incluso nos dirá en cuáles está soportado pero aún con vendor prefixesJsFiddle JsFiddle es un editor online donde podremos incluir nuestro código CSS, HTML y JS, y renderizarlo al momento. Permite cargar reset CSS o normalized CSS, frameworks JavaScript como jQuery o MooTools, y guardar la edición mediante una URL fija para poder enlazar al código desde cualquier otro lugar. Es muy útil para discutir piezas de código con otros desarrolladores. Adobe Kuler Adobe Kuler es una aplicación social para compartir esquemas de color y paletas. Los usuarios pueden crear sus esquemas y quedan a disposición de los visitantes. Ideal cuando hay que buscar la inspiración para crear la paleta de nuestro próximo diseño. Font Squirrel Atrás quedaron los años de la limitación a Verdana, Times New Roman y Arial. Sin más límites que los legales (no todas las tipografías tienen permisos para usarse en web), ahora podemos usar cualquier tipografía gracias a herramientas como Font Squirrel. Con ella podremos subir nuestro set de tipografías, y descargarnos los archivos correspondientes adaptados para usarse desde CSS. Browser Shots Si queremos colgar a nuestra web el galardón de cross-browser, la web Browser Shots nos será de gran ayuda. Una vez que nuestra página esté online, podemos enviarla a esta herramienta y seleccionar, de entre un listado muy extenso de navegadores y sistemas operativos, aquellos en los que queramos previsualizarla. Screenqueri.es Si Browser Shots nos daba la oportunidad de previsualizar nuestra web en distintos navegadores, Screenqueri.es nos ofrece la previsualización en diferentes dispositivos con distintas resoluciones de pantalla. Sí, lo habéis adivinado, es la herramienta ideal para comprobar nuestras páginas si las desarrollamos con Responsive Web Design. moqups Los mockups son una excelente manera de esbozar la interfaz de un proyecto, y también un modo de presentar al cliente una previa del trabajo que se va a realizar. Con moqups disponemos de una herramienta online muy cómoda para generar y guardar nuestros borradores. Además nos da la opción de compartir el trabajo, de modo que no hace falta ir guardando y enviando capturas por email al cliente. GTmetrix En la era móvil la velocidad es importante. Como buen desarrollador sabrás que uno de los factores que hay que tener en cuenta al crear una web es su velocidad de carga. GTmetrix es una aplicación que evalúa tu web y le da una puntuación según lo optimizada que esté. Y no sólo eso, sino que hace un repaso a todos los puntos clave y te los explica, así que también es ideal para aprender si aún no tienes muy claro cómo optimizar tu página. Con este listado tenemos un kit básico pero fundamental para ayudarnos en nuestro trabajo. ¿Nos ayudáis a completarlo? ¿Qué herramientas online no pueden faltar en vuestras horas de desarrollo?

Publicado 11 julio, 2017

David Sanz Frías

Periodista, editor y guionista.

Periodista, editor y guionista. Reportaje y ficción. Blogs, medios escritos. Muy interesado en cultura, ecología y tecnología.

Siguiente artículo

¿Por qué una web semántica?