Archivo de la categoría: Diseño y maquetación web

Internet está cambiando hacia la web 3.0 gracias a los microdatos

Si nos fijamos en los cambios que se producen en el mundo del HTML y la programación web, podemos apreciar como Internet está cambiando y los usuarios apenas nos damos cuenta.

La existencia de los microdatos permite una interpretación semántica del contenido mucho más acertada que anteriormente, basada únicamente en la interpretación contextual en base a los criterios que se encontraban en el texto.

Los microdatos son una modificación de la programación mediante la inserción de unas etiquetas que no suponen ninguna modificación para el usuario. Sin embargo si se modifica de cara a los buscadores. Concretamente hablamos de Schema.org, donde hace apenas unos días pudimos ver a Pedro Martinez y a Víctor Hernández de SEOCOM ofreciendo una charla sobre los Rich Snippets.

Sigue leyendo

Anuncios

Problemas con caracteres especiales en páginas web con PHP + MySQL. Codificaciones utf8 y ISO

Casi todos los desarrolladores web con cierta experiencia realizando páginas con PHP y MySQL (y me imagino que con otras tecnologías) han tenido que enfrentarse alguna vez con problemas con la codificación web. Es decir, que la página web no muestre correctamente los caracteres especiales: tildes, eñes, carácter “ç”, etcétera.

¿Cual es la solución a esto? La respuesta es compleja. Depende de muchas cosas. Puede que tengamos mal la configuración en el HTML, en el PHP, en la base de datos… hay que comprobar todo ello, paso por paso. O mejor dicho, no es que tengamos algo “mal”, es que en unas partes podemos tener la configuración establecida como codificación utf-8 y en otras como ISO. El resumen es que tenemos que conseguir que toda la configuración de la web esté en UTF-8. Y la manera de conseguirlo está muy bien explicada en este artículo del blog de Pedro Ventura.

Os animo a guardar estas instrucciones en favoritos, porque tarde o temprano, desarrollando una web, las necesitaréis.

Enlace al artículo:

CSS Tip: cómo centrar capas con float left

Problema:

Tenemos un div contenedor, que contiene varios div elemento. Y queremos que esos elementos estén centrados en el contenedor, pero a la vez, que aparezcan en la misma linea, horizontalmente.

Como queremos que esos elementos vayan colocándose juntos horizontalmente, debemos ponerles el atributo float con valor “left”.

Pero a su vez, queremos que esos elementos estén centrados en la capa que los contiene. ¿Cómo lo hacemos? Al “flotar” a la izquierda, no sirve que el div contenedor tenga “text-align:center” ni “margin:0 auto”, que es lo primero que se nos ocurre. Se van por defecto a la izquierda del div contenedor.

Además, los elementos van a variar de número. No podemos pensar sólo en cómo alinear 3 elementos, o los que sean. Pueden ser “n” elementos. Si no, también sería sencillo, dando un margen izquierdo al primer elemento, para separarlo y centrarlo manualmente.

Tampoco me sirve usar tablas. Es decir, puede valer, pero esto es un tip de CSS, no queremos usar tablas. Las tablas sólo se usan para mostrar datos.

Pasemos a la solución.

Sigue leyendo

Evitar spam en WordPress

Desde que abres un blog en WordPress y empiezas a publicar entradas, cada día te enfrentas a decenas de mensajes de spam (depende del volumen de entradas que tengas).

Harto de tener que eliminar varios mensajes de spam diarios, y perder el tiempo “separando” los comentarios válidos de la publicidad masiva, por fin me he decidido a usar algunos plugins para evitar el spam.

Sigue leyendo

Google Web Fonts: ampliando las tipografías web

Google Fonts

Google Fonts

Tradicionalmente, a la hora de crear páginas web, sólo podían utilizarse unas pocas tipografías genéricas que todos los navegadores leían bien. Si usábamos una tipografía no genérica, sólo la vería bien aquel usuario que la tuviese instalada en su ordenador; en caso contrario, se mostraría otra genérica que cambiaría el aspecto que se le quería dar.

La “colección” de tipografías genéricas es limitada, y suelen repetirse las mismas: Arial, Verdana, Georgia, Tahoma, Times New Roman, etc… ahora, gracias a (como no) Google, podemos ampliar esa colección con varias fuentes más.

Sigue leyendo

Hacks CSS para arreglar problemas de maquetación en Internet Explorer

Uno de los problemas que más horas hace perder a los maquetadores web, es el tema de visibilidad de las páginas web en Internet Explorer. La mayoría de los navegadores respetan los estándares W3C, es decir, muestran las páginas tal y como el maquetador quiere, siempre que se use código HTML (ó XHTML) y CSS correcto.

Sigue leyendo