Definiendo Estandarización

Tercer artículo de la serie Estandarizando el Web, donde se sientan las bases de lo que significa dicha estandarización.

Esta es la tercera parte de una serie de artículos sobre estándares que publicaremos en Maestrosdelweb, Aqui puedes ver la lista completa

Si vamos a pasar los siguientes meses hablando de "Estandarización", lo más prudente es que estandaricemos nuestro concepto, lo que significa, lo que implica y la responsabilidad que ello conlleva.

La definición

Podría hacerte perder algunos minutos dilucidando sobre la deficición conceptual de la estandarización, pero creo que es mejor que le deje eso a los expertos…

Estandar.- Que esta unificado respecto a un modelo.

Su aplicación en el WEB

Estandarizar no significa que todas las páginas deban lucir igual, ni siquiera que las secciones de un sitio deban llamarse de una o de otra manera, significa que las páginas web deben construirse en base a unas normas.

Estas normas son establecidas y controladas por un grupo de expertos, este equipo se conoce como el WWW Consortium, W3C son sus siglas en inglés. Esta es su página, y en ella se encuentran las definiciones de los diversos tipos de documentos, lenguajes y sistemas unificados que controlan la red de redes.

Sin embargo dichas normas rara vez son seguidas al pie de la letra por los desarrolladores de páginas, excepción hecha de las grandes firmas internacionales… ¿será por eso que son grandes e internacionales?. Y lo más irónico es que estas normas están disponibles para TODOS. Así que ¿por que no apegarnos a ellas y ampliar nuestras posibilidades de competir con los grandes?

¿Estandarizarme significa que ahora debo usar XHTML y CSS? – ¡NO!

Bueno, al menos NO NECESARIAMENTE, estandarizarse significa utilizar las herramientas en la forma y para el fin para el que fueron creadas. Puedes usar HTML 1.0, y si lo usas tal como lo dicta la definición del lenguaje… estarás estandarizado.

ENTONCES PARA QUE ME PONGO A APRENDER XHTML Y CSS, podrías estarte preguntando ahora, y la respuesta es: para que aproveches todas las virtudes de estos lenguajes, entre ellas la separación de contenido y presentación, pues ya hemos hablado de esta carencia en el HTML. Otra buena razón es que cada día hay más empresas que se están tomando en serio su presencia en internet, y buscan apoyarse de casas desarrolladoras que dominen estos lenguajes. Tal vez esta última sea mas contundente para tu bolsillo ;)

Lo prometido es deuda

En mi anterior artículo te ofrecí hablar sobre el uso correcto de las etiquetas, y eso es un punto crucial durante la estandarización, así que vayamos al grano, estas son algunas de las etiquetas peor usadas por los desarrolladores, incluso por muchos que ya dominan XHTML y CSS.

<p>

Esta etiqueta se debe usar para escribir párrafos. El mal uso de esta etiqueta no es por que sea usada para otras cosas, sino porque muchas veces ni siquiera se usa. El desarrollador simplemente comienza a meter texto donde mejor le conviene, dentro de una celda <td>, despues de un título, o ahí donde caiga. Y también es común ver <p>’s usados para escribir encabezados, notas, etc. La regla: Si vas a escribir un párrafo, mételo en un <p>.

<table>

Las tablas fueron creadas para agregar contenido tabular en una página, no para acomodar elementos gráficos, ni para distribuir el contenido en tu layout. He tenido el infortunio de encontrarme con páginas que para conseguir su diseño final usan hasta 30 tablas anidadas. Recuerda que los navegadores consideran todo lo que está dentro de una tabla como un solo elemento, y no lo muestran hasta que se ha cargado por completo la tabla. Tus visitantes pueden ir a tomarse un café antes de que termine de cargar todo tu contenido.

<ul>

Este elemento es muy peculiar, pues su MAL USO comenzó con la introducción de las hojas de estilo. Hoy en día es muy común que los diseñadores que usan CSS desarrollen sus menús usando listas desordenadas como base. La regla: Usa las listas para listar elementos, no para construir menús.

<div>

Esta etiqueta tiene un fin muy particular, sirve para identificar bloques de información que pertenecen a un mismo entorno lógico ó jerárquico. Por ejemplo <div id="menu_principal"> ó <div id="articulos">. Desafortunadamente es muy común verlo utilizado para colorear backgrounds, o para escribir encabezados.La regla: Los DIV dividen tu página en sectores con uso ó contenido similar.

<h1>

Esta, así como todas las etiquetas de header (h1 al h6), son de las más útiles, pero también de las menos usadas, tal vez porque sin las hojas de estilo era muy dificil darles un formato atractivo, pero ahora ya no hay pretexto. La regla: Usa los niveles de encabezados para estructurar tu documento de forma lógica. Ejemplo: h1 para el título principal de cada sección, h2 para los sub-temas principales, h3 para indicar categorías de ese sub-tema, h4 al h6 para dar formato a los encabezados y sub-encabezados de tus artículos. El objetivo es que te ayuden a visualizar la estructura de tu documento.

Bueno, por el momento me despido, te veo en el próximo episodio de este drama de la vida real… Estandarizando el Web.

Saludos, y hasta la próxima!

Manuel Guerrero
Director de Convergensys
cvander
15/06/2004

Me llama la atención la explicación de las etiquetas donde mencionas que está mal utilizado el UL para crear menús. En este caso que sería la correcto entonces? Usar DIVs para separar cada uno de los items en un menú?

Manoloweb
15/06/2004

Todo dependerá del tipo de menú.

Pero si definieramos menú como grupo de ligas, pues ahí está la respuesta… un menú es un conjunto de LIGAS ““. Por lo tanto lo más básico o apegado a la definición sería un conjunto de ‘s agrupados en un

.

Suena lógico, no?

Recordemos que UL es una lista desordenada (o mejor dicho sin orden) que tiene un uso muy específico. Listar elementos de una lista usando viñetas.

Lo primero que nos debe dar la pauta para ver que estamos mal-usando un elemento es que para obtener el resultado final debemos quitarle sus características mas representativas…

Si me compro una camioneta de pasajeros y para poder usarla en el reparto de Tomate debo llevarla a que le quiten el techo de la parte trasera, quiere decir que de entrada escogí mal el tipo de camioneta, no? Lo ideal en ese caso es comprarse una pick-up y usarla tal cual sale de la agencia.

Lo mismo con las viñetas, si para que me den el servicio que busco debo quitarle las viñetas y el indentado… bueno, pues algo malo sucedió al escoger mi elemento… ;-)

Todo esto siempre podrá ser tema de discusión. Y mientras haya algo para debatir… habrá razon de ser de foros y comunidades!! :-D

Saludos!

JavierB
17/06/2004

Hola.

En un mensaje que puse en el Foro de (X)HTML, PatomaS me comenta que el DTD que aparece en la página:

http://www.maestrosdelweb.com/editorial/haciaxhtml/

< !DOCTYPE html PUBLIC "-//WC3//DTD HTML 1.0 Transitional//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

debería ser:

< !DOCTYPE html PUBLIC "-//WC3//DTD [COLOR=Red]X[/COLOR]HTML 1.0 Transitional//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

Saludos, :adios:

Manoloweb
17/06/2004

Uy, un pequeño error de dedo…

Efectivamente, voy a corregirlo. Gracias por el typo ;-)

cvander
17/06/2004

Excelente la aclaración de los UL.

CORE
19/06/2004

Segun con lo que lei div para el posicionamiento del contenido entonces debemos usar div#enlaces para hacer un menu

En versiones anteriores a html 4.01 existia un elemento llamado menu que tenia las misma propiedades que ul si fue desaprobado es por que cumplia la misma funcion que ul ¿no? los menus del w3c

La misma W3c usa ul il para mostrar sus menus
se me hace totalmente correcto usar estas etiquetas mejor preguntarle al validador a ver si tira algun error que diga que li no puede tener

saludos

xcorpion
19/06/2004

pues si no es con

con que etiqueta acomodamos graficos, hay alguna propiedad que le diga a las etiquetas las coordenadas exactas donde se van a mostrar?(solo sarcasmo), yo en lo personal las uso mucho para eso aun que en mi pagina no vas a encontrar mas de 5
anidados.

CORE
21/06/2004

Aqui me encontre esto que nos quitara de dudas

el manual del w3c dice:
El elemento DIR (desaprobado) fue diseñado para crear listas multicolumna de directorios. El elemento MENU (desaprobado) fue diseñado para listas de menú de una sola columna. Ambos elementos tienen la misma estructura que UL, y únicamente varía su representación. En la práctica, un agente de usuario representará una lista DIR o MENU exactamente igual que una lista UL.
Recomendamos encarecidamente usar UL en lugar de estos elementos

el enlace http://www.sidar.org/recur/desdi/traduc/es/html401-es/struct/lists.html#h-10.4
Que cada quien le de el diseño que prefiera es por que pasa eso fueron creadas las CSS y en lugar de limitarnos hay que segui experimentando.

saludos

CORE
26/06/2004

Lo que mencionas tiene que ver mas con usabilidad que con estandares, lo mejor seria preguntar en un foro de usabilidad. sobre usar o no viñetas en las listas

Si estubiera mal usar la propiedad none del selector list-style el w3c no hubiera aprobado la recomendacion de las CSS2.1 si no exisitera la propiedad esto seria un ejemplo de mal forzar las listas
list-style-image:url(transparente.gif); pero no es el caso ya que si esta ahi es para usarse

ejemplos de usabilidad en menus usando UL pueden sobrar , lo mejor es romper con los paradigmas que no nos permiten ver mas alla de lo que podemos lograr.

saludos

Durgeoble
3/07/2005

No estoy de acuerdo, un menu es una lista (en ocasiones aninada) de elementos “a”, el hecho de quitarles las viñetas y el indentado es puramente visual.
Sin embargo se hecha de menos un elemento “menu” en el cual puedas definir funciones mas especificas (horizontal, vertical, anidado, desplegable, ect..) en mi opinion aunque un menu no sea mas que una lista de enlaces el hecho de disponer de un elemento propio permite llamarlo independientemente del resto del contenido (p.e en un medio auditivo el oyente dice menu y automaticamente el lector le vuelve a decir las opciones sin perder el foco de donde se encontraba leyendo).
Siendo una separacion de contenido, no solo incluiria menu sino que ademas incluiria indices automaticos (no empieza a sonar como si quisiera que xhtml fuera como latex XD)

FedeMichell
10/11/2005

xcorpion, pues si no es con

con que etiqueta acomodamos graficos, hay alguna propiedad que le diga a las etiquetas las coordenadas exactas donde se van a mostrar?(solo sarcasmo), yo en lo personal las uso mucho para eso aun que en mi pagina no vas a encontrar mas de 5
anidados.

En mi caso, aunque siempre intento utilizar el menor numero de tablas podibles, muchasveces termino con varias tablas aninadas. Si la hay (q no la conozco), me gustaria saber como organizar contenido grafico en sin hacer uso de ellas.

vevni
17/06/2006

se que es un comentario fuera de tiempo con respecto ala fecha de publicacion de este editorial… pero ahi menciona sobre el mal uso de los ul…
si entran a ver el codigo de esta pagina veran que sus menus de arriba fueron diseñados con

    ,, hechenle un vistaso..

    saludos!!!

xxxx
30/08/2006

mammmela verga

myki
21/09/2006

no opino nada

el metalero
15/01/2007

esta pagina no sirve para nada el que la creo es un pobre tonto… no seas tan bruto chamo mejor create una pagina pornografica y ases que te estas metiendo un consolador por el culo…

ul entonces
13/02/2007

si no utilizo ul para construir menus entonces que seria lo objetivo

Juan Isidro
5/11/2007

buenas soy un novato en la edicion de paginas web, no me pueden recomendar un buen libro que enseñe como hacer paginas web en bases en los estandares xhtml, css, y dom, uno que no sea solo referencia, sino que te enseñe como manejarlo. Y no si pueda decirnos que paginas son el mejor ejemplo de crear menus sin UL de manera correcta.

luis
29/04/2008

Como se puede estandarizar?
que formas existen?

si me pudieran colaborar en eso xfa… Gracias

Por que no le hacen casos a los comentarios ?? alli dice que hacen mal uso de las listas.. uds usan listas para crear menus.. si van a hablar de estandares creo que los que deberian dar el ejemplo son Uds… Gracias…

[...] de las personas que desarrollan sitios webs, no lo hacen como deberían hacerlo, los conceptos de estandarización web y un poco de accesibilidad, se encuentran netamente nulos, y prácticamente como decimos en buen [...]

[...] Definiendo Estandarización [...]

octavio
29/08/2009

no mames taba buscando ke putas es estandarizacion y dice puras mamadas

jajajajjajajajajaajjajaj

laura camila
11/06/2010

cojan juicio inmaduros y no hagan perder tiempo malditos imbeciles

[...] páginas deban lucir igual, o que las secciones de un sitio deban llamarse de una o de otra manera. Descargar este archivo Red de portales: ConocimientosWeb – Cursos online – Diario Tecnológico – Zips del [...]

[...] tanto los establecidos a nivel de la empresa como los nacionales e internacionales. Estos estándares pueden establecerse sobre el formato de los datos para facilitar su intercambio, pueden ser [...]

145