+40 Potentes Herramientas para el Ahorro de Tiempo en el Diseño Web
Ser un diseñador web no es nada fácil. No sólo se debe tener un buen conocimiento sobre el diseño visual, tipografía, arquitectura de la información, la psicología y una plétora de otras disciplinas, en este trabajo, hay que cuidar muchos detalles, para que este trabajo no se vuelva cada vez más lento, se requiere de docenas de herramientas, capacidad de concentración y un flujo de trabajo eficaz para obtener resultados hermosos, oportunos y funcionales.
Y aquí es donde los pequeños ahorradores de tiempo llegan a ser muy útiles. Ya se trate de una lista de comprobación práctica, instalador de lote, generador de imágenes maniquí o un convertidor de hoja de cálculo Excel a HTML – todas estas cosas nos puede ahorrar un par de minutos todos los días, por lo que este trabajo será más fácil y más eficiente. Y es por eso que este artículo ayudará a este propósito. Si le gustan las listas o no: éste probablemente le ayudará a encontrar esas pepitas de oro que hay por ahí y de esta forma le ayudará a evitar dolores de cabeza y estrés. A continuación se presentan útiles herramientas para el ahorro de tiempo para los diseñadores web.
Ahorro de tiempo para los diseñadores de la Web
LaunchList
Esta herramienta ayuda a revisar los elementos importantes antes del gran lanzamiento. De forma predeterminada, la herramienta proporciona 28 puntos de control, sino que también le permite añadir elementos personalizados a la lista. Cada artículo puede ser comentado o tachado. Una vez que haya terminado, usted puede enviar el informe junto con los detalles del proyecto a varios destinatarios por correo electrónico. Alternativas: Ultimate Website Launch Checklist y The Ultimate Website Prelaunch Checklist de Paul Boag.
Pencil Project: Dibujo y diseño de prototipos con Firefox
Pencil es una herramienta de fuente abierta de prototipado GUI. Contiene plantillas incorporadas para diagramas y prototipos, en la pantalla de edición de texto con soporte de texto enriquecido, así como las operaciones estándar de dibujo. Funciona en Firefox 3.5 +.
Zootool
Zootool es un sitio web de marcadores y la herramienta de recogida de imágenes, documentos, enlaces y vídeos desde cualquier lugar de la Web. Un bookmarklet le permite recoger objetos de forma rápida y sencilla. A continuación, puede etiquetar y organizar los elementos guardados en la parte de atrás de Zootool. También puede integrar con Zootool, Tumblr, Twitter, Delicious y FriendFeed y para compartir lo que encuentre. La captura de pantalla a través de MacStories.
Bounce
Una manera divertida y fácil de compartir ideas en un sitio web. La herramienta le permite tomar notas, escribir comentarios en una superposición de cada sitio y luego compartir las notas con los amigos.
Ninite Batch Installer
Ninite le permite elegir su software favorito de entre una lista extensa (navegadores web, mensajería, multimedia, imágenes, documentos, seguridad, tiempos de ejecución, intercambio de archivos, utilidades de compresión, herramientas de desarrollo y más), crea un instalador de lote para ellos y luego los instala de forma automática. Alternativa: Allmyapps le permite agrupar sus aplicaciones favoritas, instalarlos en un solo clic y volver a ellos cuando sea necesario.
Support Details
En caso de duda, enviar a sus clientes a esta herramienta. Sus datos se leen automáticamente fuera del navegador (incluyendo la versión Flash, sistema operativo, cookies, estado JavaScript, resolución de pantalla, el tamaño del navegador y más) y puede ser copiado, enviado directamente a usted a través de correo electrónico o guardarlos.
MugTug’s Darkroom
Cuando tenga que modificar una imagen, pero no tiene su software favorito a mano, puede utilizar el MugTug’s Darkroom todo en una sola imagen, que fue creado para los fotógrafos. Usted es capaz de ajustar los niveles, el balance de blancos, la exposición, el contraste y la saturación y aplicar unos pocos efectos fotográficos. Además, Darkroom permite subir fotos desde Picasa y Flickr. Alternativas: Pixlr y Sumo Paint.
Visual Website Optimizer
Visual Website Optimizer es sin duda el mejor A / B, split y software de pruebas múltiples jamás creado por el hombre.
Keyonary
Este sitio es una aplicación pequeña y atractiva para la búsqueda de atajos de Mac OS X, Photoshop, etc. En la actualidad, más de 250 atajos de Photoshop se han añadido. Simplemente escriba el nombre de la aplicación en el cuadro de búsqueda, y nos envía una larga lista de accesos directos.
gridr buildrrr
Estos generadores le permite elegir la rejilla para el diseño y obtener una vista previa en línea.
Instant Blueprint – Crear un marco de proyecto web en segundos.
Instant Blueprint le permite crear rápidamente un marco de proyecto web con validez HTML / XHTML y CSS en sólo cuestión de segundos, lo que le permite obtener su proyecto en marcha más rápido.
Hummingbird
Hummingbird le permite ver cómo los visitantes interactúan con su sitio web en tiempo real. Hummingbird está construido en la cima de Node.js, un nuevo conjunto de herramientas web javascript que puede manejar grandes cantidades de tráfico y muchos usuarios al mismo tiempo.
jsFiddle
Editor online para la Web, con el apoyo de JavaScript, MooTools, jQuery, Prototype, YUI, Glow y Dojo, HTML y CSS. La herramienta le permite guardar y ejecutar sus aplicaciones en el navegador web.
String: crear un sitio web en varios idiomas o aplicación
Esencialmente, es una cadena de control de versiones para la localización. Esta herramienta le permite administrar sus archivos de idioma – desde PHP a PO a Rails para aplicaciones iPhone. Puede invitar a los usuarios traducir su contenido, y realizar un seguimiento de los cambios. Puede agregar nuevas secciones e idiomas sobre la marcha y luego descargar los archivos de idioma actualizados y colocarlos en su aplicación.
Titanpad
Esta herramienta le permite editar documentos simultáneamente con otros usuarios, destacando de cada usuario editando en un color diferente. La edición se realiza en verdadero tiempo real. Buena solución para todos los que trabajan en colaboración en documentos de texto, ya sea en la misma oficina o en el otro lado del mundo.
Pixelnovel Timeline: Versión de Control para Adobe Photoshop
Esta herramienta integra básicamente un cliente de Subversion en Adobe Photoshop con un plug-in de Adobe Photoshop. Puede escuchar versiones correctas en Photoshop y administrar el control de versiones directamente desde Photoshop. No es gratis.
0to255
Una sencilla herramienta que ayuda a los diseñadores web a encontrar variaciones de cualquier color. Sólo tiene que elegir el color que desee para comenzar, y 0to255 le da una gama de colores desde el negro al blanco usando un intervalo optimizado para el diseño web. A continuación, haga clic en la variación que desee utilizar y el código hexadecimal se copia automáticamente en el portapapeles.
Load Impact: Sitio Web de carga / prueba de esfuerzo
Esta herramienta le permite descubrir los límites de rendimiento de su sitio web antes de aprender de la manera difícil. Se trata de un servicio en línea que simula usuarios que acceden a su sitio y crea gráficos de prueba de informes para averiguar cuántos usuarios de su sitio podría manejar.
Ideone: Online IDE & Debugging Tool
Esta herramienta es un compilador de línea y herramienta de depuración que permite compilar y ejecutar código en línea en más de 40 lenguajes de programación, entre ellos C + +, Java, JavaScript, Perl, PHP, Python y Ruby. Alternativas en línea: PHP Anywhere (editor en línea PHP) y CodeRun (le permite desarrollar, probar y depurar ASP.NET, PHP y aplicaciones Ajax en línea).
Online Dummy Image Generator
Esta herramienta en línea genera imágenes ficticias para su sitio: puede especificar los colores de tamaño, de fondo y de primer plano, formato de imagen y añadir texto personalizado. También puede utilizar los métodos abreviados para varias dimensiones estándar, incluyendo tamaños de anuncios (mediumrectangle, skyscarper, clasificación, etc), el tamaño de resolución de pantalla y los estándares de vídeo (NTSC, PAL, HD720, HD1080).
ExtendsClass
Las expresiones regulares pueden ser un dolor. La herramienta ExtendsClass es 100% usando jQuery JavaScript.
Esta herramienta en línea le permite probar la expresión regular en JavaScript y PCRE (Python, PHP). También le permite generar un ejemplo de cadena desde un RegEx.
Puede consultar el Inicio rápido de expresiones regulares o consultar la guía de usuario completa para ayudarle a usar este probador de expresiones regulares.
Tableizer
Los clientes a menudo proporcionan datos en forma de hoja de cálculo y volver a formatear en HTML puede ser un dolor real. Esta herramienta genera tablas HTML a partir de datos de hojas de cálculo. Sólo tiene que copiar y pegar las celdas de la hoja de cálculo, elija sus opciones (tipo de letra, tamaño de fuente y color de cabecera) y tiene una tabla HTML con el formato correcto para sus datos.
FollowUpThen: Fácil Recordatorio de correo electrónico
Si no le importa el envío de sus e-mails a un tercero, prueba esta herramienta para los recordatorios de correo electrónico fácilmente. En el siguiente correo electrónico basta con incluir time-interval@followupthen.com y la herramienta hará un seguimiento después del intervalo de tiempo especificado. No se requiere cuenta.
Divine: Herramienta de conversión de PSD a HTML
Divine es un plug-in que se encuentra en la parte superior de Photoshop. Una vez que haya terminado el diseño en Photoshop, abra el plug-in Divine en Photoshop, asigna funciones de WordPress a los elementos principales (por ejemplo, # pie de página, # header, etc), y luego el plug-in preparará todos los archivos que necesita. Una vez establecido el acceso FTP, los archivos de la herramienta del tema automáticamente los envía a su servidor. Absolutamente libre.
Kaleido
Esta herramienta le permite crear efectos visuales significativos para el código y se puede utilizar para planificar, organizar y navegar por el código de una manera más intuitiva.
Sketchpad
Esta aplicación es un potente editor de imágenes online. Sus herramientas están organizadas en cajas de útiles, que pueden arrastrarse, que pueden posicionarse mucho como puedes ver en las tradicionales aplicaciones de edición de imágenes.
Unicode code converter
Escriba o pegue el texto en cualquiera de las casillas sombreadas de color verde o gris y haga clic en el botón Convertir encima de ella. Las representaciones alternativas aparecerán en todas las otras cajas. A continuación, puede cortar y pegar los resultados en el documento.
Grid System Generator
Esta herramienta genera en los sistemas de red válido css / xhtml para el prototipado rápido, entornos de desarrollo y producción. Los generadores del sistema de rejilla ofrecen la posibilidad de personalizar el ancho, número de columnas y el margen (s) para permitir más flexibilidad para varios diseños.
ud.com namecheck
La herramienta comprueba la disponibilidad de nombres de usuario, nombres de dominios sociales y las marcas.
Typograph — Escala y Ritmo
Una herramienta útil para probar la escala y el ritmo tipográfico. Le permite ajustar factores como la escala tipográfica (tradicional, 3:5 Fibonacci, Le Corbusier, etc), el tamaño de fuente en porcentaje, la altura de la línea, el diseño, el relleno y la altura de la línea para los encabezados h1, h2 y h3.
ColorBrewer Intro – Selección de buenas combinaciones de colores para mapas
ColorBrewer es una herramienta en línea diseñada para ayudar a las personas a seleccionar buenos esquemas de color para mapas y otros gráficos.
CSS Inliner Tool
Si alguna vez ha enviado una campaña de correo electrónico, sabe que si su CSS no está codificado en línea, es probable que se despoje a cabo por clientes de correo electrónico, que pueden hacer el diseño de su correo electrónico bastante funky. Escribir CSS en línea puede llevar mucho tiempo y con muchas repetitivas. MailChimp tiene una herramienta de conversión de CSS en línea construida directamente que automáticamente transformará todos los estilos locales en los estilos en línea. Los diseñadores lo han encontrado muy útil, pensamos que sería mejor compartirlo con todo el mundo – incluso si no tiene una cuenta de MailChimp.
HTML Purifier – Filtrar el código HTML de la manera compatible con los estándares.
HTML Purifier es compatible con los estándares HTML con una biblioteca filtro escrita en PHP. HTML Purifier elimina el código malicioso (más conocida como XSS) y se asegura de que sus documentos son compatibles con los estándares.
Rendera
Rendera ayuda a aprender HTML5 y CSS. Escriba su código HTML y verlo en Rendera en tiempo real. A continuación, el estilo con CSS. Puede utilizar cualquiera de las etiquetas HTML 5 o CSS3 en su navegador. La herramienta es compatible con HAML y SASS.
RegExr
Una herramienta intuitiva para aprender, escribir y probar expresiones regulares.
try ruby! (en su navegador)
Esta herramienta le permite probar el código Ruby en la línea de línea de comandos del sistema. Es compatible con built-in de métodos Ruby, y contiene un tutorial paso a paso para novatos en Ruby.
Google Command Line
GoogleCL es una utilidad de línea de comandos que permite acceder a varios servicios de Google. Simplifica las tareas tales como la publicación en un blog de Blogger, agregar eventos al calendario, o editar documentos en Google Docs.
Tiny Fluid Grid
Sencilla herramienta que genera código para diseños fluidos a base de rejilla.
Fonolo.com
Esta herramienta en línea le permite omitir los menús telefónicos de cientos de empresas y hace que sea menos frustrante para llamar a las grandes empresas. Para los dueños de negocios, Fonolo permite a sus clientes ver realmente sus opciones de menú del teléfono, antes de que le llamen.
Producteev: Creación de listas de tareas con correos electrónicos
Transfiere sus correos electrónicos importantes a task@producteev.com y la herramienta va a crear listas de tareas sobre la marcha y le envian un email cuando sea necesario. Se puede integrar en mensajes de correo electrónico, mensajería instantánea, Web, iPhone, Gmail, Google Calendar, etc.
AddUse – La investigación del usuario de forma fácil
AddUse es una herramienta basada en la Web que le ayuda a crear, gestionar y presentar su investigación del usuario de una forma sencilla, fácil de usar y cuestan manera eficiente. Es una herramienta a utilizar en un momento dado en su proceso de desarrollo. Se presentan los resultados de sus pruebas de usuario, encuestas y cuestionarios de una manera gráfica, ayudando eficazmente ingeniería, marketing y gestión de grupos de tomar las decisiones correctas.
bookwhen
El registro en línea para eventos, talleres, clases y cursos. La versión gratuita permite 150 eventos con 300 reservas mensuales.
Otras Herramientas Útiles
see[Mike]code: herramienta para la entrevista de codificación remoto
Esta sencilla herramienta le permite realizar una breve entrevista codificación remota: crea una página disponible del candidato y le permite descubrir personas que luchan por código con problemas grandes o pequeños.
jsdo.it
Esta herramienta le permite escribir el código en su navegador, tenedor y modificar cualquier código, corregir los errores y añadir características y también preguntar a la comunidad acerca de sus problemas.
JavaScript Error Tracking
El servicio de seguimiento de errores de JavaScript que se producen en su sitio y le proporciona un seguimiento de la pila para ayudarle a depurar. Los errores similares se agrupan.
Old Version
Old Version tiene exactamente eso, la versión anterior de algunos de sus programas favoritos. ¿Por qué? Porque más nuevo no siempre es mejor. A veces, las versiones más recientes causar conflictos. De esta manera, siempre se puede volver a la versión anterior que trabajó para usted.
Onbile
Onbile es una plataforma gratuita para crear y gestionar su versión para móviles para iPhone, Android y Blackberry los usuarios.
Contabilidad Libre, Contabilidad, y Servicios Fiscales; Mi Empleo y Éxito Freelance
Importe fácilmente sus cuentas en línea para poner su contabilidad en piloto automático y preparar los impuestos. Ponte al día con los informes que le dan visibilidad a su P & L, ingresos y gastos.
iSendr
iSendr le permite enviar archivos a tus amigos directamente, sin subir a un servidor.
seekWP
Documentación de WordPress en buscadores.
speedtracer
Speed Tracer es una herramienta para ayudarle a identificar y solucionar problemas de rendimiento en aplicaciones web. Visualiza parámetros que se toman de bajos puntos de nivel de instrumentación dentro del navegador y los analiza como se ejecuta la aplicación. Speed Tracer está disponible como una extensión de Chrome y funciona en todas las plataformas donde las extensiones son compatibles actualmente (Windows y Linux).
Markkit-Selecciona el texto en cualquier página web
Markkit es un marcador de texto web2.0. Arrastrar y soltar el lápiz amarillo markkit en la barra del navegador. Cada vez que desee resaltar texto en una página web, haga clic en el bookmarklet Markkit. markkit sólo funciona con Mozilla Firefox, Opera, Google Chrome y Apple Safari.
GotSiteMonitor.com
Inicia la supervisión de su sitio web en cuestión de minutos con monitor sitio web gratis. Recibe alertas instantáneas cuando su sitio está abajo.
OpenWith.org
Esta página proporciona información detallada sobre la extensión de la mayoría de archivos y enlaces a programas gratuitos que se pueden abrir y crear para cada tipo de archivo.
Últimos Clics
Kuku Klok
Reloj despertador en línea y llamada de atención para aquellos de nosotros que a menudo trabajamos demasiado y podemos quedarnos dormidos delante de la pantalla. Abra el sitio web, seleccione la hora de alarma deseada y establezca su favorita llamada de atención. Mantenga la pestaña del navegador abierta. Afortunadamente, este reloj de alarma en línea funciona incluso si su conexión a Internet se cae. Los sonidos disponibles son «Reloj Classic», «Electrónico», «Guitar Slayer», «Trumpet Militar» y «Gallo».
What the Hex?
Entre la variedad de métodos de representación de los valores de color, algunos son más fáciles de identificar que otros. El sistema hexadecimal, sin embargo, a menudo parece incomprensible. Si usted siente que sabe muy bien de colores, entonces este es un juego simple para usted. Todo lo que tiene que hacer es comparar el código hexadecimal (que es en realidad un grupo de tres números hexadecimales: # rrggbb) con el color correspondiente. Por supuesto, esto es más fácil decirlo que hacerlo, pero se puede ajustar la dificultad, mostrando entre 2 y 48 posibles respuestas.
Artículos relacionados:
Blog dedicado al E-business, E-commerce y Social Media
Eduarea's Blog 
Reblogged this on Sol i fa plou! El blog de l'Eli Capdevila..
Me gustaMe gusta
Genial Eduardo.
La verdad es que no conocía mucha de las tools y si que son prácticas.
Un saludo.
Me gustaMe gusta