Hoy en día los usuarios son (somos) mucho más exigentes. No nos conformamos con que un producto satisfaga una necesidad o solucione un problema, sino que tiene que ser amigable y sencillo de utilizar, además de generar una sensación positiva (provocar una respuesta emocional positiva). Y si del primer punto se encarga la ingeniería de la usabilidad, del segundo lo hace el diseño emocional, uno de cuyos mayores exponentes es la Ingeniería Kansei (KES, o Kansei Engineering System).

[Pulsa para continuar]

Etiquetas: diseño, ingenieria, kansei

El Royal Mail inglés ha lanzado una serie de 10 sellos que conmemoran los mayores éxitos del diseño industrial inglés del siglo XX. Sellos que incluyen desde el mini al concorde, pasando por la típica cabina de teléfonos londinense.

Y tú, ¿Qué propondrías para una hipotética serie de sellos de grandes éxitos españoles?

Vía

Etiquetas: diseño

“Design, Coding” de The SEO Rapper es una fantástica canción que usa la rima para explicar los principios fundamentales del diseño web: uso de estándares, usabilidad, análisis y diseño, etc.

Os recomiendo echarle un vistazo, porque es pegadiza y la letra, muy cierta. Aquí tenéis el vídeo, y a continuación tenéis la letra en inglés y una traducción rápida al castellano, para los interesados:

[Pulsa para continuar]

Etiquetas: diseño, geek, programacion, web

Este es uno de los puntos menos amigables para el usuario que se pueden encontrar en una web. Cuando un usuario no sabe qué es un feed, ver código XML al abrir un archivo puede resultar muy desconcertante.

Por eso es obligatorio transformar el feed en una salida que muestre información sobre qué es ese archivo y cómo utilizarlo. Feedburner ofrece este servicio, pero estamos limitados a las salidas que ellos nos proponen. Nosotros vamos a ver cómo utilizar XSLT y CSS para crear el documento que queramos. Podéis ver un ejemplo en el feed RSS2 de Mundo geek.

XSLT (eXtensible Stylesheet Language Transformations) es un lenguaje de la W3C que permite transformar documentos XML en otros formatos, por ejemplo HTML. XSLT funciona a base de plantillas, de la forma:

<xsl:template match="foo">
R1
R2
R3...
</xsl:template>


Las reglas R1-R3 se aplican cuando en el documento XML original se encuentre una etiqueta foo. Estas reglas podrían ser, por ejemplo, mostrar un cierto texto, el contenido de la etiqueta, uno de sus atributos, aplicar otra plantilla, etc. Podéis ver un ejemplo en el documento XSLT que he utilizado para transformar el feed RSS2.

Para asociar un documento XML a un documento XSL, y que por lo tanto se muestre la salida especificada con XSLT al abrir el XML, tenemos que añadir una línea indicando dónde encontrar el XSL asociado:

<?xml-stylesheet href="xslt-rss2.xsl" type="text/xsl"?>

En el caso de Wordpress abrimos el archivo wp-rss2.php y añadimos la línea:

<?php echo '<?xml-stylesheet href="xslt-rss2.xsl" type="text/xsl"?>'; ?>

después de

<?php echo '<?xml version="1.0" encoding="'.get_settings('blog_charset').'"?'.'>'; ?>

De esta forma hemos indicado que cuando se abra el feed RSS2 de la web se apliquen las transformaciones de xslt-rss2.xsl que se encuentra en el mismo directorio que wp-rss2.php. No tiene ningún misterio.

Podeis utilizar mi archivo XSL o bien modificarlo para que se ajuste a vuestras necesidades, la mayor parte de él es simple código HTML. Simplemente descargarlo y subirlo al directorio en el que se encuentre el feed (el directorio raíz en Wordpress). Lo que si deberíais tener en cuenta es que en el XSL, al crear el documento HTML, se incluye una hoja de estilo CSS en la línea 13:

<link rel="stylesheet" type="text/css" href="/wp-content/themes/fscreenmg/style.css" />

Modificadlo para que apunte a la hoja de estilo que queráis utilizar y voilà!.

Etiquetas: bitacora, css, diseño, diseño web, feeds, web, xml, xsl, xslt