{"id":63,"date":"2008-03-23T02:14:18","date_gmt":"2008-03-23T01:14:18","guid":{"rendered":"http:\/\/elbonia.cent.uji.es\/jordi\/prensa-conferencias-etc\/html-la-tela-de-la-arana\/"},"modified":"2011-02-21T17:22:50","modified_gmt":"2011-02-21T16:22:50","slug":"html-la-tela-de-la-arana","status":"publish","type":"post","link":"https:\/\/elbonia.cent.uji.es\/jordi\/2008\/03\/23\/html-la-tela-de-la-arana\/","title":{"rendered":"HTML: La tela de la ara\u00f1a"},"content":{"rendered":"

HTML: La tela de la ara\u00f1a<\/strong>
\nJordi Adell\n<\/p>\n

 <\/p>\n

Net Conexi\u00f3n, n\u00ba2, diciembre 1995<\/p>\n


\n<\/strong><\/p>\n

La p\u00e1gina contiene texto e im\u00e1genes. Algunas palabras son de color azul. Hacemos clic sobre ellas con el rat\u00f3n y tras unos segundos aparece la primera p\u00e1gina de una revista electr\u00f3nica. Introducimos algunos t\u00e9rminos de b\u00fasqueda en un recuadro y una base de datos nos brinda una colecci\u00f3n de documentos relacionados. Se\u00f1alamos sobre un icono y o\u00edmos una melod\u00eda o vemos un peque\u00f1o fragmento de video. Es Internet y el World-Wide Web, la aplicaci\u00f3n que m\u00e1s ha contribuido a su popularizaci\u00f3n. Los documentos hipermedia y sus v\u00ednculos hipertextuales forman una tela de ara\u00f1a de decenas de miles de nodos en todo el mundo. Una tela tejida con una sustancia especial: el HTML.<\/p>\n

El HTML o \u00abHyperText Markup Language\u00bb es el lenguaje en el que est\u00e1n escritos los hipertextos en el World-Wide Web (WWW). Se trata de un conjunto relativamente simple de especificaciones estandarizadas que permiten identificar en un texto sus partes fundamentales (como el t\u00edtulo, el cuerpo del documento, los encabezamientos de cada una de sus partes, los diferentes p\u00e1rrafos, etc.). Tambi\u00e9n podemos incluir mediante el HTML algunas opciones de formato (como separadores, negrita, it\u00e1licas, hacer listados, etc.). Podemos crear v\u00ednculos hipertextuales (o ‘links’) a otros documentos o ficheros de la Internet de tal forma que con un simple clic de rat\u00f3n aparezcan en la pantalla, aunque se hallen en la otra parte del mundo. Nos permite insertar im\u00e1genes junto al texto, en incluso definir alguna zona de la imagen como un v\u00ednculo hipertextual. Finalmente, podemos crear formularios para que el usuario interact\u00fae de modo complejo con sistemas inform\u00e1ticos como bases de datos y otras aplicaciones y servicios.<\/p>\n

HTML y SGML<\/h2>\n

El HTML es en realidad una aplicaci\u00f3n del est\u00e1ndar ISO 8879:1986 \u00abInformation Processing Text and Office Systems: Standard Generalized Markup Language\u00bb (SGML). El SGML es un meta-lenguaje mediante el cual se pueden definir tipos de documentos estructurados y lenguajes de marcas para representar ejemplos o instancias de este tipo de documentos. Es decir, un lenguaje dise\u00f1ado para describir otros lenguajes. El SGML es un lenguaje esencialmente declarativo y no procedural, es decir, s\u00f3lo identifica los elementos de un documento y no prescribe qu\u00e9 debe hacerse con dichas partes o elementos. El SGML pretende definir formas de codificar textos independientemente de sistemas inform\u00e1ticos. Como todo lenguaje de marcas, el HTML especifica qu\u00e9 marcas est\u00e1n permitidas, cu\u00e1les son adem\u00e1s obligatorias, c\u00f3mo pueden distinguirse del texto que constituye el contenido y, a la postre, qu\u00e9 significan las marcas.<\/p>\n

Lo que NO es el HTML es un lenguaje para describir la apariencia de los documentos hipermedia. En demasiadas ocasiones nos encontramos con p\u00e1ginas en las que se fuerza el HTML para que tengan la apariencia buscada por el autor en un determinado agente de usuario o cliente WWW, olvidando el aut\u00e9ntico prop\u00f3sito del HTML y la existencia de usuarios que utilizan otros clientes. El HTML puede conjugarse con otras especificaciones (como hojas de estilo) para asegurar al autor el control sobre la apariencia de sus documentos, pero como tal, es el desarrollador del ‘browser’ quien decide si la cabecera de nivel 2 se representa en negrita y con un tipo de 14 puntos o subrayando el texto normal. En definitiva, el HTML no es un mal lenguaje de autoedici\u00f3n, sino una forma independiente de plataformas y sistemas de marcar textos para que sus diferentes partes y elementos sean posteriormente identificables de modo automatizado.<\/p>\n

El HTML es texto<\/h2>\n

Un documento HTML es una secuencia de caracteres organizada f\u00edsicamente en un conjunto de entidades (que poseen un nombre, atributos y contenido) y l\u00f3gicamente como una jerarqu\u00eda de elementos. Un documento HTML no es m\u00e1s que texto (ASCII o ISO Latin 1) que incluye una serie de elementos (como cabeceras, listas, formularios, v\u00ednculos hipertextuales, etc.), que pueden tener atributos. Cada elemento se delimita mediante marcas (o ‘tags’ en la jerga HTML). El ‘tag’ inicial comienza con el car\u00e1cter < y termina con > y contiene el nombre del elemento y sus atributos. El ‘tag’ final comienza con los caracteres . Por ejemplo, para indicar que una cadena de caracteres debe representarse destacada respecto al texto normal se utiliza el elemento STRONG del siguiente modo: <STRONG>Este texto debe destacarse<\/STRONG>.<\/p>\n

Algunos elementos s\u00f3lo poseen una etiqueta inicial, por ejemplo, <HR> (que significa ‘horizontal rule’ o separador horizontal). En otras, la marca final es opcional (en los p\u00e1rrafos es opcional cerrar con <\/P> ya que queda suficientemente claro que un p\u00e1rrafo termina donde comienza otro o donde aparece la marca inicial de otro elemento que implica un nuevo p\u00e1rrafo).<\/p>\n

<!DOCTYPE HTML PUBLIC \"-\/\/IETF\/\/DTD HTML 2.0\/\/EN\"><HTML>\r\n\r\n<HEAD>\r\n\r\n<TITLE>Documento HTML simple<\/TITLE>\r\n\r\n<\/HEAD>\r\n\r\n<BODY>\r\n\r\n<!-- Esta l\u00ednea es un comentario: no aparecer\u00e1 en el agente de usuario -->\r\n\r\n<H1>Documento simple HTML<\/H1>\r\n\r\n<HR>\r\n\r\nEste documento es un ejemplo de documento escrito en HTML.\r\n\r\n<P>Contiene una <STRONG>lista ordenada<\/STRONG>:\r\n\r\n<P><OL>\r\n\r\n<LI>La declaraci\u00f3n;\r\n\r\n<LI>la cabecera; y\r\n\r\n<LI>el cuerpo del documento.\r\n\r\n<\/OL>\r\n\r\n<HR>\r\n\r\nAdem\u00e1s de varios separadores horizontales, se incluye un v\u00ednculo hipertextual al\r\n\r\n<A href=\"http:\/\/www.uji.es\/spain_wwww.html\">\r\n\r\nMapa de Recursos Internet de Espa\u00f1a\r\n\r\n<\/A>\r\n\r\n y un formulario simple:\r\n\r\n<HR>\r\n\r\n<FORM METHOD=\"GET\" ACTION=\"http:\/\/www.uji.es\/cgi-bin\/test\">\r\n\r\n Seleccione su fruta preferida:\r\n\r\n<BR>\r\n\r\n <SELECT NAME=\"fruta\" SIZE = \"4\">\r\n\r\n \t<OPTION>Peras\r\n\r\n \t<OPTION>Manzanas\r\n\r\n \t<OPTION>Pl\u00e1tanos\r\n\r\n \t<OPTION>Naranjas\r\n\r\n \t<OPTION>Otra\r\n\r\n <\/SELECT>\r\n\r\n<INPUT TYPE=\"reset\" NAME=\"reset\" VALUE=\"Borrar\">\r\n\r\n <INPUT TYPE=\"submit\" NAME=\"submit\" VALUE=\"Enviar\">\r\n\r\n<\/FORM>\r\n\r\n<HR>\r\n\r\n<\/BODY>\r\n\r\n<\/HTML><\/pre>\n
\"Navegador\"<\/a><\/p>\n
Figura 1: Ejemplo de texto HTML y c\u00f3mo aparece en un cliente WWW<\/small><\/p>\n
Esta es la mec\u00e1nica del HTML. Sencilla y potente, sobre todo para lo que ha sido concebida. Su misi\u00f3n fundamental es generar documentos independientes de sistemas y plataformas. El HTML posee niveles (1, 2 y 3, de momento) que en realidad definen momentos de su evoluci\u00f3n. En la actualidad se acaba de publicar la especificaci\u00f3n oficial del HTML nivel 2.0 y se trabaja en la del HTML 3.0.<\/p>\n
La estructura de un documento HTML<\/h2>\n
Un documento HTML puede representarse como un \u00ab\u00e1rbol\u00bb de elementos que incluye:<\/p>\n
– Una declaraci\u00f3n (en el caso del HTML nivel 2.0 es: \u00ab<!DOCTYPE html PUBLIC \u00ab-\/\/IETF\/\/DTD HTML 2.0\/\/EN\u00bb>\u00bb). La declaraci\u00f3n indica a las aplicaciones que ‘leen’ el documento cual es el nivel de HTML empleado. T\u00e9cnicamente, identifica el DTD (‘Definition Type Document’) SGML empleado en el documento. Casi todos los clientes ignoran la declaraci\u00f3n. No as\u00ed otras aplicaciones como analizadores sint\u00e1cticos o ‘parsers’, que comprueban su correcci\u00f3n.<\/p>\n
– Tras la declaraci\u00f3n va el elemento <HTML>, que contiene a su vez:
\n<P><\/p>\n