129 lecturas 0 comentarios

Think with Google

¿Sabías que mejorar la carga de tu web en 0.1 segundos puede resultar en un incremento de la tasa de conversión del 0.8%?, ¿o que las páginas que tardan más de 3 segundos en cargar tienen una tasa de rebote 4 veces mayor?, ¿o que un retardo de un segundo en los tiempos de carga puede reducir las tasas de conversión un 20%?

La velocidad de carga de tu sitio es un factor importantísimo, tanto para el posicionamiento como para la experiencia de usuario. Si quieres empezar a optimizarla, pásate por la herramienta de Google «Think With Google» y consigue un análisis pormenorizado de aquellos parámetros que puedes mejorar, así como el tiempo y la valoración del tiempo de carga de tu web.

282 lecturas 0 comentarios

Código optimizado de búsqueda para WordPress

Si usas Post personalizados (custom type post o CTP), en WordPress, te habrás dado cuenta de que los buscadores (tanto el de administración como el de usuarios) no entran en los campos ni en los Post que hayas creado. Para solucionarlo, os traigo un código que buscará en todos ellos. Añade el siguiente código al archivo functions.php de vuestro tema:

(más…)
507 lecturas 0 comentarios

Gráficas en CSS puro

Si queréis mostrar gráficas en vuestra web, sin usar Javascript (JS) ni recargar el sitio con más código del necesario, Chart CSS es vuestra solución. Un montón de estilos, para todas las variantes (barras, columnas, líneas, pastel, etc.), personalizables, responsive y en solo 6KB de CSS.

1.150 lecturas 0 comentarios

¿El Tooltip más completo?

Si queremos mostrar sugerencias de un elemento en nuestra web, lo mejor es recurrir a globos emergentes de información, lo que -comúnmente- llamamos un Tooltip. Existen numerosos códigos (scripts) para integrar dicha funcionalidad en nuestro sitio. Este me ha gustado especialmente, muchísimas funcionalidades, rápido de cargar, con temas… ¡Creo que no le falta de nada!

Visitar web oficial Tippy.js

1.405 lecturas 0 comentarios

Generador de gradientes

¡Los gradientes están de moda! y, en muchas ocasiones, nos resulta complicado escoger los más adecuados para crear una transición agradable y atractiva. Con esta utilidad se acabaron los problemas: selecciona un color y generará un degradado perfecto. Si -además- quieres aplicarlo en tu web, puedes obtener el código CSS con un solo clic.

1.131 lecturas 0 comentarios

Gráficas dinámicas en Javascript

Chart JS es una forma simple y flexible de añadir gráficas a tu página web. Gracias a canvas y javascript, podrás insertar todo tipo de diseños. Rápido, gratis, responsive y cuenta con animaciones. No se puede pedir más. Échale un ojo a las demos, si todavía no estás convencido.

1.270 lecturas 0 comentarios

Gradientes originales en CSS

No sé si la nueva moda de los gradientes la puso en marcha el rediseño del logotipo de Instagram, o el de los iconos de iOS, pero lo que está claro es que los degradados vuelven a estar en boca -y en pantalla- de todos. En esta ocasión, tenemos la oportunidad de explorar infinitas posibilidades de ellos gracias a la galería de Gradient Magic y, lo que es mejor, descargar su código en CSS para usarlo en el diseño de nuestra web. Por supuesto, si no os gusta ninguno, podéis crear el vuestro a medida.

1.082 lecturas 0 comentarios

CSS asíncrono. Rápido y fácil

A diferencia del código Javascript, que tiene atributos que permiten cargarlo de forma asíncrona, en CSS no existía nada parecido hasta la fecha. Ahora, con un pequeño truco, vamos a solventar este inconveniente. Para cargar CSS, de manera asíncrona y sin demorar el render de la página, utilizaremos el atributo onload. Aquí os dejo cómo tendríais que enlazar el archivo CSS:

<link rel="stylesheet" href="/mi_css.css" media="print" onload="this.media='all'">
1.488 lecturas 0 comentarios

Chuleta Grid CSS

Recordar todo el código relativo a las estructuras Grid en CSS puede ser un poco tedioso: contenedores, justificar, jerarquías… pero en esta web: grid.malven.co, tenemos la posibilidad de acceder rápida y fácilmente a todos ellos, con ejemplos ilustrativos.