Paginas Web

  • May 2020
  • PDF

This document was uploaded by user and they confirmed that they have the permission to share it. If you are author or own the copyright of this book, please report to us by using this DMCA report form. Report DMCA


Overview

Download & View Paginas Web as PDF for free.

More details

  • Words: 6,668
  • Pages: 21
Lenguaje de programación para paginas web HTML Indice 1. Introducción 2. Que es el HTML 3. Orígenes del HTML 4. Creación de páginas web con lenguaje HTML 5. Etiquetas de párrafo 6. Como insertar una imagen 7. Conclusión 8. Bibliografía 1. Introducción El HTML no es más que una aplicación del SGML (Standard Generalized Markup Language), un sistema para definir tipos de documentos estructurados y lenguajes de marcas para representar esos mismos documentos. El término HTML se suele referir a ambas cosas, tanto al tipo de documento como al lenguaje de marcas. A medida que nos afianzamos en el manejo de Internet cada uno de nosotros pasa por tres etapas diferentes: Al principio solamente conocemos unas pocas páginas, luego nos damos cuenta que existen buscadores lo cual lo hace más interesante y por último nos damos cuenta que en Internet no solamente se puede ver la información sino que también se puede publicar. ¿y qué otra manera más fácil y más sencilla? Si Internet tiene acceso a todos los rincones del mundo. Para que varias personas se comuniquen es necesarios que éstas hablen un mismo idioma. El lenguaje que utilizan las computadoras que están conectadas a Internet es HTML. A través de esta monografía explicaremos que es HTML, sus orígenes y el proceso de creación de una página web. 2. Que es el HTML El HTML, Hyper Text Markup Language (Lenguaje de marcación de Hipertexto) es el lenguaje de marcas de texto utilizado normalmente en la www (World Wide Web). Fue creado en 1986 por el físico nuclear Tim Berners-Lee; el cual tomo dos herramientas preexistentes: El concepto de Hipertexto (Conocido también como link o ancla) el cual permite conectar dos elementos entre si y el SGML (Lenguaje Estándar de Marcación General) el cual sirve para colocar etiquetas o marcas en un texto que indique como debe verse. HTML no es propiamente un lenguaje de programación como C++, Visual Basic, etc., sino un sistema de etiquetas. HTML no presenta ningún compilador, por lo tanto algún error de sintaxis que se presente éste no lo detectará y se visualizara en la forma como éste lo entienda. El entorno para trabajar HTML es simplemente un procesador de texto, como el que ofrecen los sistemas operativos Windows (Bloc de notas), UNIX (el editor vi o ed) o el que ofrece MS Office (Word). El conjunto de etiquetas que se creen, se deben guardar con la extensión .htm o .html Estos documentos pueden ser mostrados por los visores o “browsers” de paginas Web en Internet, como Netscape Navigator, Mosaic, Opera y Microsoft Internet Explorer. También existe el HTML Dinámico (DHTML), que es una mejora de Microsoft de la versión 4.0 de HTML que le permite crear efectos especiales como, por ejemplo, texto que vuela desde la página palabra por palabra o efectos de transición al estilo de anuncio publicitario giratorio entre página y página. A continuación vamos a hablar un poco de historia: 3. Orígenes del HTML 1986. Publicación de la ISO 8879 que presenta el Standard General Markup Language, origen del HTML. 1989. Tim Berners-Lee, a la sazón en el Centro Europeo de Investigaciones Nucleares presenta su artículo Information Management: A Proposal dedicándose de lleno al desarrollo de un sistema que permitiera el acceso en línea de manera uniforme a la información disponible en muchos recursos distintos, y que pudiese funcionar en máquinas que conectadas por redes basadas en TCP/IP. 1990-1991. Tim Berners-Lee define el HTML como un subconjunto de SGML (Standard Generalized Markup Language), que más tarde se llamará nivel 0; soporta encabezados, listas y anclas. Se crea el nombre World Wide Web. 1991. Tim Berners-Lee introduce el primer visor de HTML, LineMode, que trabaja en modo texto y sólo

en plataformas UNIX. El Centro Europeo de Investigaciones Nucleares realiza la apertura del primer sitio con acceso público de World Wide Web el 17 de mayo (http://info.cern.ch). 1992. Dan Connolly produce la primera Definición de Tipo de Documento (DTD) para el lenguaje, llamada HTML 1.0, agregando a la definición original atributos para modificar el estilo físico del texto. Se distribuye Viola, primer visor gráfico de Web y disponible sólo para X.11. 1993. Un nuevo visor que soporta un mayor nivel, Lynx, es producido por la Universidad de Kansas, si bien lee sólo texto. Aparece Mosaic, desarrollado por el Centro Nacional para Aplicaciones de Supercomputadoras, es el primer visor de Web en entorno gráfico que se hace disponible para computadoras personales, lo que lo hace inmediatamente popular. A fines de año, comienzan a aparecer los primeros artículos sobre WWW en diarios y revistas de circulación masiva. Tim Berners-Lee utiliza el trabajo del año anterior de Connolly para presentar el borrador de la primera norma (RFC -Recommendation for Comments) de HTML para Internet. 1994. La Universidad Técnica de Graz desarrolla un servidor y clientes con mayores prestaciones para HTML, Hyper-G, que no tiene gran éxito. Cello, primer visor de HTML que no requiere TCP/IP presentado por la Escuela de Leyes de la Universidad de Cornell. Dan Connolly y Karen Olson Muldrow redefinen el HTML para el nivel 2.0, que ahora soporta formularios. Un grupo de programadores que desarrollaran el Mosaic producen un nuevo visor de World Wide Web, Netscape (también conocido como Mozilla), que tiene una amplia aceptación entre los usuarios, pero que soporta elementos de programación que equivalen a una degeneración del HTML (tamaños de letra, fondos). Se define un equivalente para los modelos en tres dimensiones del HTML, el VRML (Virtual Reality Modeling Language), que permite moverse dentro de los ambientes definidos. En este mismo año se realizan la Primera y Segunda conferencias internacionales de WWW, en Ginebra y Chicago, respectivamente. Se crea la W3 Organization. 1995. Dave S. Raggett (Hewlett-Packard, Inglaterra) comienza a compilar la normativa del nuevo nivel del lenguaje, el HTML 3.0, cuya principal novedad es el soporte de tablas. Microsoft produce su primer visor de Internet, el cual también utiliza elementos de HTML degenerados. Una nueva versión de Netscape, Navigator 2.0, agrega soporte de encuadres. Sun Microsystems produce el primer visor de World Wide Web con soporte de un lenguaje de programación, HotJava. Se celebran la Tercera y Cuarta conferencias internacionales de WWW, en Boston y Darmstadt respectivamente, y la conferencia de WWW para Asia y el Pacífico en Wagga-Wagga. 1996. Netscape Communications y Microsoft presentan las nuevas versiones de sus visores que soportan gran parte del nivel de HTML 3.0. Aparecen visores no comerciales que implementan la norma completa de HTML 3.0. Se formaliza un nuevo nivel para la modelación en tres dimensiones, VRML 3.0, que permite interactuar con los objetos definidos. Se celebra la Quinta conferencia internacional de WWW en Rocquencourt. 1997. D. Raggett presenta, en enero, la versión normalizada del 3.2. En julio, aparece la versión 4.0, experimental. 1998. HTML 4.0. 4. Creación de páginas web con lenguaje HTML Para crear una página web se pueden utilizar varios programas especializados en esto, como por ejemplo, el Microsoft Front Page o el Macromedia Dreamweaver 3. Otra forma de diseñar un archivo .html, es copiar todo en el Bloc de Notas del Windows, ya que este sencillo programa cumple con un requisito mínimo que es la posibilidad de trabajar con las etiquetas con las que trabaja este lenguaje. A continuación les mostraremos las etiquetas mas comunes que deben aprenderse para hacer una pagina Web. Estructura de los documentos de HTML Si se tiene en cuenta el contenido del documento, todos los documentos de HTML bien escritos comparten una estructura en común. Un documento de HTML empieza con la etiqueta , que es la que encerrará el documento actual. Contiene dos secciones primordiales: la cabecera y el cuerpo encerradas respectivamente por los elementos cabeza y cuerpo. La cabecera puede contener información y siempre contiene el titulo del documento encerrado por el elemento <TITLE>. En el cuerpo se encuentra todo el contenido del documento, ya sea, texto, imágenes, sonidos, hipervínculos, etc. Un documento escrito en HTML contiene las siguientes etiquetas en el siguiente orden: Ejemplo:

<TITLE> Título de mi página de Internet

Primera pagina


Esta es mi primera pagina, aunque todavía es muy sencilla. Como el lenguaje HTML no es difícil, pronto estaremos en condiciones de hacer cosas mas interesantes.

Aquí va un segundo párrafo. Para escribir títulos se usa la etiqueta en donde x es un número. Ejemplo:

Titulo principal

Titulo secundario

Titulo terciario

Titulo cuarto nivel

Titulo quinto
Titulo sexto
Quedaría mas o menos así: Titulo principal Titulo secundario Titulo terciario Titulo cuarto nivel Titulo quinto Titulo sexto 5. Etiquetas de párrafo Para esto se utiliza la etiqueta

y

. Este comando es muy útil debido a que si uno escribe algo (en el editor que se este utilizando) por mucho espacio que uno le de siempre al texto, siempre va a aparecer en la misma línea. Para alinear un párrafo se utiliza el comando y , utilizado dentro de la etiqueta

. Se puede alinear de tres formas diferentes:

Párrafo...

Alinea a la izquierda.

Párrafo...

Realiza un centrado.

Párrafo...

Alinea a la derecha. Cuando nosotros queremos que lo que escribimos aparezca en otra línea utilizamos el comando
. Al terminar de escribir un párrafo es conveniente y estético utilizar el comando para separar un párrafo de otro que es
Etiquetas para darle formato al texto: Para el tamaño y tipo de letra se usa la etiqueta y , que posee tres atributos: tamaño (Size), Tipo de letra o fuente (face) y color Formato: y Sirve para colocar un texto en Negrita. y < /U> Sirve para subrayar un texto <STRIKE> y Sirve para tachar un texto. <STRONG> y Cumple la misma función que y Para colocar un texto en cursiva. <EM>texto con énfasis texto con énfasis citación citación definición definición teclado teclado <SAMP>ejemplo ejemplo SIZE: Regula el tamaño de los caracteres. Ejemplo: texto... .

FACE: Es la fuente que se quiere usar, Arial, Times new Roman, etc. Ejemplo: texto… Color: Regula el color de los caracteres. En principio existen dos posibilidades para definir los colores en HTML: 1. Mediante la especificación de los valores RGB del color deseado en forma hexadecimal (RGB=Red/Green/Blue, valores Rojo/Verde/Azul) 2. Mediante la especificación del nombre del color en ingles Ejemplos: Blanco

Blanco

#FFFFFF

Negro

Negro

#000000

Rojo

Rojo

#FF0000

Verde

Verde

#00FF00

Azul

Azul

#0000FF

Amarillo

Amarillo

#FFFF00

Cyan

Cyan

#00FFFF

Magenta

Magenta

#FF00FF

Si nos decidimos a trabajar con valores hexadecimales, entonces tenemos la libertad de utilizar 16,7 millones de colores. De esta manera trabajamos independientemente de los navegadores Web. Si especificamos el nombre del color, podemos evitar la definición del color en forma hexadecimal que es un poco más difícil. Actualmente están estandarizados tan sólo 16 colores. Existen colores adicionales los cuales son dependientes de los navegadores Web. Primero que todo debe escribir un símbolo #. A continuación siguen las 6 cifras para la definición del color. Las primeras 2 cifras definen el valor rojo, las siguientes 2 el valor verde y las 2 últimas el valor azul. Las cifras hexadecimales son: 0 (corresponde al decimal 0) 1 (corresponde al decimal 1) 2 (corresponde al decimal 2) 3 (corresponde al decimal 3) 4 (corresponde al decimal 4) 5 (corresponde al decimal 5) 6 (corresponde al decimal 6) 7 (corresponde al decimal 7) 8 (corresponde al decimal 8) 9 (corresponde al decimal 9) A (corresponde al decimal 10) B (corresponde al decimal 11) C (corresponde al decimal 12) D (corresponde al decimal 13) E (corresponde al decimal 14) F (corresponde al decimal 15) (mirar el cuadro de la página anterior) Para ponerle color de fondo a la página escribir: con el cual obtendremos un color de fondo gris oscuro. Colocar mal los colores de fondo en nuestras páginas puede provocar problemas. ¿Qué ocurría con los

links o enlaces si colocáramos un fondo de color azul?. Puesto que los links son azules cuando todavía no se han pulsado puede ocurrir que no se puedan leer con claridad o incluso que no se puedan distinguir en absoluto del fondo. Se puede imaginar todavía un caso peor si decidiéramos colocar un fondo demasiado oscuro, tan oscuro que no permitiera distinguir con claridad la información que se presenta en pantalla. Podemos remediar esto eligiendo nosotros mismos el color que queremos que tengan los links o enlaces e incluso el texto, las etiquetas para hacer esto son las siguientes: • text="#número" Para el color del texto. • link="#número" Para el color de los enlaces. • vlink="#número" El color con que aparecerán los enlaces ya visitados. • alink="#número" Color del enlace cuando lo pulsamos. Por lo tanto la etiqueta puede quedar del siguiente modo: Ahora veremos como poner una imagen de fondo. Es muy sencillo, basta con usar la etiqueta: background="localización de la imagen" Esta etiqueta va dentro de la etiqueta . Ejemplo: Con esto lograremos que la imagen dragonball.gif aparezca como fondo en nuestra pagina. Etiquetas META Son usadas para poner meta-información del documento. Esta “directiva” indica al visor de Internet las palabras clave y contenido de nuestra página Web. Muchos de los buscadores de páginas Web de Internet (Yahoo, Lycos, etc...) utilizan el contenido de esta directiva para incluir la página en sus bases de datos. Ejemplo: <META NAME = "Pagina de Pablo" content = "Mi pagina personal de Sailor Moon"> Indica al visor el nombre de la página y sus contenidos principales. <META NAME="Author" content="Pablo Ravioli"> Indica el nombre de la persona que elabora la pagina WEB <META NAME = "keywords" content = "Información de Sailor Moon"> Indica al visor las palabras clave para los buscadores de Internet. Para hacer listas: Las listas se definen de forma muy sencilla: se dice dónde empieza la lista, dónde empieza cada punto y dónde acaba la lista. Las etiquetas que se utilicen en cada caso deben aparecer al principio de línea, o al menos sin texto por delante (sólo espacios o tabulaciones). Las listas pueden ser: Lista desordenada,
    (Unordered List). Lista ordenada,
      (Ordered List). Ejemplos de diferentes tipos de listas: Lista con números romanos:
      1. Manzana
      2. Zanahoria
      3. Lechuga
      4. Tomate
      Manzana Zanahoria Lechuga Tomate

      Lista numerada:
      1. Manzana
      2. Zanahoria
      3. Lechuga
      4. Tomate
      Manzana Zanahoria Lechuga Tomate Lista con puntos:
      • Manzana
      • Zanahoria
      • Lechuga
      • Tomate
      Manzana Zanahoria Lechuga Tomate Lista con círculos:
      • Manzana
      • Zanahoria
      • Lechuga
      • Tomate
      Manzana Zanahoria Lechuga Tomate Lista con cuadrados:
      • Manzana
      • Zanahoria
      • Lechuga
      • Tomate
      Manzana Zanahoria Lechuga Tomate 6. Como insertar una imagen A la hora de crear una página Web podemos introducir gráficos de forma muy sencilla, sólo hay que tener en cuenta que las imágenes deben tener formato Gif o JPEG. La etiqueta utilizada para agregar imágenes a una página Web es y va acompañada de un atributo fundamental "SCR", que indica la ruta donde se encuentra el archivo que contiene la imagen a insertar. Es decir: Supongamos que tenemos la imagen dragonball.gif, que está presente en el mismo directorio en donde está la página y que la queremos insertar. La etiqueta apropiada sería:

      Y el usuario verá en el browser: Para poner la imagen en la izquierda escribir: A la derecha: Y si se quiere poner la imagen en el centro:

      Hiperenlaces, Hyperlinks, Anclas o Links Para definir un enlace es necesario marcar con la etiqueta el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href="URL" para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con , y después cerrar con . Por ejemplo, si queremos que el texto “pulse aquí para visitar la NASA” nos conduzca a la “home page” de la NASA, debemos escribir en nuestro texto HTML: Pulse aquí para visitar a la NASA Que se vería de esta forma: Pulse aquí para visitar a la NASA Si queremos que el texto “Foto” nos lleve a una imagen tenemos que escribir: Foto entonces al hacer clic en el texto Foto nos abrirá la imagen.gif. También se puede ir a otro enlace por medio de una imagen. Lo único que se debe hacer es cambiar el texto por una imagen: Con esto tendremos por resultado que cuando se pase el puntero del mouse por arriba del Logo.jpg (que podría ser el logo del Altavista) y se convierta en una “manito”, al hacer clic nos envíe al buscador Altavista. Si se quiere hacer un link para que nos manden un E-Mail se debe hacer de la siguiente manera: Mandame un Email Entonces cuando se haga clic sobre esta palabra Mandame un Email se abrirá (por defecto) el Microsoft Outlook Express con la dirección del destinatario ya escrita. Caracteres especiales Existe una razón evidente que impide que podamos escribir ciertos símbolos directamente en un texto HTML, como por ejemplo el <: dichos símbolos tienen un significado en HTML, y es necesario diferenciar claramente cuándo poseen ese significado y cuándo queremos que aparezcan literalmente en el documento final. Por ejemplo, como ya sabemos, < indica el comienzo de una directiva, y, por ello, si queremos que aparezca en el texto como tal tendremos que dar un rodeo escribiendo algo que no de lugar a confusión, en este caso <. Los símbolos afectados por esta limitación, y la forma de escribirlos, se detallan a continuación: • < (Menor que): < • >(Mayor que): > • & (símbolo de and, o ampersand): & • " (comillas dobles): " Es decir, que para escribir <"hola”> en nuestro texto HTML original debemos poner <"hola">. El otro caso especial se da cuando en un texto HTML se quiere escribir una eñe, por ejemplo. Existe una forma fácil de hacerlo, que consiste en utilizar códigos como las que antes se presentaron para escribir ciertos símbolos. Los códigos comienzan siempre con el símbolo &, y terminan con un punto y coma (;). Entre medias va un identificador del carácter que queremos que se escriba. Los códigos necesarias en nuestro idioma son: • á: á • é: é • í: í • ó: ó • ú: ú • Á: Á • É: É • Í: Í • Ó: Ó

      • • • • • • • • • •

      Ú: Ú ü: ü Ü: Ü ñ: ñ Ñ: Ñ ¿: ¿ ¡: ¡ ?: ? !: ! @: @

      Por lo tanto la palabra página la podríamos escribir como : página página Otro ejemplo: ¿En qué año estamos? Sería: ¿En qué año estamos? Es por ello que si deseamos que cualquier visor de páginas Web pueda visualizar las letras acentuadas de nuestro documento debemos utilizar sus correspondientes códigos para representarlas. Recuerden que las etiquetas se pueden escribir en mayúsculas o en minúsculas, es lo mismo poner , o . Una vez que terminamos de escribir todo nuestro documento, lo guardamos poniéndole un nombre, y necesariamente lo debemos guardar con la extensión .HTM o .HTML. Para ir visualizando lo que hemos estado haciendo tendríamos que abrir nuestro browser (Netscape o Internet Explorer), hacemos click en la opción FILE o ARCHIVO, estando allí seleccionamos OPEN o ABRIR, le damos BROWSE o EXAMINAR, seleccionamos el archivo y le damos OPEN. Luego le damos ACEPTAR, e inmediatamente se abrirá nuestra pagina. 7. Conclusión Sin HTML no existiría el Internet que hoy conocemos, si no se hubiera inventado, seguiríamos con el aburrido FTP (Protocolo de Transferencia de Ficheros) mandándonos o bajando archivos que a veces ni sabíamos lo que eran, sin tener la posibilidad de visualizarlo antes. Ahora por medio de una página llena de colores y botones por la cual se puede navegar, se puede tener acceso a bastante información y archivos. El lenguaje de HTML abrió una puerta al mundo permitiéndole a las personas expresar sus ideas por medio de páginas y mostrárselas a todas las personas de todos los países. Con el HTML se logró un gran movimiento económico ya que muchísimas empresas publican, venden, y ofrecen sus productos, sus servicios y sus ofertas atrayendo a mayor cantidad de personas. También gracias al HTML nacieron muchas empresas que ofrecen diversos servicios como Yahoo, Altavista, HotMail, Terra, Yupi, Mercadolibre, De Remate, etc. Infinitas son las posibilidades que te brindan las páginas WEB ya que no solo te dan la posibilidad de pasar el tiempo navegando, sino que también hasta se puede comprar un auto por Internet, solo basta con llenar un formulario con los datos personales y el número de tarjeta de crédito y en ocho días lo tenemos en nuestra casa. Todo el universo de Internet se lo debemos al HTML, ya que todas las páginas con las que se compone la World Wide Web están hechas con el lenguaje de programación HTML. 8. Bibliografía Clarín Guía práctica de Internet Buenos Aires Editorial Sol 90 Barcelona 1999 Volumen 14 Páginas 316 a 323 Masanti Luis Alejandro Diseño WEB Ciudad de Buenos Aires

      Ñ Ediciones Abril de 2000 Fascículo 01 Páginas 1 a 9 Sergio Talens Oliag - José Hernández Orallo HTML. Manual de Referencia Editorial Paraninfo 1996 Thomas A. Powell – Mc Craw Hill Manual de Referencia HTML Buenos Aires Osborne 1999 Capitulo 2 Trabajo enviado por: Pablo Ravioli [email protected]

      ¿Qué es WWW? El servicio Web o WWW es una nueva forma de representar la información en Internet basada en páginas. Una página WWW puede incluir tres tipos de información: texto, gráficos e hipertexto. Un hipertexto es texto resaltado que el usuario puede activar para cargar otra página WWW. La diferencia entre un documento hipertexto y un documento normal consiste en que el hipertexto contiene, además de la información, una serie de enlaces o conexiones con otros documentos relacionados, de manera que el lector puede pasar de un tema a otro y volver al documento original en el momento en que le interese. Las principales ventajas del servicio WWW son tres. Primera, que puede combinar texto y gráficos. Segunda, que los hiperenlaces permiten cargar páginas de cualquier otro servidor conectado a Internet, da igual que esté localizado en España o en Australia. Y, tercera, que la creación de páginas WWW es bastante sencilla mediante el lenguaje HTML. El gran éxito de Web no se debe solamente al empleo del hipertexto. Es normal encontrar que los documentos WWW están compuestos de texto y gráficos, y los enlaces con otros documentos pueden ser palabras clave subrayadas o resaltadas en el texto, pero también la totalidad de una imagen o incluso partes de ella (como un mapa "sensible", que permite acceder a información sobre una ciudad haciendo un "click" del ratón sobre un determinado detalle del plano). Las últimas versiones de los programas navegadores (y la mayor rapidez de las telecomunicaciones) permiten integrar en un mismo documento texto, gráficos, sonidos o, incluso animaciones de vídeo. Estos documentos compuestos son los que reciben el nombre de hipermedia. (PC WORLD Junio 1995)

      ¿Qué es HTML? HTML, HyperText Markup Language, es un lenguaje simple utilizado para crear documentos de hipertexto para WWW. No es un lenguaje de descripción de página como Postcript; HTML no permite definir de forma estricta la apariencia de una página, aunque una utilización algo desviada hace que se utilice en ocaciones como un lenguaje de presentación. Además, la presentación de la página es muy dependiente del browser (o programa navegador) utilizado: el mismo documento no produce el mismo resultado en la pantalla si se visualiza con un browser

      en modo línea, Mosaic o Netscape, o sea, HTML se limita a describir la estructura y el contenido de un documento, y no el formato de la página y su apariencia. Una de las claves del éxito de WWW, aparte de lo atractivo de su presentación es sin duda, su organización y coherencia. Todos los documentos WWW comparten un mismo aspecto y una única interfaz, lo que facilita enormemente su manejo por parte de cualquier persona. Esto es posible porque el lenguaje HTML, en que están escritos los documentos, no solo permite establecer hiperenlaces entre diferentes documentos, sino que es un "lenguaje de descripción de página" independiente de la plataforma en que se utilice. Es decir un documento HTML contiene toda la información necesaria sobre su aspecto y su interacción con el usuario, y es luego el browser que utilicemos el responsable de asegurar que el documento tenga un aspecto coherente, independientemente del tipo de estación de trabajo desde donde estemos efectuando la consulta. Su simplicidad es tal que no es necesario utilizar un editor particular. Su gran permisividad exige rigor y atención en la estructura de documentos con el fin de que éstos se visualicen correctamente al margen del contexto y el browser utilizado. Por tanto, como hemos visto, HTML es un lenguaje muy sencillo que nos permite preparar documentos Web insertando en el texto de los mismos una serie de marcas (tags) que controlan los diferentes aspectos de la presentación y comportamiento de sus elementos. Para escribir HTML lo único que se necesita es un editor de texto ASCII, como EDIT del MSDOS o el Bloc de notas de Windows. Las marcas o tags que controlan el comportamiento del documento son fragmentos de texto encerrados entre los signos "mayor que" y "menor que" (<marca>). Existen diferentes tipos de marcas: algunas controlan simplemente la presentación del texto del documento; otras, la forma en que se incluirán en él imágenes; otras, finalmente, los hiperenlaces con documentos o con diferentes partes del mismo documento. Existen una serie de programas que ayudan en la elaboración de documentos HTML, como HTMLED (shareware) o HTML Assistant, ambos para Windows, pero no son imprescindibles para escribir el código. Lo que si es necesario es un programa cliente WWW, tal como Mosaic, o Netscape, para probar el documento a medida que lo vamos desarrollando. Las marcas funcionan muchas veces por parejas, una para indicar el inicio de enlace o formato, y otra para señalar el final. La marca de inicio consiste en una letra o una palabra (por ejemplo, estas son marcas de inicio: , <TITLE>). La marca de final es la misma letra o palabra precedida por la barra inclinada o "slash" (es decir,, ). Existen, no obstante, algunas marcas que no requieren su pareja de cierre, como
      (que fuerza un salto de línea). Es importante señalar que las marcas, en general pueden estar indistintamente en mayúsculas o en minúsculas. Como todo lenguaje, está en constante evolución. La versión en curso es la versión 2.0 pero existe ya un proyecto para la versión 3.0.

      Evolución del lenguaje El lenguaje HTML nace en 1991 de manos de Tim Bernes-Lee del CERN como un sistema hipertexto con el único objetivo de servir como medio de transmisión de información entre físicos de alta energía como parte de la iniciativa WWW. En 1993 Dan Connelly escribe el primer DTD (Document Type Definition) de SGML describiendo el lenguaje. En 1994 el sistema había tenido tal aceptación que la especificación se había quedado ya obsoleta. Por aquel entonces WWW y Mosaic eran casi sinónimos debido a que el browser Mosaic del NCSA (National Center for Supercomputing Applications) era el más extendido debido a las mejoras que incorporaba. Es entonces cuando nace el HTML 2.0 en un draft realizado también por Dan Connelly. El crecimiento exponencial que comienza a sufrir el sistema lleva a organizar la First

      International WWW Conference en Mayo de 1994. El principal avance de 2.0 de HTML es la incorporación de los llamados forms, formularios que permiten que el usuario cliente envie información al servidor y ésta sea recogida y procesada allí. Precisamente con este fin, NCSA presenta la especificación del CGI, Common Gateway Interface, versión 1.0 que define un interfaz entre programas ejecutables y el sistema WWW. Con la incorporación de los forms, aparecen por primera vez campos donde el usuario puede escribir, menús "pull-down" y los denominados "radio-buttons" integrados en páginas WWW. Desde entonces, el lenguaje ha seguido creciendo como algo dinámico, como una lengua humana, algo vivo, siendo modificado sobre todo por las personas que lo utilizan. Asi, una evolución en el lenguaje suele surgir de una propuesta que es adoptada por algunos clientes (browsers). Con el uso se ve si es eficiente y es adoptada y si es así, finalmente se incorpora al estándar. De este modo, a finales de 1993 se comienza a hablar de HTML+ propuesto por Dave Raggett, de HEP Labs, en Bristol que evoluciona a un nuevo draft de Marzo de 1994 para la versión HTML 3.0 incorporando nuevas posibilidades como la realización de tablas complejas, control de proceso de formatos e incorporación de expresiones matemáticas. El testigo pasa del browser Mosaic al Netscape, que incorpora nuevas mejoras. Aunque el equipo de Netscape anuncia desde el principio que su browser trata HTML 3.0, lo cierto es que no se adapta al estándar. Por el momento, el único browser de HTML 3.0 es experimental y recibe el nombre de Arena. El lenguaje de Netscape, el más utilizado en la actualidad, incorpora etiquetas no definidas en HTML 3.0, y tiene algunas diferencias con algunas de las definidas, por ejemplo en la realización de tablas. Por otra parte, hasta la versión 2.0, recién aparecida, no permitía el empleo de expresiones matemáticas (al escribir este artículo el autor aún no ha analizado la versión 2.0). Y como gran idea propone la incorporación de un tipo MIME experimental que permite la actualización dinámica de documentos, del que se hablará en el apartado dedicado a la programación de CGI. Por ello, en "los ambientes" se ha comenzado a denominar este lenguaje de Netscape como NHTML 1.1 para diferenciarlo de la verdadera propuesta de HTML 3.0.

      Clientes y servidores WWW Para poder utilizar el servicio Web se necesitan dos partes. Por un lado, la empresa o institución que quiere facilitar su información tiene que crear páginas WWW, siguiendo el estándar definido por el lenguaje HTML, y ponerlas a disposición del público en Internet, en lo que se llama un servidor WWW. Por otro lado, el usuario que quiere acceder a dichas páginas tiene que utilizar un programa (cliente WWW) que lea las páginas WWW e interprete su siginificado (por ejemplo, un hiperenlace). Estos programas navedores o clientes WWW son los que permiten al ordenador del usuario interpretar el lenguaje HTML. Existen numerosos programas gratuitos, y algunos comerciales, para leer los documentos WWW. El más conocido es probablemente el Mosaic, del Centro Nacional de Aplicaciones de Supercomputación (NCSA) de los Estados Unidos, del que existen versiones para diferentes plataformas (UNIX, Mac, Windows). Otros programas muy difundidos son Netscape (cuya versión beta es de libre disposición y que resulta más rápido que Mosaic), Cello, WinWeb o MacWeb (para Macintosh). Las capacidades de los diferentes navegadores pueden variar de uno a otro programa: aunque la mayor parte permiten el uso de gráficos como enlaces, quedan algunos como Lynx, para DOS, Unis o VMS) que sólo funcionan en modo texto. (PC WORLD Junio 1995)

      Protocolo de direccionamiento de documentos. El URL

      Interconectar documentos por todo el planeta sobreentiende un medio único de identificación en la red Internet. La dirección única de un documento en WWW es llamada URL -Uniform Resource Locator- y se compone de los siguientes elementos: •

      el protocolo de intercambio de datos entre el cliente y el servidor. (HTTP)



      la dirección Internet del servidor que difunde los documentos. Esta dirección es única en toda la red, es la dirección TCP/IP de la máquina. Tiene la forma de una serie de números como 134.158.69.113; al ser estos números difíciles de memorizar, un anuario (DNS) resuelve generalmente la relación entre dirección numérica y nombre simbólico de la máquina/nombre del ámbito (ejemplo: 134.158.48.1 es la dirección de la máquina sioux.in2p3.fr en la que sioux representa el nombre de la máquina y .in2p3.fr el nombre del ámbito);



      el árbol de directorios (el camino) que conduce al documento;



      el nombre del documento que tendrá siempre la extensión .html o .htm.

      Menos frecuentemente esta dirección prodrá completarse con otros elementos: •

      el puerto;



      información de autentificación (username y password);



      argumentos que se pasarán a un programa en la llamada de un enlace ejecutable.

      La sintáxis mínima utilizada para representar el URL de un documento es la siguiente: protocolo://nombre_del_servidor/ cuando no se especifica un nombre de fichero se acudirá al fichero predeterminado del servidor, habitualmente la home page. La sintáxis que se encuentra habitualmente es: protocolo://nombre_del_servidor/directorio/subdirectorio/nombre_del _documento La sintáxis completa es: protocolo://username;password@nombre_del_servidor:puerto/directorio/subdirectorio//nombre _del _documento?argumentos Se observará también en ciertas direcciones la presencia del signo tilde ( ~ ) delante del nombre de un directorio. Se trata de home pages personales, posibilidad ofrecida a los usuarios que tienen una cuenta en la máquina servidor. Ejemplos de URL: http://www.fnac.fr http://www.ra.net/routing.arbiter/NFSNET/NFS.transition.html http://www.in2p3.fr/~dupont/jean.dupont.html

      Etiquetas de HTML Con etiqueta

      Sin etiqueta

      Con etiqueta

      Sin etiqueta

      Con etiqueta

      Sin etiqueta

      ADDRESS

      ADDRESS CITE

      CITE

      B: NEGRITA

      B: NEGRITA

      BIG

      BIG

      CODE

      CODE

      DFN

      DFN

      EM

      EM

      I: ITALICA I: ITALICA KBD

      KBD

      SAMP

      SAMP

      SMALL

      STRONG

      SMALL

      STRONG

      SUB5

      SUB 5

      SUP5

      TT

      TT

      U U VAR Subrayado Subrayado

      SUP 5

      S Tachado

      S Tachado VAR

      Etiquetas Apertura

      Acción

      Cierre

      Atributos


      Comentario.

      Ninguno

      -->



      Hipervínculo.

      HREF, NAME, REL, REV, TITLE





      Formato para dirección del autor.

      Ninguno





      Url del autor; contexto del documento.

      HREF





      Tamaño de la fuente base.

      Ninguno

      NO



      Sonido de fondo.

      SRC, LOOP.

      NO - Internet Explorer



      Aumenta el tamaño.

      Ninguno





      Hace parpadear el texto.

      Ninguno

      Netscape



      Da formato con sangría a un párrafo

      Ninguno





      Cuerpo del documento.

      BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK






      Retorno de línea.

      CLEAR: Se utiliza en combinación con ALIGN de IMAGE.

      NO



      Posición de la leyenda en una tabla.

      ALIGN: TOP/BOTTOM. Internet Explorer: LEFT, RIGHT, CENTER





      Centrar.

      Ninguno





      Formato para citas en Ninguno



      itálicas.

      Formato en tipo código.

      Ninguno





      Definiciones marcadas, para Lista de Definiciones
      .

      Ninguno

      NO


      Formato en itálica.

      Internet Explorer




      Lista de directorio, con elementos marcados con
    1. .

      Ninguno





    2. Lista de Definiciones, con términos marcados con
      Ninguno y definiciones marcadas con
      .





      Términos marcados, para Lista de Definiciones
      .

      Ninguno

      NO

      <EM>

      Formato enfatizado en itálica.

      Ninguno



      <EMBED>

      Sonido de Fondo.

      SRC, WIDTH, HEIGHT, AUTOSTART, LOOP.

      NO - Netscape



      Definición de la fuente.

      SIZE, COLOR. Internet Explorer: FACE.





      Para ingreso de datos del usuario en un ACTION, METHOD formulario.





      Tamaño de letras del 1 al 6.

      HTML 3.0: LEFT, CENTER, RIGHT





      Encabezamiento del documento.

      BASE, TITLE, ISINDEX, NEXTID, META






      Línea horizontal.

      NOSHADE, SIZE, WIDTH, ALIGN. Internet Explorer: COLOR

      NO



      Al principio y al fin de todo documento.

      HEAD, BODY





      Itálica (Cursiva).

      Ninguno





      Cargar imágenes.

      ALIGN, SRC, ALT,

      NO

      ISMAP, WIDTH, HEIGHT, VSPACE, HSPACE

      Define un objeto de ingreso en un formulario.

      TYPE, NAME, VALUE, SIZE, MAXLENGHT, ALIGN, SRC, CHECKED





      Indica que existe un index en el server para el documento.

      Netscape: PROMPT

      NO



      Activa la selección de imágenes para el Ninguno usuario.

      NO



      Formato monoespaciado.

      Ninguno





    3. Ítem de lista.

      Netscape: VALUE, TYPE

      NO



      Listados

      Ninguno. Obsoleto.





      Literal. Como PRE, pero usa letra proporcional.

      Ninguno



      <MARQUEE>

      Marquesina.

      ALIGN, BEHAVIOR, BGCOLOR, DIRECTION, HEIGHT, WIDTH, HSPACE, VSPACE, LOOP, Internet Explorer SCROLLAMOUNT, SCROLLDELAY.

      <MENU>

      Lista menú.

      Ninguno



      <META>

      Metainformación ubicada en HEAD.

      EQUIV, CONTENT, NAME

      NO



      Es un parámetro que identifica al documento.

      NO

      NO



      Elimina los saltos de líneas.

      Ninguno

      NO



        Lista ordenada, con elementos marcados con
      1. .

        TYPE, START, VALUE.