metal.ize

Y bueno... tras un pequeño tropezón emocional, aquí ando de vuelta. Ahora para continuar con mi pequeña meta a corto plazo y, como lo prometí, ahora toca hablar de lo que es el contenido semántico. Y para empezar, un ejemplo. Como pueden apreciar en la imagen (¡cierren la boca! ), las boobs (senos, pechos, tetas, campanas, ubres o como carajos quieran) están entre las tags <tits></tits>. Será un chiste sexista, vulgar y extremadamente gracioso de mal gusto, pero es un excelente ejemplo de lo que es el contenido semántico.

El contenido semántico no es más que un principio muy sencillo y que, desde la creación del HTML se tiene contemplado: contexto. Así de sencillo. Si estás poniendo un párrafo, debes usar la tag <p>, si vas a colocar una cita textual debes utilizar <blockquote> y si vas a poner boobs, usas <tits> (claro está, si estás usando XML, porque HTML no tiene una tag llamada así ).

Bastante sencillo ¿cierto? Entonces ¿Cuál es el problema? El problema es que la mayoría de la gente no utiliza contenido semántico. Así de sencillo. ¿Las razones? Se me ocurren unas cuantas:

• La gente no conoce todas las tags que existen.
• Usan WYSIWYGs para crear sus webs, y estos programas no entienden nada de contenido semántico.
• La frustración de no lograr que cierta tag se vea como uno quiere en todos los navegadores y, por consiguiente, usan una tag erronea (como <blockquote> para identar texto).
• Simplemente no se ponen a pensar en si esa tag es la adecuada o no.

¿Por qué es importante usar contenido semántico?

Ahora pasemos a la importancia del contenido semántico. Primero que nada, el concepto básico del HTML es el etiquetar el contenido y denotar lo que la información es, ya sea un encabezado, un párrafo o un hipervínculo.

Ahora bien, al estructurar nuestros documentos de esta manera, estilizar nuestra página con CSS es mucho más sencillo. ¿Por qué? Porque si queremos que todos los párrafos de nuestro documento tengan el texto rojo, con fuente arial, con 1.5ems de alto por cada línea y su ancho sea de 400px; simplemente declaramos algo como esto en nuestro CSS:

Y de esta forma habremos alterado la apariencia de TODOS los párrafos de nuestra página. Así de sencillo.

Otra de las ventajas es la accesibilidad. Última y afortunadamente se han creado ciertos softwares llamados assistive technologies (tecnologías de asistencia), los cuales hacen maravillas para la gente con discapacidad (Que creanme, visitan la web y con MUCHA frecuencia). Estos softwares pueden hacer maravillas, desde aumentar el tamaño del texto, pasar de voz a texto o leer el texto en pantalla. Pero todo esto depende en gran parte del diseñador web. Estos archivos reconocen si es una cita, un párrafo, un hipervínculo, una abreviación, etc. por lo que si usamos inadecuadamente las tags, estos programas son inútiles y la gente queda excluida de la información que queremos hacerles llegar.

Tambien le haces la vida más fácil a los buscadores de internet, como googlebot. Con contenido semántico las oportunidades de que tu sitio web sea indexado correctamente y la gente encuentre en tu sitio la información que busca son mucho más altas.

Finalmente, estarás cumpliendo con los estándares de la web, lo cual te asegura una buena compatibilidad con los navegadores, tanto antiguos como futuros.

Cabe destacar que el contenido semántico funciona mejor cuando lo usas en conjunto con otras tecnologías, como el XHTML, CSS y algunas reglas básicas de accesibilidad. Junta estos elementos y tendrás una web que es más cómoda de trabajar para ti, más accesible para tus usuarios y más compatible con los navegadores. ¡¡Todos ganan!!

Ahora que saben la importancia del contenido semántico será hora de que me ponga a trabajar y puedan tener una guía fíable de las tags, sus usos y sus posibilidades para estilizar. Pronto empezaré con los posts por tag.