487 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.

205 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'">
622 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.

626 lecturas 0 comentarios

Google reinventa el Captcha

Google acaba de anunciar reCaptcha v3. Respaldado por el ya tan de moda Machine Learning, nos prometen un sistema de validación transparente para el usuario. Si alguien se anima a probarlo, estaré encantado de leer su análisis y experiencia con el mismo.

Manual de integración

735 lecturas 0 comentarios

Cargando JS de terceros

Las imágenes y los códigos Java Script son los principales responsables del tiempo de carga de cualquier web (y más hoy en día). Así que, cuando queremos optimizar esta velocidad (un factor importante para el posicionamiento), revisar ambos puntos es una cuestión primordial. He encontrado un tutorial online, gratis y en inglés, sobre cómo hacerlo. Algo técnico, pero muy detallado.

Leer guía: Cargando JS de terceros

816 lecturas 0 comentarios

Plugin WordPress: WhatsApp Me

El otro día, navegando por Internet, me di de bruces con un plugin para WordPress de lo más interesante. Se trata de Whatsapp Me, una alternativa estupenda si queremos dar soporte de chat en nuestra página. Con solo configurar un teléfono móvil, y activando el plugin, nuestros visitantes verán un globo de Whatsapp con el que nos podrán abrir un chat en directo. De lo más práctico, ¿verdad? Pues -además- es gratis 🙂

Visitar página de descarga

2.618 lecturas 0 comentarios

Manual: Sistema Grid CSS

Últimamente estoy maquetando y he descubierto el sistema Grid de CSS. Me ha parecido tan maravilloso que me he sentido obligadísimo a compartirlo con vosotros. Os comentaría alguna de sus ventajas, fundamentos y peculiaridades, pero -la verdad- el manual que os disponéis a leer lo resume y explica todo con tal claridad que me lo reservo para que lo descubráis por vosotros mismos.

Si queréis maquetar como «Dios» manda, podéis empezar por aquí:

Manual online Grid – Maquetación CSS

2.330 lecturas 0 comentarios

Códigos de animación en CSS

Cada vez utilizamos menos Javascript para hacer animacionesCSS está conquistando, en este aspecto, más y más terreno. Las ventajas son evidentes: implica menos peso de descarga y mayor velocidad. Para aquellos que todavía no estéis familiarizados con las animaciones en CSS, no hay nada mejor que ver ejemplos prácticos de uso. En la siguiente página, disponéis de un extenso catálogo de casos: escalar, rotar, flips, slides, etc. y todos acompañados por su respectivo código CSS.

Visitar Animista: Ejemplos de animación en CSS

4.056 lecturas 2 comentarios

Copiar texto al portapapeles en una Web

clipboardSi hay un código que, más de una vez, me haya dado quebraderos de cabeza, ese ha sido el responsable de copiar textos al portapapeles desde la web. Para que no paséis por el mismo mal trago, os traigo Clipboard.JS, un archivo de 3kb y muy fácil de implementar.

• Descargar ClipBoard.js