10 alternativas gratuitas para crear alertas con JavaScript

Pablo

Cuando diseñamos o desarrollamos ya sea un sitio o una aplicación, muchas veces pasamos detalles por alto, ya sea por costumbre, pereza o por simple desconocimiento.

Por ejemplo, funciones básicas que empleamos todo el tiempo, necesarias e imprescindibles, una de estas funciones que existen desde hace ya varios años es Alert(), función de JavaScript que permite lanzar una alerta en primer plano para alertar al visitante determinado acontecimiento.

Alert() es una función sencilla para desplegar mensajes, pero que lamentablemente y de forma nativa evoluciono muy poco, al menos desde el punto de vista estético.

Emplear dicha función no esta mal, pero siendo honesto, deja un saber amargo cuando el diseño total del proyecto es cuidado.

Uno de los principales problemas de hacer uso de esta función JavaScript para lanzar alertas es su diseño poco homogéneo, esto se debe a que cada navegador de forma nativa, diseña estas alertas de un modo distinto. Si bien es cierto que a nivel funcionalidad todos los navegadores hacen una correcta interpretación, desde el punto de vista estético estas diferencias se encuentran bien marcadas.

Otro aspecto que me molesta de la alerta por defecto es su aspecto rudo, no lo digo por solo por una cuestión estética, sino más bien por la referencia directa que hacemos las personas cuando vemos este tipo de carteles en nuestra computadora y como los relacionamos con un producto mal diseñado, probablemente esto se deba a muchos años recibiendo estas alertas cuando un programa se colgaba, aunque este ultimo punto quizás sea por mi edad y tantas luchas con equipos y sistemas operativos hoy obsoletos.

La buena noticia es que una alerta lanzada con JavaScript se puede modificar, cambiando no solo su aspecto visual sino también su comportamiento. Adecuando el diseño al de nuestro proyecto para que el mismo guarde una relación, haciendo más amena la experiencia del usuario.

Para personalizar una alerta les presentó 10 alternativas, todas guardan relación, sin embargo algunas presentan características interesantes.

1. Sweet Alert. Una biblioteca Javascript que nos permite reemplazar fácilmente el Alert() de toda la vida, el diseño se encuentra modernizado además de presentar pequeñas animaciones. El resultado es muy bueno.

Para emplear esta biblioteca necesitamos incluir la hoja de estilo y archivo JavaScript a nuestro proyecto, luego unas pocas lineas de código hacen la magia. Es muy simple y el resultado es muy bueno.

alerta animada con javascript

2. Meteor. Una bonita interpretación sobre como debería funcionar una alerta. A diferencia de la convencional la propuesta consiste en mostrar pequeños avisos, en algún rincón del navegador.

Esta biblioteca propone un sistema de notificación más que uno de alertas, sin embargo y llegado el caso puede ser un recurso interesante si lo que queremos mostrar es un pequeño aviso a nuestros visitantes sin llegar al punto de invadirlos con una alerta que se ubica en el centro de la pantalla.

Además el proyecto brinda una serie de alternativas a la hora de animar los mensajes, un bonito resultado muy fácil de emplear.

notificaciones animadas

3. WOW-alert. Un plugin jQuery para reemplazar directamente las alertas por defecto creadas con JavaScript, su implementación se realiza en pocos minutos y el resultado es muy agradable, eso si, es muy fácil personalizar las alertas para que guarden una relación con el diseño de nuestro sitio.

reemplazar alert con wow

4. Freeow. Otro sistema de alertas pensado para funcionar a modo de notificaciones, tiene como principal característica la de mostrar un bonito efecto fade para aparecer y desaparecer. Es ideal para comunicar acontecimientos secundarios, por ejemplo que el servidor finalizo una acción, o que se guardo un documento de manera automática.

En el sitio del proyecto van a encontrar un formulario que permite modificar las opciones de configuración, ideal para probar la biblioteca antes de emplearla.

alertas estilo Growl

5. Twitter Bootstrap Extensions: Notifications. Un sistema de alertas/notificaciones pero pensado para funcionar de manera conjunta a Bootstrap.

El punto más favorable de esto es que si nuestro proyecto emplea Bootstrap nos vamos ahorrar unos cuantos bytes de transferencia al tener la mayoría de las dependencias necesarias instaladas.

Además su estructura se basa también en el framework de Twitter lo que permite una sencilla modificación.

sistema de alertas compatible con bootstrap 3

6. Alertify.js. La biblioteca ya no se actualiza, sin embargo siempre me gustó el resultado que deviene de su utilización. Este proyecto lo utilice varias veces y nunca tuve problemas.

Es liviano, no tiene dependencias, es fácil de usar y lo mejor es que funciona en la mayoría de los navegadores modernos, además de correr muy bien en navegadores de dispositivos móviles.

dialogo sencillo con alertify

7. jQuery-popup-box. Una biblioteca para emplear con jQuery y jQuery UI. Muy fácil de usar.

Las alertas se lanzan con apenas unas linea de código y sin realizar complejas configuraciones, eso si, las posibilidades son muy limitadas. Ideal para aquellos que buscan una alerta un poco mejor que la que se utiliza por defecto.

ejemplo basico de dialogo ui

8. Zebra Dialog. Un plugin jQuery para lanzar alertas pero que a diferencia de las soluciones anteriores cuenta con un abanico muy importante de posibilidades de configuración.

Esta biblioteca tiene la posibilidad de configurar el tipo de alerta, si es de error, una advertencia, etc. Esto puede ser muy útil cuando vamos necesitamos confirmar una acción que puede devolver distintas respuestas, por ejemplo, completar un formulario con determinado tipo de datos, validaciones, etc.

notificacion sencilla

9. Dalert. Otro plugin para jQuery y jQuery UI. Tiene varias opciones de configuración y cuenta con un diseño que permite realizar cambios de una manera rápida y sin demasiadas complicaciones.

ejemplo de dalert

10. MooDialog. Una alternativa para lanzar alertas personalizadas pero empleando el framework Mootools, que muchos dan por muerto, pero que aún conserva muchísimos fanáticos en todo el mundo.

alerta con mootools

Espero que les resulte de utilidad esta pequeña colección.

Como siempre todas las sugerencias son bienvenidas :D

Animatron: animaciones HTML5 para tu sitio

Tamara

No existen en general muchas herramientas que permitan realizar animaciones para incluir en sitios web, la realidad es que desde que los elementos elaborados en Flash comenzaron a desaparecer de las webs, se han dejado de lado, cuando en realidad, puede que haya cambiado la herramienta, pero no la funcionalidad de las mismas.

Hay quienes aún quieren apostar a las animaciones y no piensen que porque no se hagan en Flash han desaparecido definitivamente. Hay otras formas de implementarlas y puede que en un principio sean algo complejas, pero finalmente resultarán utilizadas de igual manera a como se hacía hace un tiempo.

La idea de Animatron es generar un espacio creativo en el que quienes deseen animar diferentes tipos de objetos o crearlos desde cero, puedan hacerlo de forma fácil, accesible y simple, sin contratiempos.

Realizar animaciones HTML5

Está claro que quienes mejor dibujen o estén acostumbrados al uso del pincel en el ordenador, tendrán mejores posibilidades de obtener un resultado sorprendente. Pero por otra parte, también es una buena forma de animar banners con formas simples e información relacionada a un producto o servicio.

Lo mejor es siempre probar a ver qué podemos hacer y así ir aprendiendo las nuevas herramientas que salen todo el tiempo, a fin de cuentas, la finalidad es simplificar nuestro trabajo y poder con recursos innovadores, implementar ideas que se destaquen del resto y sean funcionales a nuestras necesidades o la de nuestros clientes.

Animatron, cuenta con la opción de colaborar en el proyecto, esto es algo que se utiliza mucho en la animación tradicional, ya que el mismo proceso tiene diferentes etapas. También pueden importarse componentes de medios como sonidos o imágenes que necesiten ser agregados a la composición. El manejo es muy intuitivo si es que alguna vez utilizaron cualquier editor de imágenes y en especial si en algún momento aprendieron a utilizar Flash o After Effects.

Las cuentas de invitado permiten realizar animaciones de prueba pero solo están abiertas durante 14 días, por lo que si necesitan acceder a todos los beneficios que ofrece el sistema, les recomiendo se registren ya que es gratuito y así tendrán completo control sobre los archivos que elaboren.

La plataforma es gratuita aunque hay algunas limitaciones en su plan básico, quienes quieran ofrecer los servicios de animación de forma profesional, podrían considerar contratar uno de sus planes que si consideran la herramienta y las posibilidades que ofrece, resultan bastante accesibles.

Sitio: Animatron

Neatly: Cliente liviano para Twitter

Isabel

Asombra ver como si recorro todos mis conocidos el 90% de ellos no usa el cliente oficial de Twitter en su móvil. Nadie puede culparlos, a muchos no nos duró ni un día instalado no solo por la cantidad de recursos innecesarios que consume sino por su peso completamente sin sentido. La realidad es que además esto empeora con cada actualización lo que hace que incluso quienes no se animaban al cambio terminan haciéndolo.

Por estos motivos hemos visto ya varios clientes de Twitter para Android y hoy es momento de conocer uno mas. Neatly se presenta como una opción “inteligente y veloz” para utilizar esta red social sin problemas de manera gratuita.

Neatly: Cliente liviano para Twitter

¿Por qué utilizan el término “inteligente”? porque aseguran que está desarrollado de forma tal que nuestro timeline muestre lo que realmente nos interesa, en base a nuestras preferencias sociales y temas en los que hemos mostrado curiosidad. Al ser así, la información será capturada de nuestro propio uso, por lo que a mayor tiempo instalada mejores resultados obtendremos.

También podemos seleccionar los usuarios que mas nos interesan para sumarlos en diferentes líneas de tiempo, además de aplicar filtros para eliminar lo que no queremos recibir y configurar hashtags como temas importantes, genial para cuando deseamos seguir de cerca algún tipo de noticia o evento. Para los usuarios seleccionados de los que les hablaba se pueden determinar colores con el fin de identificarlos con mayor facilidad. Dentro de cada perfil una sección que se suma es la del indicador de temas en común, gan utilidad que puede darnos una guía sobre si debemos seguir a alguien o no cuando deseemos basarnos en los intereses que se vean compartidos.

Visualmente nada hay para reprocharle, la herramienta cuenta con estilo flat,  es atractiva y varios elementos son configurables mientras que la lectura es agradable al máximo.

Están las aplicaciones extremadamente livianas y las que no lo son pero aún así siguen abajo del peso de Twitter para Android. Existen alternativas mas simples y ligeras que Neatly pero en este caso se supo sumar funciones o detalles que a mas de uno les resultarán atractivos y es por eso que la recomendación no podía dejarse de lado. Como ocurre con todo este tipo de aplicaciones, el uso que le demos o lo efectiva que nos resultará va a depender de como manejemos la red social y cuanto tiempo, razón mas para conocer la mayor cantidad de alternativas que podamos y dar asi con la que nos resulte perfecta.

Neatly – Tamaño: 6.7M – Descargar [Android v4.0+]

Vivify Scrum: organización de proyectos grupales

Tamara

En lo personal, considero que la organización de los proyectos es primordial para el buen desarrollo y sobre todo para cumplir en tiempo y forma con las metas propuestas. En este blog hemos hablado incontables veces sobre la necesidad de optimizar los tiempos productivos y así lograr mejores resultados en el menor tiempo posible.

También hemos hablado sobre diversas herramientas que permiten realizar la organización adecuada de los grupos de trabajo, con división y asignación de tareas, notificaciones y calendarios de vencimientos. Y si bien, en un primer momento, puede ser algo confuso para los integrantes que hasta ese momento estaban acostumbrados a trabajar cómo y cuándo querían, el hecho de cumplir con un tiempo estipulado no solo optimizará el proyecto general sino su productividad personal.

Vivify Scrum: gestor de proyectos

Hoy día me encuentro con Vivify Scrum, una plataforma que permite establecer proyectos, lineamientos y compartirlos con el grupo de trabajo para realizar esto que comentaba anteriormente de la mejor manera.

Estéticamente resulta muy atractivo y en cuestiones de usabilidad es bastante intuitivo. En primera instancia podrán crear una tabla de proyecto con la descripción sobre aquello en lo que se trabajará en grupo. Allí podrán seleccionar los integrantes y las funciones que tendrán disponibles según su nivel de responsabilidad:

  • Product Owner
  • Scrum Master
  • Developer
  • Observer

También podrán enviar invitaciones a todos aquellos que participen del proyecto, editar y revocar funciones según la necesidad. De cara a la división de tareas podremos no solo designar un usuario específico sino que cada una de las asignaciones puede contener opciones para que los participantes seleccionen sus preferencias, adjuntar archivos, establecer puntajes de la asignación, prioridades y la naturaleza de la tarea, ya sea que se trate de una mejora, una corrección o una nueva implementación.

En cada uno de los proyectos podrán implementar diferentes columnas para definir las acciones a tener en cuenta. Esto permitirá un completo control sobre el proyecto, sin caer en columnas por defecto como en casi todos los sistemas existentes, que no tienen nada que ver con los pasos que necesitan utilizar.

Vivify Scrum: gestor de proyectos online

Es, sin duda un sistema que podría ser mejor entendido a medida que se utiliza, por mi parte considero que es una excelente ayuda una vez que logramos comprender a qué corresponde cada una de las opciones que nos ofrece, y su implementación, si bien puede ser un tanto incómoda en principio, una vez que comenzamos a usarlo se convierte en una herramienta eficaz que optimiza los tiempos y sobretodo, deja bien en claro los pasos a seguir y las tareas que cada uno deberá realizar.

Una buena plataforma gratuita e ilimitada para quienes buscan organizar sus proyectos en equipo de forma rápida, simple y personalizada.

Sitio: Vivify Scrum

Editor WYSIWYG con guardado automático

Tamara

Hay una infinidad de herramientas de este estilo, pero es la primera vez que me encuentro con una opción que posee algunas cualidades que lo hacen fuera de lo común, y sobretodo, muy útil para cualquiera que desee implementar un editor de texto en su sitio, sea cual fuere el fin particular.

Las características de Smalleditor son muy interesantes desde el punto de vista de la implementación y de las opciones disponibles. La idea es que quien escriba en él, no pueda perder jamás la información y tenga las herramientas suficientes como para concentrarse solo en escribir.

Una interface limpia y simple, que permite a quien escribe centrarse en la tarea sin necesidad de pensar en otra cosa. Además de la simpleza de implementación, Smalleditor cuenta con un corrector ortográfico (en inglés) aunque estimo que debe ser bastante simple configurarlo en otro idioma con un correspondiente diccionario.

Smalleditor

Descargar Smalleditor | Ver Demo | Más Información

También posee una función de auto guardado que al aparecer en la pantalla cada 10 segundos, puede resultar bastante molesto, por lo menos hasta que la lista sea lo suficientemente larga como para dejar de moverse. Quizás entre la documentación disponible puedan encontrar la forma de espaciar el guardado automático o quizás que pueda ocultarse el salto de texto de alguna forma como para que la vista no sea afectada. Hay una solución práctica que quizás no es lo más recomendable, pero si utilizan una resolución más pequeña o afinan la ventana del explorador, esa lista se coloca debajo de nuestro texto, dejándonos la vista liberada.

Por último, y no menos importante, el sistema cuenta con la posibilidad de implementar tanto negritas como cursivas, para aquellas sentencias que necesiten ser destacadas de alguna forma.

Habiendo utilizado Ommwriter durante muchos años, tiendo a mirar con cierta simpatía este tipo de recursos, ya sea porque para implementarlo en un sitio cualquiera en el que los usuarios puedan escribir lo que desean o para uso personal, el hecho de no tener ninguna interrupción ni ruido visual mientras escribimos, suele ser la mejor y más eficaz forma de hacerlo.

Gamas de colores en películas famosas

Isabel

Todos por aquí amamos el cine y sin dudas es un arte que la mayoría tiene en común. Con mayor o menor fanatismo el cine es parte de nuestras vidas. Están quienes ven nuevos títulos casi a diario y quienes quizás solo lo hacen en el cine cada tanto pero es díficil encontrar alguien que no disfrute en algún sentido del maravilloso séptimo arte.

Gamas de colores en películas famosas

The Color of Motion une este amor al que nos generan los colores y la forma en la que cada película es creada. La idea fue de Charlie Clark, quien armó el sitio de forma tal que se vayan sumando los colores de cada escena dentro de un film. Básicamente lo que veremos es el color predominante en cada frame de la historia, incluyendo presentación y títulos.

Ingresando ya veremos una grilla flat con los títulos disponibles que se actualiza periódicamente. Buscaremos un nombre que nos llame la atención o quizás sea nuestra película preferida y si entramos veremos sus colores sobre una barra inferior con la cual trabajaremos.

Gamas de colores en películas famosas

Allí el primer símbolo a ver es un “+” que nos dará información de la película incluyendo director, año de estreno, género y duración. Junto a esto se ven iconos de Twitter y Facebook para compartir su paleta de colores.

Siguiendo se ve el título y el número de cuadro que corresponde al color en el cual estamos situados, al igual que el tiempo correspondiente. ¿Nos gusta tanto este tono como para tenerlo en cuenta en un nuevo proyecto? podemos acceder a su valor hexadecimal para guardarlo sin problemas.

Gamas de colores en películas famosas

Otro punto entretenido es que existen tres formas de acceder a los colores y recorrerlos. La que veremos por defecto es la lineal, mostrando horizontalmente cada escena representada en un color. Sin embargo podemos cambiar esta vista a una cuadrícula o a la escena puntual, donde veremos una captura de pantalla con la misma y su color principal de fondo. A esta última opción también se puede ingresar desde cualquier formato cuando hagamos click en un tono ya que será ampliado para explicar visualmente de qué momento de la cinta fue tomado. Incluso podemos ir recorriendo de a una escena si así lo deseamos.

Hasta el momento hay 35 películas completas que incluyen títulos muy reconocidos aunque por suerte podemos enviar nuestra sugerencia y como les decía es actualizado cada tanto sumando una selección de ellas ya que no debe ser sencillo de generar el resultado final.

Gran sitio de inspiración para amantes y no amantes del cine que enfoca su contenido de una manera original y realmente vistosa.

Web: The Colors Of Motion

Objetos radio y checkbox personalizados y animados con jQuery

Pablo

CheckBo es un bonito plugin jQuery para personalizar fácilmente los objetos checkbox y radio. A diferencia de otros plugins similares este proyecto cuenta con algunas virtudes que lo destacan.

Compatibilidad con los distintos navegadores, sin lugar a duda el talón de Aquiles de la mayoría de estas iniciativas, en este punto CheckBo se hace fuerte, es compatible con prácticamente todos los navegadores, incluso aquellos más antiguos.

El proyecto brinda soporte para Google Chrome, Firefox, Safari, Opera e Internet Explorer desde su versión 8.

Otro aspecto interesante de este recurso es su compatibilidad con dispositivos móviles, esta compatibilidad no solo se encuentra relacionada con su aspecto visual, sino también con sus funcionalidades, CheckBo reconoce perfectamente los dispositivos táctiles, algo que agradecerán mucho las personas que nos visitan desde teléfonos y tablets.

checkbox y radio animados

El plugin es muy liviano, tiene como dependencia única al framework jQuery, lo que significa que no recargaremos innecesariamente nuestro proyecto con bibliotecas innecesarias.

Por defecto este proyecto contempla tres tamaños básicos, pequeño, mediano y grande, esto se puede modificar fácilmente desde las hojas de estilo.

En cuanto a su implementación, es para destacar que este proyecto no requiere de clases ni atributos personalizados para funcionar, aspecto importante si lo que buscamos es no modificar la estructura de nuestro proyecto.

CheckBo acepta perfectamente funciones básicas del tipo toggle, facilitando su instalación en formularios complejos.

Usar este proyecto no requiere mas que una linea de código:

$('ANY').checkBo();

Obviamente no hay que olvidarse de incluir la hojas de estilo y el archivo JavaScript en nuestro sitio.

En el sitio del proyecto van a encontrar muchos ejemplos y código para sacarle todo el provecho a esta iniciativa.

CheckBo es un proyecto liberado bajo licencia MIT, garantizando su libre utilización.

No te tomes tan en serio las redes sociales

Pablo

Las personas sobreestimamos la importancia que le dan otras personas a nuestras vidas. Las redes sociales, mejor dicho, su utilización es un claro ejemplo de ello.

No digo que todas las personas lo hagan, pero muchos de los usuarios, por no decir la mayoría cree que existe una horda de fanáticos pendientes de cada actualización de estado, cada imagen, cada video, eso es una mentira y peligrosa.

Recién cuando leía No grabes el momento, vivilo, recordé como en las redes sociales se “viven” los recitales, como cuando una persona asiste a algún evento llena su timeline de fotos, comentarios, vídeos y cualquier tipo de material sobre el evento, olvidando en gran medida de simplemente vivirlo.

Las personas están dejando de vivir en el afán de crear una realidad o personaje virtual, si algo te impacta, simplemente te deja absorto, es imposible siquiera pensar en tomar una fotografía, mucho menos sacar el teléfono, abrir instagram, hacer foco, buscar el mejor efecto que haga lucir mejor la fotografía, agregar un comentario y finalmente enviarlo a alguna red social, ¡es imposible hacer las dos cosas!

Si sos de esas personas que a cada paso una actualización te diría que te replantees lo que haces, no porque te lo diga yo, sino porque creo que te estas perdiendo de algo fundamental en el camino, de vivir.

Existe otra realidad, al menos para mi, y es que la gran mayoría de las personas que sigues o te siguen, les importa poco, muy poco o nada tu vida, no es que sean malas personas, pero alguien honestamente cree que si tienes 500 seguidores en Twitter a todos les importe realmente si tu hijo aprendió a leer, si te cortaste un dedo pelando papas, si tu vuelo esta retrasado. ¿Honestamente alguien puede decir que estos temas son importantes para personas que no nos conocen personalmente?

No considero que sean malas personas las que deciden que mi vida no les importa, me parece natural y lógico. En nuestra vida muy pocas personas realmente están interesadas en ese tipo de cosas, son las más cercanas a nosotros, familiares, amigos, etc. Creer que nuestra vida es interesante para el resto de la humanidad es una tremenda mentira que algunas personas deciden creer.

A veces me resulta gracioso pensar en los twistar cuando publican una nueva actualización, creo que ellos en su cabeza se creen así:

twistar

Cuando en realidad son así:

genial south park

Asusta que existan personas así.

Cuando crees que tenes fanáticos incondicionales, cuando pensas que las personas que te leen mueren por saber que estas haciendo en este preciso instante es cuando caes en la trampa de las redes sociales.

La entrada de Guillermo (No grabes el momento, vivilo) me recordó una de las mejores, sino la mejor escena de la película La vida secreta de Walter Mitty.

pantera

La escena transcurre en el Himalaya, en este lugar se encuentran Walter Mitty (Ben Stiller) y el fotógrafo Sean O’Connell (Sean Penn), que intenta fotografiar el leopardo de las nieves, tarea extremadamente complicada, en el momento que estos dos actores se encuentran y comienzan una conversación, camuflados en la montaña, a la distancia Sean Penn logra visualizar al felino en una posición ideal para lograr la captura, sin embargo no lo hace.

Walter Mitty le pregunta, ¿Cuándo la vas a tomar?

y Sean O’Connell le responde:

A veces no lo hago.
Si me gusta un momento, a mí…
…en lo personal…
…no me gusta distraerme con la cámara.
Me gusta solo estar…
…en él.

No me malinterpreten, me gustan las redes sociales, son geniales para recibir información, divertirse, entrar en contacto con gente nueva, hasta hacer amigos nuevos, pero todo sin tomármelo demasiado en serio.

Comentarios 3

Extensión de Chrome para medir elementos

Isabel

Cada tanto se ven pequeñas herramientas que lejos en realidad de ser pequeñas ayudan mucho en el proceso de desarrollo. Este es el caso de Dimensions, una extensión creada en Alemania completamente gratuita que nos ayudará desde Chrome a medir cualquier tipo de elemento que veamos en pantalla.

Existen muchas alternativas que realizan esta tarea con objetos puntuales pero lo genial de este caso es que se puede medir también la distancia entre imagenes, botones, campos de texto, videos, presentaciones, iconos, texto o lo que sea, absolutamente todo entra en medida si asi lo deseamos.

Extensión de Chrome para medir elementos

Por otro lado, puede ser útil cuando nos envían por ejemplo mockups en formato de imagen. Los llevamos a Chrome y gracias a esta aplicación podremos revisar sus tamaños tranquilamente.

Los ejemplos son miles pero quienes diseñen, trabajen con diseños o desarrollen conocerán la importancia de tener a mano algo que nos permita realizar estos procesos. Muchas veces las medidas deben ser exactas ya que solo un poco mas generará un problema en el resultado final. Por otro lado, poder chequear si lo que nos enviaron cumple con lo pedido ahorrará no solo tiempo para ambas partes sino también trabajo a futuro.

Para utilizar Dimensions solo deben instalar el agregado para Chrome desde el enlace inferior y permitir su instalación. Una vez sumado a nuestro navegador, se lo activará manualmente mediante el icono o bien podemos configurar un atajo de teclado para hacerlo de manera mas rápida. ¿Cómo? simplemente vamos  a la lista de extensiones y allí veremos la  opción.

De momento no está disponible para otras plataformas pero como bien aclaran sus creadores se trata de un proyecto open source basado en Github que puede ser adaptado sin problemas según la necesidad de cada uno.

Para conocer mas datos sobre el funcionamiento puede verse en el sitio de la demostración fácilmente lo genial que trabaja. Si ingresan notarán que en la parte superior se ve la cabecera con diferentes elementos de ejemplo sobre un fondo blanco. Solo basta con que muevan el puntero hacia allí y si recorren lentamente notarán que se les irá informando de las distancias y medidas de cada objeto.

Web: Dimensions

Hola: plantilla gratuita para email en HTML y PSD

Tamara

Siempre que me encuentro con este tipo de recursos recuerdo que muchos de nosotros pasamos por alto el hecho de armar una plantilla para nuestros emails, y quizás estas herramientas estén más enfocadas hacia aquellos que necesitan promocionar sus actividades comerciales o informar sobre eventos, cuestiones que tienen más que ver con la vida comercial o social que con el trabajo personal.

Aún a pesar de esto, considero que tomarse un tiempo para personalizar nuestros emails, puede ser una buena práctica. No solo para aquellos que reciben la información clara y bien organizada, sino para entender cómo funcionan los elementos que componen un email. Encontrarán que hay algunos clientes de correo que siguen utilizando las mismas metodologías que se usaban hace una década atrás, pero al mismo tiempo, ese mecanismo nos asegura que todo aquello que necesitamos que se vea, se despliegue adecuadamente sin faltantes.

Hola: email HTML template

Descargar Hola Email HTML Template | PixelBuddha

Claro que ante eso siempre pueden recurrir a una versión html alojada en su servidor, pero eso es para quienes no puedan visualizar las cosas correctamente, que en caso de emails personalizados, que no forman parte de una lista genérica, suelen ser los menos. Claro que hay cosas que no se pueden prever, como por ejemplo que quienes reciben el correo lo lean en texto sin formato, pero eso nos excede y forma parte de la decisión de cada uno. En esos casos, es suficiente con que la información contenida sea adecuada y bien recibida.

Esta plantilla proporciona un espacio ideal para aquellos que necesiten transmitir no solo información relativa a su actividad particular, sino que también se puede utilizar para comunicar un cronograma de actividades (en lugar de la historia cronológica que aparece en la plantilla).

Un diseño adaptable, muy simple y fácil de personalizar con sus datos, y mi recomendación sería que la implementen utilizando una versión HTML en el servidor ya que eso ayuda a que todo se comunique correctamente.