¡Tradución de "Blogs" al portugués! | ¡Segunda edición ya disponible!


Curso de Blogs II: Weblogs y estándares web, una pareja explosiva

por José Luis Antúnez · Capítulo: 6.- Arquitectura weblog (Extra)

Retomamos el capítulo práctico. Si en la primera entrega hablábamos del mapa de accesos de un blog y las premisas que teníamos que tener en mente para personalizarlos. Hoy profundizaremos en la relación de los blogs con los estándares web.

Es un texto, que recomendamos especialmente a los profesionales del desarrollo web y empresas con presencia en Internet que aún no conocen las ventajas de la construcción de páginas usando estándares web. Sabemos que a muchos lectores este texto les puede resultar técnico pero lo importante es que conozcan su relevancia para comprender todo lo que acontece en la Red. Si tienes un blog y quieres personalizarlo también te resultará muy útil saber qué haces ya que en sucesivas entregas te explicaremos cómo "codear" los listados de ítems en tus anotaciones, cómo citar extractos de textos ajenos...

Weblogs y Estándares web, una pareja explosiva

Si las bitácoras ya lideran el volumen de contenidos en la Red, una revolución paralela protagonizada por los Estándares Web, las tecnologías fijadas por el World Wide Web Consortium (W3C) en colaboración con otros organismos, están marcando la pauta para la construcción de mejores sitios en la Red, o dicho de otra forma, de cómo será Internet en los próximos años.

Las herramientas weblogs (y por extensión los blogs), desde el primer momento, son su portavoz principal. El ejemplo evidente de cómo usar los estándares generan valiosos y cuantificables beneficios tanto para el diseño como para la gestión y difusión de lo que publicamos.

Los estándares web son uno de los ingredientes clave en el éxito de los blogs. Y fuera de la blogosfera comienzan a percatarse del impacto que pueden tener en sus estrategias. Yahoo USA, AOL, ABC News..., son de los últimos recién llegados que se han apuntado siguiendo el camino abierto años atrás por otros grandes como Wired, ESPN... La lista aumenta a diario.

" Dos escuelas en el diseño web: Los que maquetan con tablas y los que no lo hacen estructurando el sitio desde la CSS "

Diseñar con estándares supone saltar de la arquitectura de piedra o del hierro a la nueva arquitectura del siglo XXI donde los nuevos materiales junto a los contrapesos forman las más vanguardistas construcciones. Si cualquier ciudad del mundo pugnaría por una obra de Norman Foster o Santiago Calatrava, toda empresa con presencia en Internet rehuirá de las webs con tablas para contratar a profesionales que apuesten por los estándares y el uso de los divs estructurados mediante XHTML y CSS.

lb-tablas.gif

(Con tablas. Solo se ven en editor web, no en el navegador)

lb-tableless.gif

(Con divs desde CSS. Más flexible, ligero, semántico...)

¿XHTML?: Es el lenguaje pensado para sustituir al clásico HTML como estándar para las páginas web. Es más limpio, más semántico.

¿CSS?: Hojas de Estilo en Cascada (Cascading Style Sheets), es el mecanismo que permite la personalización de un documento en la pantalla, incluso de cómo se va a imprimir, entre otras funcionalidades. Con la CSS personalizas cualquier aspecto de la web. Desde la tipografía (fuente y tamaños), plantilla (posición y margénes), colores... Definición y ejemplos en la web del W3C.

¿Divs?: Son los contenedores que configurados desde la CSS dan estilo a la plantilla (posicionamiento, accesos...) de la página web.

Los estándares web nacieron para establecer los cimientos comunes para que cualquier documento on line siempre funcione correctamente sin depender de la evolución de los navegadores u otros dispositivos con acceso a Internet.

Aceptados mayoritariamente por la industria del software, salvo aisladas excepciones, una página web que cumpla con los estándares debe:

  • Estar construida en un XHTML válido, lenguaje que extermina los lastres innecesarios implantados por el conocido HTML, por ejemplo el elemento clásico de <font> ya es innecesario. El w3c ofrece validadores de código para comprobarlo.
  • Utilizar hojas de estilo CSS para separar el contenido de la presentación (diseño). La plantilla debe estar maquetada desde el archivo CSS con divs en vez de tablas.
  • Ser accesible para toda persona, especialmente las que tengan una discapacidad. Es una obligación moral que afortunadamente la CSS nos brinda. A pesar de la creencia de la "vieja escuela" de desarrolladores, no condiciona ni estética ni funcionalmente la organización del sitio.
  • Funcionar en cualquier navegador. Esta premisa no significa que se vea igual en todos. Aunque la apariencia suele ser idéntica en la mayoría de casos, hay trucos CSS para que la interpretación del código sea uniforme.

La potencia que van adquiriendo obliga que actualmente Microsoft tenga una preocupación añadida con su Internet Explorer: hacer que los interprete, escrupulosamente. Centrar los esfuerzos en solucionar los constantes agujeros de seguridad no les bastará. Se juegan la supervivencia de Explorer en el mercado. La cuota de usuarios que utilizan la nueva generación de navegadores aumenta a ritmo de crucero. El flamante símbolo del Open Source que es Mozilla Firefox, apoyado masivamente por la blogosfera, ya es la opción predeterminada de alrededor del 10% de los internautas en todo el mundo.

Beneficios del diseño con estándares web

Todos los imaginables desde los relacionados con la rutina diaria a económicos:

  1. A los ya mencionados de favorecer la accesibilidad a personas discapacitadas, por tanto más lectores o clientes potenciales, y ser compatibles con todos los navegadores...
  2. Mayor control del sitio (Belleza eficaz) y ahorro de costes.

    Si ya por regla general las web creadas con CSS son visualmente más bellas propiciando una fidelización inicial, una modificación que hagamos en la hoja de estilos podemos hacer que afecte a todas las páginas.

    Con un XHTML correcto aplicándole distintos estilos CSS se obtienen webs de aspectos totalmente diferentes. Las iniciativas colectivas marcadamente artísticas como CSSZengarden o CamaleónCSS impulsadas por los bloguers Dave Shea y Manuel Guerrero, respectivamente son casos paradigmáticos.
    Esta simplicidad en el método permite una flexibilidad universal que evita programar versiones alternativas para cada navegador con el respectivo ahorro de producción y mantenimiento. De paso facilitan la tarea a otros profesionales que en el futuro aborden una renovación en profundidad.

  3. Reducción de código.

    Un XHTML limpio minimiza el peso de las páginas acelerando la renderización y velocidad de carga, aspecto vital dominando como lo hacen aún hoy día las conexiones de 56Kpbs. Este ahorro en el ancho de banda, en el que la hoja de estilos también contribuye al cargarse la primera vez que visites la web guardándose posteriormente en el caché de tu navegador, es un argumento definitivo para que las empresas se decidan a dar el salto. En sitios con gran tráfico puede suponer un ahorro de miles, incluso, millones de dólares al año.

  4. Mejor indexación en los buscadores.

    Los motores de búsqueda aman los sitios programados bajo estándares web. Al separarse el contenido de la presentación, el etiquetado semántico del XHTML potencia una catalogación rápida y precisa subiendo en el posicionamiento de las páginas en los resultados servidos por Google, Yahoo...

  5. Adaptabilidad.

    Otra ventaja de separar contenido de presentación es la capacidad para configurar a través de las hojas de estilo versiones para imprimir. Al mismo tiempo facilitan la consulta en otros dispositivos móviles.

  6. PRESTIGIO.

    Tanto para el cliente como para el desarrollador. La versatilidad del CSS ha hecho desde la aparición de los blogs que la blogosfera haya liderado su implantación en la industria online. No por casualidad, los diseñadores más prestigiosos son bloguers refutados que han visto en el blog personal o corporativo un vehículo para difundir las maravillas de los estándares web.

La blogosfera lidera la vanguardia en la industria del diseño web

Son populares las iniciativas weblog dedicadas a reseñar los sitios basados en CSS. CSSVault, la primera en aparecer a cargo de Paul Scrivens que la vendió en enero de 2005 por una cantidad sin especificar de miles de dólares, CSSBeauty o la reciente CSS Manía que ha evolucionado el género y de la que no puedo ser imparcial, son tres de tantas en donde miles de personas acuden diariamente para descubrir e inspirarse con nuevos diseños.

Conseguir una reseña en estos blogs es un reconocimiento altamente valorado por el desarrollador o autor de una bitácora, pero también es cada vez más un objetivo para la organización que considere trascendental su presencia en la Red. Los blogs del género "CSS Showcases" se han convertido en una plataforma de promoción, de oportunidad para alcanzar, incluso recuperar credibilidad, y generar empatías, sin parangón en Internet.

Veamos dos casos prácticos con datos sobre la mesa para plasmar la importancia de los estándares.

Douglas Bowman, uno de los referentes actuales en creación web como sabe la gente de Terra en sus inicios, responsable de los últimos rediseños de Wired y Blogger entre otros, mostraba en septiembre de 2004 en el Web Essentials celebrado en Sydney, algunas cifras sobre la conversión a los estándares web de algunos sitios líderes en la WWW. Su ponencia, clarificadora: "The Beauty and Business of CSS":

El año 2003 el canal deportivo ESPN con aproximadamente 40 millones de páginas vistas diarias redujo por página en torno a los 50KB. Lo que suponen un ahorro de 730 Terabytes de ancho de banda al año. El precio de 1 terabyte en 2006 oscila entre los 1.000 a 2.000 dólares aproximadamente. Hacemos la cuenta, y...

La guinda la puso en el análisis que hizo sobre Microsoft.com que mantiene dos versiones una para Windows con Internet Explorer 5.5, 6.0; y otra para el resto de plataformas con menos detalles. En un sector donde el tiempo es oro, el gasto es evidente. Bowman demuestra que con una versión diseñada con estándares sería suficiente. No solo el sitio ganaría en compatibilidad, rapidez, desarrollo, soporte al usuario sino que ahorraría a la empresa fundada por Bill Gates 379 Terabytes al año. Revelador, ¿verdad?.

Tanto que Microsoft en febrero de 2005, no sabemos si inducidos por el análisis de Bowman pero sí por su competidor directo que es Yahoo USA, estructuró su portal generalista MSN.com con CSS.

Escribir código XHTML y CSS no es algo destinado a una élite de profesionales. Cualquier programador puede crear sitios con estos parámetros al igual que los bloguers, aficionados o no al diseño, como demuestra el manual escrito por Belén Albeza publicado en su bitácora Demasiada cafeína, la web Manual de CSS, o la guía Cómo hacer buenas páginas web de Daniel Clemente que te servirá para usar el HTML estricto con CSS como paso previo a usar CSS con XHTML.

En la siguente entrega repasaremos las plantillas más comunes y profundizaremos en cómo organizar los accesos (posts, fechas, información del autor, listados de archivos...).

Relacionados

3 comentarios, trackbacks » Formulario

URL para hacer ¿trackback? a este post:
http://blogsmedia.com/bm/mt-tb.cgi/43

1. victor abellon ~ Miércoles, 01 de Mar 2006 | 16:21H:

Hola JL
Estupendo. Muy clara la exposición. Me ha ayudado a situarme mejor en este proceloso oceáno. Una pregunta sólamente ¿dónde ubicamos el fenómeno AJAX en todo esto? ¿hay además agendas sociales y políticas en el enfrentamiento entre ambas escuelas como apuntan algunos? ¿me voy por los cerros de Úbeda?
Enhorabuena por la buena acogida que ha tenido el libro

saluti

vik/*

2. Timshel ~ Miércoles, 01 de Mar 2006 | 18:46H:

Gracias Víctor.

Ajax no es un lenguaje como los mencionados en el post. Es una técnica que combinada por ejemplo con XHTML y CSS te interacciona elementos del sitio sin tener que llamar al servidor. Quizá lo comprendas mejor leyendo este post en Dirson.

Para escribir posts que respeten o intenten respetar los estándares, el AJAX no tiene nada que ver.

3. BenKo ~ Viernes, 24 de Nov 2006 | 20:28H:

No funciona el link a mi tutorial. En su lugar, enlazad a http://cafeina.ladybenko.net/index.php?page_id=5 (donde iré colgado versiones posteriores y demás cosillas).

PD: El hotlinking está feo :(
PD2: Pero me alegro de que os haya gustado el tuto ;)

Conversación




¿Recordar datos?

Escribir comentario

Puedes enlazar insertando: <a href="http://...">tutexto</a>