Todo lo que tu página web necesita

Relojes HTML para tu web de todo tipo – Gratis

Reloj para blog o web
El mejor creador web

¿Que tal, como estas?, hoy me gustaria solventar la pregunta que me han hecho varios, sobre como insertar un reloj HTML en una página web, ya sea estatica o dinamica.

Pues es un proceso muy sencillo que a continuación explicare de forma clara, la verdad es que se trata de un par de minutos en tiempo. A dia de hoy cuestiones como estas dentro el desarrollo web dejan de tener la etiqueta de “complicado”.

Tan solo hace falta mirar todos los widgets/plugins HTML como estos  que existen y que nos resuelven infinidad de problematicas.

¿De que tipo de reloj HTML estamos hablando?

Con este articulo me gustaria abarcar todo lo que se te venga a la cabeza, ya sea un reloj estandar, un countdown o un cronometro.

Interare poner todas las opciones de herramientas posibles, otorgando una opinion tambien de cada una. Y como haz de saber no importa con que programa este creada tu sitio web, son widgets universales.

Si crees que esta información es util, por favor comparte el post.

¿Como puede servirte algo asi en tu web hoy?

Actulamente las páginas pasan de ser documentos estaticos a a ser lugares bastante interactivos como las propias tiendas fisicas, creeme, no tiene nada de malo emplear este tipo de widget.

Si lo adaptas correctamente puedes crear una experiencia de usuario gratificante.

Se me ocurren unos ejemplos…

Que tal un reloj estandar mostrando la hora en el pais al que se va a viajar si se trata de una web turistica, o un countdown que anuncia el fin de una oferta, o talves un cronometro que dira cuanto tarda una persona en consumir un contenido.

MIra:  Gran Widget - Como Saber Quien Visita tu Web

Solo hace falta un poco de creatividad, para sacar provecho real de hasta este complemento que parece poco util.

Relojes HTML para stios web ¿De donde sacarlos?

He recopilado sitios en donde puedes obtener uno totalmente gratis, me ha costado un poco, pero bueno. Se que valdra la pena este contenido.

Formato estandar:

  • Diferencia Horaria

Ofrece un diseño muy atractivo. Tan solo hay que especificar el lugar en el que se medira la hora y finalmente copiar el código HTML que se muestra para insertarlo en tu sitio web.
Probar ahora

  • Time.is

Es un poco mas basico, pero igualmente funcional. Detecta tu ubicación automaticamente, aunque claro puedes elegir otro lugar utilizando el cuadro de busqueda.

Probar ahora

Formato countdown:

  • CountingDownTo

Esta herramienta permite crear una cuenta regresiva totalmente personalizable en cuanto a diseño y comportamiento, lo bueno es que esta en español y es facil de entender.

Visitar ahora
  • Time and Date

Cuenta con un diseño menos minimalista, aun si creo que es una de las opciones mas completas, pues su configuración es enorme, muy recomendable.

Visitar ahora
  • Tick Counter

Esta aplicación ofrece el tamaño que normalmente se usa. se trata de un countdown bastante grande, perfecto para una landing page, es muy configurable.

Visitar ahora

Formato toma de tiempo:

Esto requiere un poco mas de conocimientos en programación mas que nada en JavaScript, puesto que no hay herramientas que de manera visual te permitar crear un medidor de tiempo (cronometro segun mi pais y yo).

  • Cronometro by CodePen

See the Pen Cronometro con JavaScript by Romlonix (@Romlonix) on CodePen.

MIra:  ¡Estos son todos los widgets de Facebook HTML!

Un trabajo muy bueno el que ha hecho el usuario “Romionix”, tiene los botones ideales y el estilo perfecto de un stoptwatch. Ademas ver su código fuente es super agradable gracias a “CodePen”.

  • Contador de tiempo by TheCodePlayer

Instalar ahora

Otra opción realmente fantastica. TheCodePlayer te presenta de una manera muy interactiva el funcionamiento de un cronometro html para que puedas programarlo tu mismo/a solo con CSS3.

  • Reloj contador by GitHub

Instalar ahora

Tambien puedes ocupar este trabajo de la plataforma GitHub, el cual te muestra lo necesario para armar un buen stopwatch, aunque con unos estilos un poco desfasados.

  • Cronometro by OSTraining

Instalar ahora

El equipo de OSTraining desarrollo un widget de este tipo, que la verdad luce y funcione muy bien y explica su realización detalladamente en un tutorial. Aunque como la mayoria esta en ingles, se puede traducir de volada.

Algunos plugins de reloj exclusivos para un CMS

Me he dado a la tarea de incluir tambien aquellos complementos realizados especialmente para algun sistema de desarrollo web. Con el tiempo, añadire mas.

Para WordPress:

Un plugin que ofrece diseños espectaculares a comparación de la gran mayoria. Ofrece un manejo sencillo, mediante shortcodes.

Proporciona una configuración muy completa. Ademas esta optimizado adecuadamete por lo que no genera inconveniente alguno.

Un complemento que luce bien, pero que ya no recibe soporte por parte de sus desarrolladores. Aun asi, se le puede dar un increible uso.

Para Wix:

Desarrollado por la propia plataforma, tiene todo lo necesario para añadir a una web cuentas regresivas y configurar su aspecto y comportamiento.

MIra:  Los mejores gadgets para decorar tu web en la Navidad

Para Joomla:

Aunque esta muy completo no es de pago como suelen ser los buenos plugins en Joomla y ofrece un soporte de actualizaciones genial.

Otra opción gratuita, pero como pocos complementos de este tipo proporciona diseños muy modernos y adaptables al de nuestro sitio.

Para Weebly:

Talves es el unico exclusivo, pero son mas que suficiente sus muchas opciones de estilos y comportamiento. Es un buen trabajo.

Para Shopify:

Aunque es de pago, si que es de calidad premium. Es un robusto gadget, lleno de posibilidades. Ofrece algunas funciones unicas.

Especial para las tiendas online, en el punto de compra. Este tipo de widget es usado hasta por sitios de comercio mas grandes del mundo.

Segun las valoraciones de los usuarios es catalogado el mejor complemento de su tipo en la Shopify App Store. Es como pocos responsive.

Para Drupal:

Un proyecto creado por “Robloach”. Permite la creación de una cuenta regresiva basica pero eficaz utilizando la tecnologia jQuery.

Algo parecido al anterior, pero con diseños aun mas modernos y llamativos. Creado no hace mucho por el usuario Marcin Pajdzik.

Jimdo

Leave a Comment

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *