Hacia un nuevo modelo para construir la web

Nota: El siguiente artículo fué publicado en la revista argentina USERS, en la edición #170. El contenido del mismo está bajo una licencia Reconocimiento-NoComercial-SinObraDerivada 2.0. Este artículo puede puede haber sido editado para la versión impresa de la revista con el fin de evitar localismos. Actualmente, se encuentra en proceso de revisión, se omitieron capturas de pantalla y recuadros informativos. Les aconsejo comprar la revista, o esperar a que el artículo esté disponible en la web de Tectimes para descargarlo en formato PDF.
XHTML, CSS, DOM; siglas muy populares en weblogs y que empiezan a resonar en portales y grandes sitios: Juntas forman lo que se conoce como Estándares Web. En esta nota, veremos de qué se trata este nuevo concepto que está revolucionando Internet y delineando la forma de desarrollo web del futuro.

Es 1997. Estamos en medio de una loca guerra de navegadores, una carrera sin límites en la cual Internet Explorer y Netscape Navigator compiten arduamente por dominar el creciente mercado de internautas.
En un movimiento poco inteligente por sacar ventaja a la competencia, y en un intento de brindar mas herramientas para mejorar e innovar la gráfica en los web sites de esa época, ambas compañías anuncian que ofrecerán características especiales a los desarrolladores web: Elementos HTML propietarios que sólo serán interpretados por un navegador u otro, exclusivamente, desobedeciendo así a cualquier intento de estandarización de código que existiera en la fecha.
Entonces empiezan a surgir sitios con textos en marquesina que en Internet Explorer andan perfectamente, pero que en Netscape Navigator no se ven. Al revisar el código HTML de un sitio vemos etiquetas <font> que parecen renderizarse bien en un navegador, pero que no se interpretan correctamente en el otro.
Y así comienza el caos, con una enredada trama de tags y elementos propietarios que se comportan de una manera determinada en el navegador para el cual fueron hechos, pero que no sirven en el otro.
Conclusión: La tarea del desarrollador web se hace compleja, laboriosa, y muchos se inclinan por el navegador que más elementos HTML “atractivos” le ofrece al desarrollar. El mercado se fragmenta, la web se fragmenta y la interoperabilidad entre diferentes tecnologías y navegadores desaparece.
Pero pasan los meses y nos vamos dando cuenta que esta manera de desarrollar la web no es la adecuada. Vemos que mantener 2 versiones de un sitio, una para cada navegador no es rentable. Que nuestros costos en desarrollo web aumentan a medida que queremos introducir mejoras en sitios con base poco firme y con código que es imposible de mantener.
Y aquí aparece el antídoto, la bala de plata que promete unificar la web, a través de un modelo abierto de conectividad entre tecnologías de desarrollo: Los estándares web.

¿Pero qué son los estándares web?

Básicamente son un conjunto de tecnologías, impulsadas por el World Wide Web Consortium (W3C) y otros organismos, que tratan sobre la manera en que se debe –o debería- crear el contenido basado en la web. El W3C (http://www.w3.org/) es el principal comité internacional que se encarga de reglamentarlos, a través de especificaciones, guías y recomendaciones, pero hay grupos en todo el mundo, como el Web Standards Project (http://www.webstandards.org/), que se encargan de promover y fomentar su uso.

Específicamente, los estándares web se pueden clasificar en 4 categorías, cada categoría agrupa una o más tecnologías de desarrollo:

  1. Lenguajes estructurales o contenido:
    • XHTML (Extensible Hypertext Markup Language)
    • XML (Extensible Markup Language)
  2. Lenguajes de presentación:
    • CSS (Cascading Style Sheets)
    • XSLT (Extensible Stylesheet Language Transformations)
    • SVG (Scalable Vector Graphics)
    • MathML (Mathematical Markup Language)
  3. Modelos de objetos:
    • DOM (Document Object Model)
  4. Lenguajes de scripting:
    • ECMAScript 262 (la versión estándar de JavaScript)

En la práctica se suele decir que los estándares dividen un sitio en 3 partes: Su estructura (XHTML), su presentación (CSS) y su comportamiento (JavaScript).

¿Para qué nos sirven?

Llegas cansado del trabajo, y te decides por ver una buena película. Alquilaste un DVD excelente; por lo que te contaron, la última joya del cine, algo imperdible. Lo introduces en tu DVD-Player, y de repente, tu equipo muestra un “Lo siento, para ver este DVD necesitas una pantalla de 30 pulgadas wide-screen” en tu televisión. ¿Decepcionante, verdad?

En la web, la escena anterior también se repite. Ocurre cuando entramos a un sitio y se nos pide un determinado navegador para continuar. O peor aún, cuando nos recomiendan navegar con determinada resolución de pantalla, pues a la gente que desarrolló el sitio les pareció que se veía mejor en 1280×960px.

Es aquí en donde entran en escena los estándares web. Los estándares nos garantizan la compatibilidad con todas las plataformas y todos los agentes de usuario (navegadores, lectores de pantalla para gente ciega, celulares, etc.) que existan. Esto quiere decir que al menos el contenido del sitio, será igualmente accesible por alguien que esté usando la última versión de Mozilla Firefox, como por alguien que esté usando Lynx.

Desarrollar con estándares tiene muchas ventajas

En general, la mayoría de los beneficios de usar estándares web parten de la premisa de separación de contenido, en XHTML, y presentación, en CSS. Entre algunas, de las muchas ventajas, podemos nombrar que los estándares:

  • Optimizan un sitio para motores de búsqueda (SEO). Desarrollar con estándares produce código XHTML limpio y semántico. Puesto que la mayoría de los buscadores trabajan indexando el contenido de un sitio, éstos tienden a priorizar a aquellos sitios con menor cantidad de código basura o no estándar en el sitio.
  • Producen un sitio fácil de mantener. El código resultante de un sitio con estándares es simple y se puede dividir en secciones, reduciendo la dependencia de un solo desarrollador y facilitando la comunicación entre varios grupos de trabajo en una empresa de desarrollo web (programación, maquetado, diseño, etc.).
  • Reducen el tamaño del sitio. Debido a la eliminación de elementos HTML que formatean visualmente una página, agrupando toda la parte visual en CSS, el tamaño de un sitio se reduce drásticamente. Esto nos garantiza que el sitio será cargado rápidamente aún en conexiones lentas, como celulares.
  • Son un paso necesario para la accesibilidad. A nivel dispositivo, los estándares aseguran que el contenido de nuestro sitio estará disponible para cualquier dispositivo con conexión a Internet. A nivel personas, implica tener en cuenta que nuestro sitio puede estar siendo accedido por personas con discapacidades, ya sean físicas (discapacidad visual, motriz, etc.) o de entorno o (sin mouse, con pantallas demasiado chicas, etc.).
  • Otorgan mayor flexibilidad al desarrollador web. Esto permite a los desarrolladores, por un lado, ocuparse solamente de la parte estructural del sitio (XHTML) y por otro lado, a los diseñadores nos da la versatilidad suficiente como para cambiar cualquier aspecto del diseño de un sitio. Como ejemplo, Wired Magazine (http://www.wired.com) cambia el esquema de colores de su sitio todas las semanas, y para hacerlo modifica solamente una línea de código en su XHTML.

Y también tiene un par de implicaciones

Lamentablemente el desarrollar sitios con estándares conlleva un precio. La interpretación de CSS como lenguaje de presentación en muchos navegadores, todavía es bastante mala y lleva a que cada uno tenga sus propios quirks o caprichos, que el desarrollador web debe conocer al realizar un sitio.

El caso más conocido es de Internet Explorer, el navegador usado por el 90% de los internautas del mundo, y el cual es totalmente deficiente en su interpretación del modelo de cajas de CSS (por citar uno de los cientos de bugs encontrados).

Por otro lado, la curva de aprendizaje de XHTML y sobre todo, de CSS, puede llegar a ser muy empinada para algunos diseñadores web de la “vieja escuela”, aquellos que todavía siguen maquetando sus sitios con tablas y llenando su código HTML con elementos de presentación (el elemento <font>, por citar uno).

Podemos resolver el primer problema consultando blogs y listas de correo con información sobre los últimos hacks encontrados para cada navegador. Por ejemplo, Ovillo es una lista de correo en español en donde se discuten acaloradamente temas sobre CSS y estándares web.

Para el segundo problema, lo única solución es capacitarnos. Enseñar a los profesores de universidades, que hay un nuevo y mejor método de construir la web. Y enseñar a nuestros colegas, que el mercado demanda sitios hechos con estándares web.

La repercusión de los estándares en el mundo

En el mundo, la proliferación del uso de los estándares para el desarrollo web, a nivel masivo, ciertamente empezó con el rediseño del sitio de la revista norteamericana Wired, en Octubre de 2002. El “caso Wired”, fue la prueba definitiva para los estándares web. Aquella que los llevaría a convertir su teoría en aplicaciones concretas del mundo real.

Luego, el mundo de los blogs, o la blogósfera, se encargó de diseminar la semilla. Jeffrey Zeldman, pionero, escribió largo y tendido sobre las ventajas de usar estándares web para la separación de contenido y presentación. Zeldman también fue el primero en escribir un libro orientado específicamente en el diseño web con estándares, camino que luego seguirían otros autores, como Dan Cederholm, con “Web Standards Solutions” y Dave Shea, creador de CSS Zen Garden, con “The Zen of CSS Design”.

Y la lista de sitios que migran hacia los estándares, continúa creciendo: Fast Company (http://www.fastcompany.com), ESPN (http://www.espn.com), Macromedia (http://www.macromedia.com), son solo algunos de los peces grandes que entienden el beneficio de los estándares web.

En Latinoamérica tampoco nos quedamos atrás

El uso de los estándares está muy difundido entre las empresas de desarrollo web del primer mundo, y en Latinoamérica también están pisando fuerte. Rediseños orientados a estándares y enfocados en la accesibilidad para personas discapacitadas, como el del diario La Nación (http://www.lanacion.com) iluminan el camino de los desarrolladores web hispanoparlantes y son un ejemplo a mostrar a posibles clientes.

Los blogs en español también se encargan de apoyar el movimiento por los estándares. Por citar un ejemplo, Juan Hurtado, en Armonía (http://armonia.spiral-static.org), escribe diariamente sobre desarrollo web, enfocándose en temas como los estándares web, la semántica y la accesibilidad.

En el futuro

En el futuro, los hacks y quirks propios de cada navegador serán cosa del pasado. Microsoft ha escuchado las plegarias de los desarrolladores web y con la nueva versión de Internet Explorer, es decir, la versión 7, promete ampliar enormemente su interpretación de CSS.

Por otro lado, Macromedia ha mejorado su soporte para CSS en Dreamweaver, y de esta manera está logrando posicionarse en la mente de los desarrolladores que buscan una suite enfocada en los estándares web.

Hoy en día, hay una clara tendencia al desarrollo web “responsable”, aquel que se basa en las premisas de compatibilidad futura y accesibilidad para todos los usuarios y dispositivos, esto es, las bases del desarrollo web con estándares.

Y dentro de muy poco tiempo, aquellas empresas de desarrollo web que no se den cuenta que los estándares llegaron para quedarse, y que no son solo una opción mas, no serán rentables y competitivas en un mercado que cambia día a día.

Jimi Hendrix en tamaño gigante

Bueno, una cosa que tenía pendiente de hacer, cuando me mudé a este nuevo departamento, es decorar las paredes. Lo primero que tenía en mi lista era hacer un poster gigante de Jimi Hendrix, usando Rasterbator.

El diseño del poster:

Imágen final

Hice el diseño en Photoshop (algunos pudieron verlo en vivo mientras lo hacía), luego lo fuí a imprimir, y lo pegué.

El poster final en la pared:

Postar final (3)

No hace falta decir que el poster impacta. Es inmenso y ocupa casi toda la pared. Pueden ver fotos mientras lo iba pegando en este set de Flickr.

¿Friki yo? :D

Modding extremo

Fanático del modding? Este impresionante catalogo de DIY PC Cases (gabinetes) puede motivarte un poco.

A ver cuando el amigo Merovingio nos sorprende con un case de Robotech :D

The WIRED CD

En Noviembre de 2004 Wired Magazine lanzó un CD con mash-ups de canciones de artistas de la talla de los Beastie Boys y Gilberto Gil, todo bajo una licencia Creative Commons que permitía distribuir estas canciones libremente. Hace unos días, en la lista Podcast-es alguien tiró el dato que ya estaba disponible el torrent para su descarga. Lo estoy escuchando ahora y la verdad que está muy bueno.

Pueden descargar el torrent del cd de Wired desde aquí.

Simula como se vería tu página desde un celular

La gente de Disruptive Innovations, creadores del excelente —y en cola de espera para ser probado a fondo— NVU, lanzó una extensión para Firefox que permite ver como se vería tu página desde la pantalla de un teléfono celular. Se trata de Small Screen Rendering XPI.

16-Bits visto desde la pantalla de un celular

Vía LinkLog.

Colaborando en Users

Bueno, me acaba de llegar la edición número 170 de la revista argentina Users, en donde desde este número soy colaborador :)

Si estás fuera de Argentina, te cuento que Users es tal vez la mejor revista sobre informática tecnología del país, haciendo reviews y artículos en temas variados que incluyen hardware, juegos, audio digital, programación y desarrollo web. Se distribuye en toda América Latina, si mal no recuerdo, llega hasta México también. En mi opinión creo que la revista debe su éxito —se publica desde hace 14 años en forma ininterrumpida— no sólo a sus notas, sino principalmente a su lenguaje sencillo y ameno y a su fuerte feedback con los lectores.

Mi nota es una introducción sobre los estándares web: Qué son, para qué sirven y el por qué de hacer el cambio. De mi primer artículo saco algunas conclusiones rápidas:

  • Escribir para una revista no es lo mismo que escribir para un blog. Como le decía a un amigo, en mi caso revisé mil y una veces el artículo para minimizar la cantidad de errores de concepto en el mismo. ¿Porqué? Por qué es un medio impreso, si te equivocas en alguna cosa fuiste, a llorar a la virgen. No es lo mismo que un medio on-line, un blog, en donde podés cambiar rápidamente el contenido de un post. También el tono del artículo no es idéntico al de un blog. Por otro lado, hay que pensar en la gente que no tiene Internet, o que no está muy metida en el tema del desarrollo web. Es por esto que se debe pensar el artículo de manera que sea digerible para varios públicos.
  • Escribir para una revista, tiene otros tiempos. Lleva un tiempo de investigación —repito, siempre en mi caso— considerable. Primero me basé en mis lecturas diarias para escribir el articulo. Sin embargo, los que me conocen saben que estoy más acostumbrado a leer en inglés que en español, por lo cual, me resultaba realmente complicado recomendar sitios en español para seguir la lectura. Así que al escribir este artículo también aprendí un poco más del mundo de los estándares web en español.
  • ¿Se puede vivir del blog? Tal vez la pregunta mas repetida es esta. En mi caso, y como lo digo siempre, no sé si puramente de las visitas y publicidad contextual de un blog se podría, como Kottke, por ejemplo, pero lo que sí podés hacer es darte a conocer a través de tu blog. Yo en este caso encontré trabajo en Users por qué Fer venía leyendo este blog.

Estoy bastante conforme con el resultado de mi primer artículo. Y espero que los que compran Users también. No quiero terminar este post sin darle infinitas gracias a Fernando Casale por darme la oportunidad de escribir en la revista :)

Probando FeedBurner

FeedBurner es un servicio que agrega varias funcionalidades extra a tus feeds en RSS, aunque tal vez lo más interesante que tiene es su panel de estádisticas de acceso a tu feed.

Lo estuve probando y he decidido cambiar la dirección de mis feeds. Sin embargo, para que todo sea menos doloroso —para ustedes, para mí no tanto—, hice una regla RewriteRule en Apache para que todas las peticiones al archivo viejo del feed se redireccionen en forma transparente a mi cuenta en FeedBurner (http://feeds.feedburner.com/16bits).

Todo tendría que andar perfecto, de cualquier manera si a alguien le está tirando algun tipo de error, por favor, comentenlo, indicando el lector de feeds que están usando.

Me invitaron a probar Odeo

Bueno, recién me llegó un e-mail de la gente de Odeo invitandome a probar su servicio. Les cuento que desde el login form el diseño de la aplicación es excelente.

A ver si me animo a grabar un podcast contandoles que tal.

Actualización: Hay una interesante entrevista a Evan Williams, fundador de Odeo, en Playlist Magazine.

La historia de ping

Yes, it’s true! I’m the author of ping for UNIX. Ping is a little thousand-line hack that I wrote in an evening which practically everyone seems to know about. :-)

La historia del comando/programa ping, tal vez el más usado después de ls o clear. Muy geek, pero divertida ;)

Vía ALT1040.

Como tratar a tus compañeros de oficina

MSN Careers publica una graciosa pero interesante reseña de 6 “especies” de compañeros de trabajo y explica como tratarlas.

Vía Lifehacker.



Copyright © 2004–2009 Rodrigo Galindez. All rights reserved. Web hosting by XMundo.

RSS Feed. Proudly powered by Wordpress. Correct at time of going to print.