Con la aparente decisión de que el nuevo estándar a ser adoptado por la comunidad desarrolladora web será HTML 5, existen ansias de disfrutar luego todas su bondades, aunque siento aún lejano su total uso dado lo lento que suele ser por parte de los usuarios la actualización de sus navegadores a uno más moderno y que soporte estas nuevas especificaciones, que ya han ido apareciendo. Pero eso no quita que desde ya comencemos a jugar un poco con él. Ya he comentado sobre las [características de este nuevo estándar][1], y en este momento nos concentraremos en una maqueta funcional utilizando las nuevas etiquetas y sus nuevas posibilidades. Es interesante saber que podemos utilizar elementos de HTML 5 en estos momentos aunque la mayoría de los browsers aún no lo soporten; esto se debe a que CSS puede dar estilo a cualquier etiqueta, aunque ésta prácticamente no exista (aún). Por ejemplo, si me da la gana puedo inventar una etiqueta propia y darle estilos:

Este 2009 ha sido un año lleno de transiciones: llega IE8 pero aún persiste el fantasma de IE6; finalmente se ve un futuro más nítido con HTML5 y CSS3, pero persisten las limitaciones del soporte por parte de los fabricantes de browsers. Precisamente en ese purgatorio en que nos encontramos actualmente es cuando debemos ser más hábiles sobre qué, cómo y cuando utilizamos las herramientas que más nos acomoden. Personalmente y como he comentado anteriormente, he comenzado a utilizar propiedades CSS3 que me hacen utilizar menos tiempo y recursos en lograr los mismos efectos que antes me limitaba; me refiero a text-shadow, border-radius, [opacity][2] y [rgba()][3] entre otros. Si utilizas un browser moderno, los podrás apreciar sin problemas; caso contrario, de igual manera se desplegará la información pero la experiencia no será la misma – lo que se denomina como graceful degradation ó, a falta de una traducción literal, degradación elegante-. Tengo la fortuna de trabajar con clientes y colegas que comparten esta forma de trabajar, siempre mirando hacia adelante y no frenándose debido a limitaciones ajenas a nuestro poder. Desarrollar pensando en 3 versiones de browser de una misma empresa, cada uno menos peor que el otro, es un problema grave. En este artículo, quiero compartir mi experiencia sobre cómo lograr los menos problemas posibles, creando un layout que se vea de manera similar en la mayoría de los navegadores disponibles en el mercado. Básicamente enunciaré algunos consejos prácticos que por mi experiencia ayudan en esta ardua tarea:

#31 – 28 Agosto 2009 Todos revisados y publicados a través de [tus propias recomendaciones][1]. [1]: http://www.csslab.cl/envia-tu-sitio/ ““Envía tu Sitio” en CSSLab”

Se puede definir a la simplicidad como ‘la ausencia de elementos innecesarios‘, ó ‘la esencia misma del elemento‘ lo que es complicado de leer y más difícil aún de lograr. Simplicidad no es aburrimiento, no es vacío, no es tener mucho espacio blanco; siquiera es un estilo de arte (no confundir con minimalismo, que también es un término mal manipulado). Simplicidad es una perspectiva de diseño y de información, un acercamiento que a menudo crea productos más usables y atractivos. Es casi imposible crear una interfaz que encaje con todos los usuarios; pero aún así, es importante entregarles una variedad de opciones que les permita ejecutarlas mismas tareas de diferentes maneras, y de la que más le acomode. Después de todo, nuestra misión es no hacerle perder su tiempo con nuestros errores. Y ¿cómo se comporta un usuario? No tengo una respuesta a esto; son muchas las variantes. Cada usuario es particular e impredecible en su comportamiento frente a un monitor, pero sí existen similitudes en lo que esperan cuando se les presenta una interfaz web:

Your flexible fixed layout / Tu estructura fija, flexible

Me he asombrado como, en los últimos 2 años, ha avanzado la conciencia colectiva en que es necesario progresar hacia una mejor web, y no quedarse estancados por culpa de un browser. Internet Explorer 6 ha sido realmente una limitación en todos los ámbitos: limita la creatividad tanto del diseñador, como del desarrollador de sitios web. ha sido frustrante escuchar (y decir) frases como:

Ponerse en el lugar del usuario; es un principio básico que deberíamos adquirir si queremos que nuestro proyecto web tenga éxito no sólo para nuestros bolsillos, sino que perdure y tenga pregnancia en la [experiencia del usuario][1]. ¿Qué marcaría una diferencia? El diseño, obviamente es lo primero que encanta; contenido bien estructurado y ordenado, pensado hacia una mejor buscabilidad y encontrabilidad; funcionalidades útiles y no sólo efectistas, también. Pero insisto, ¿cómo lo llevamos aún más allá?

#30 – 01 Junio 2009

Una nueva manera de mostrar más información / A new way to show more info Selecciona tu idioma / Select your language: Español English

Como muchos deben ya saber, es un tremendo lío alinear verticalmente un elemento HTML mediante CSS estándar; de hecho una de las razones de que aún personas siguen utilizando tablas para estructurar sitios: precisamente porque las celdas hacen este alineado horizontal y vertical tan fácil, mediante los atributos align="" y valign="". Pero utilizando web standards es otra cosa, una dimensión aún perturbante y siendo franco, algo complicada de entender y llevar a la práctica.