XHTML

Un interesante post escrito en Bite Size Standards, comenta un detalle sobre el atributo “size” que llamó mi atención. Como saben, el atributo “size” es usado para determinar el tamaño de diferentes etiquetas html, como por ejemplo, la etiqueta <input>.

<input type="text" id="user" name="user" size="15" />

<input> es la etiqueta utilizada para la creación de formularios html. Dependiendo del tipo (“type”) asignado, podemos crear un campo de texto (type=“text”) ó un botón (type=“botton”). Por ejemplo, en nuestro buscador de la izquierda, usamos una imagen como botón (type="image").

Entonces, con el atributo “size” podemos determinar la longitud de un campo de texto en el formulario. Sin embargo, hay muchos usuarios que prefieren no usarla por la poca flexibilidad que ofrece, por ejemplo cuando se usan diferentes hojas de estilos, en los layouts el input mantendría un ancho fijo.

El tip que comentan (aún no recomendado) se refiere al uso de CSS3, para modificar la longitud del campo de texto. La pseudo clase no es soportada por IE:

input[type="text"]:not([size]) {
width: 15em;
}

Maborak acaba de publicar sencillo y muy bien explicado tutorial sobre como utilizar iframes con Ajax. Si deseas incrementar tus conocimientos con lo nuevo del desarrollo web, no lo puedes dejar de leer.

Tutorial: Remote Scripting con iframes

Después de haber visto como diseñar un formulario de identificación, veamos ahora como darle vida a uno de registro, sin tablas, pero con unas pocas líneas de código css, y como siempre, muy fácil de personalizar.

La usabilidad es la medida de la facilidad de uso de un producto o servicio, típicamente una aplicación (software) o un aparato (hardware). Generalmente se define en términos de las necesidades de los usuarios, necesidades que frecuentemente entran en conflicto directo con las intenciones de los diseñadores.

Así pues, llenar los formularios a veces es una molestia. Respuestas "inválidas", opciones confusas, y entradas inaceptables constantemente nos ocasionan más trabajo. Y no es extraño que muchos internautas, simplemente abandonen una web cuando llenar su formulario es realmente una odisea.

En este artículo vemos algunos consejos claves para crear formularios más fáciles y agradables. Porque llenar un formulario no tiene que ser un suplicio para el visitante...

Un mapa de imagen es crear zonas activas en la imagen misma, de tal manera que cuando uno pasa el mouse sobre una parte de la imagen, podamos ver una reseña de lo que esta área muestra. Ver un ejemplo.

Como se logra esto? Para este ejemplo, transformando una lista de definición html <dt></dt> en el mapa visto, usando nada más que CSS.

Pero la idea no es limitarse solamente a esto, sino entender como funcionan.

Los mapas de imagen utilizan el pseudoelemento :hover para definir un estilo diferente para cada enlace al pasar el ratón por encima. De esta manera logramos que nuevas imágenes floten encima del fondo, siempre que el usuario mueva su ratón sobre una de las áreas de enlaces invisibles.

En este enlace hay un tutorial (en ingles) que explica como se crea el mapa, paso a paso.

En este otro enlace, uno en español, que también trata, de una manera muy detallada, el tema.

Como bien sabemos XHTML (EXtensible HyperText Markup Language) es la nueva generación de HTML, algunos la llaman la versión limpia o estricta de HTML...