Artículos y tips sobre diseño web

CSS Display table: maquetación como tablas y solución para IE7

2018-08-29T08:58:27+00:0010/05/2013|Diseño web, HTML5|

Una de las cosas que todos hemos hecho cuando empezábamos a curiosear con la maquetación web es usar tablas por todos lados, algo desaconsejado. Pero naturalmente es tan cómodo: Quiero algo a dos columnas, pues dos celdas; tengo alineación vertical del contenido; ajuste del ancho según contenido; puedo hacer que una celda ocupe varias [...]

URLs amigables: evitar bromas con los slugs

2018-08-29T08:58:49+00:0007/05/2013|Diseño web, SEO|

En el mundo del SEO una de las normas de optimización de webs es poner palabras clave en las URL dinámicas, como añadido, o a ser posible con re-escritura. Es decir si tenemos un producto en la URL: tienda.es?producto=141 Se puede añadir un slug: tienda.es?producto=141&slug=rizador-de-pelo O mediante re-escritura (en Apache con el mod-rewrite): tienda.es/productos/141/rizador-de-pelo O mediante [...]

Twitter cards: metadatos para twitter

2018-08-29T09:00:49+00:0001/04/2013|Diseño web, SEO|

En el blog ya hemos hablado de open graph y su uso para facebook. Twitter tiene algo parecido, que son las Twitter cards. En los últimos meses Twitter ha añadido una opción por la que si un tweet lleva enlazada una imagen o un vídeo podemos abrir el tweet directamente para ver la imagen o vídeo [...]

Botones para compartir en Facebook y Twitter

2018-08-29T09:04:32+00:0012/03/2013|Diseño web|

Hay muchas herramientas que nos dejan incrustar en nuestra página botones de compartir para decenas de páginas. Pero si queremos hacer unos botones personalizados, vamos a mostrar una forma sencilla de hacerlo para facebook y twitter. Ejemplo sencillo: Compartir este blog en Facebook Compartir este blog en Twitter!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");        Facebook Es tan sencillo como poner un [...]

Canvas HTML5: texto con fillText y strokeText

2018-08-29T09:06:30+00:0019/02/2013|Diseño web, HTML5|

Volvemos a hablar del elemento canvas de HTML5, al que ya hemos dedicado varias entradas. Ya hemos visto como dibujar figuras sencillas, hacer animaciones y transformaciones a estas figuras y cómo decidir la forma en que se calculan los espacios donde se junta más de un elemento de dibujo. En esta entrada vamos a hablar de [...]

Atributo HTML5 download.

2018-08-29T09:07:34+00:0015/01/2013|Diseño web, HTML5|

Algo que pasa frecuentemente en Internet es que tengamos un enlace a un fichero que debería descargarse, y el navegador nos lo abra. Ocurre mucho al intentar descargar una librería javascript o al intentar descargar un pdf. El usuario puede elegir este funcionamiento en la (más o menos farragosa) configuración del navegador. Pero hay veces en [...]

Canvas HTML5: Intersecciones (globalCompositeOperation)

2018-08-29T09:13:43+00:0004/12/2012|Diseño web, HTML5|

Una vez que hemos visto como hacer animaciones sencillas con el elemento canvas, vamos a volver a las propiedades de dibujo que nos ofrece. En esta entrada vamos a ver cómo podemos elegir la operación de intersección entre objetos. Es un valor global del contexto así que afectará a las operaciones de intersección siguientes, por lo [...]

Canvas HTML5: animaciones II: setAnimationRequest

2018-08-29T09:14:57+00:0031/10/2012|Diseño web, HTML5|

En la última entrada sobre animación en el canvas veíamos cómo hacer una animación usando setTimeout. Es un método poco eficiente, y en el que tenemos que elegir a priori el espaciado entre cada paso de la animación. Se ha añadido en HTML5 un método javascript que se encarga automáticamente de llamar a un método que [...]

Canvas HTML5: animaciones I

2018-08-29T09:15:20+00:0016/10/2012|Diseño web, HTML5|

En el artículo anterior vimos como usar el canvas para dibujar figuras sencillas. Se pueden hacer dibujos mucho más complejos, pero la gran utilidad del canvas es hacer animaciones, así que vamos a ver las bases de la animación en canvas. Necesitamos una función de pintado que se llame sucesivamente para ir pintando cada frame de [...]

Centro de preferencias de privacidad

Estrictamente necesarias

Cookies necesarias para el correcto funcionamiento de nuestra web. Por ejemplo, necesitamos que unas cookies estrictamente necesarias estén habilitadas con el objetivo de guardar tus preferencias sobre el uso de cookies. Si deshabilitas esta cookie, no podremos guardar tus preferencias. Esto quiere decir que cada vez que visites nuestra web, tendrás que volver a habilitar o deshabilitar las cookies otra vez.

wordpress_test_cookie, Wp-settings-time-1, wp-settings-1, gdpr, 1P_JAR

AdvertisingEstadísticas y análisis

Cookies de análisis de terceros. Estas cookies son generadas por Google Analytics. Google almacena la informacion recogida por las cookies en servidores ubicados en Estados Unidos, cumpliendo con la legislación Europea en cuanto a protección de datos personales y se compromete a no compartirla con terceros, excepto cuando la ley le obligue a ello o sea necesario para el funcionamiento del sistema. Google no asocia su direccion IP con ninguna otra información que tenga.

_ga, _gid, _gat

Analytics

Other