TODO ACERCA DE HTML

video html

Continuacion del lenguaje HTML6

 Marcadores o etiquetas  HTML obligatorios:
 

• Marcador : todos y cada uno de los documentos HTML deben empezar y terminar con este marcador que sirve para indicar que se trata de un documento HTML. En el marcador de cierre es obligatoria la barra inclinada (/HTML).

• Marcadores : los documentos HTML se dividen en dos partes, la cabecera y el cuerpo. Los navegadores Web necesitan distinguir entre cabecera y cuerpo para poder interpretar correctamente los documentos. En general la cabecera del documento (head) incluye la información general sobre el documento. Este marcador tienen su marcador de terminación con la barra inclinada (/HEAD).

•  Marcadores : incluye el contenido real del documento (body o cuerpo). Este marcador tiene también su marcador de terminación con la barra inclinada .

En el caso del marcador body puede ir acompañado, no obligatoriamente, del atributo BGOLOR (Background color)  junto con un numero de expresión hexadecimal que determina un color de fondo plano para la pagina web.  Esta función, como veremos más adelante con el color de los textos está automatizada en la mayoría de editores de páginas web (incluido Netscape Composer).
 
Cabecera del documento

Contiene información general sobre el documento HTML. Es obligatorio incluir el marcador y dentro de la sección

• Marcador : este campo de metainformación sirve para proporcionar información sobre el documento que no pueda ser expresada en el campo anterior. La información se escribe usando pares nombre/valor que pueden ser empleados para dos propósitos:

*  Proporcionar datos al servidor de HTTP para que genere campos de cabecera (como, por ejemplo, la fecha de caducidad de un documento que se actualiza periódicamente). Se emplean atributos del tipo HTTP-EQUIV y para la segunda los del tipo NAME. En ambos casos, el valor se asigna en el campo CONTENT. 
 

* Para que un usuario incluya información adicional sobre el documento, como palabras clave o el nombre del autor. El atributo NAME se refiere a nombres elegidos al azar por el usuario, mientras que HTTP-EQUIV significa que el valor tiene una cabecera equivalente real en el protocolo HTTP. 
 

Etiquetas de caracteres y tipos de letra:
 

• El lenguaje HTML permite asignar formatos de tipos de letra y caracteres. Los navegadores leen estos marcadores lógicos de tipos de letra de los documentos HTML y los interpretan conforme a su capacidades.

• Existen multitud de marcadores para indicar que una palabra o frase tiene una connotación especial y es obligatorio poner los marcadores de cierre al final del texto afectado. Estos son algunos de los más utilizados

 

LENGUAJE HTML	RESULTADO en navegador
texto en negrita	texto en negrita
texto en cursiva o itálica	texto en cursiva o itálica
texto subrayado	texto subrayado
combinando las tres anteriores	combinando las tres anteriores
fuente tipo de máquina de escribir	fuente tipo de máquina de escribir

  Presentación de textos en color:
 

• En tus documentos puedes especificar el color del texto. Se utiliza una notación basada en los colores RGB empleados por todos lo monitores de vídeo en color. Cada color se especifica utilizando tres números en el rango 0 a 255. La ausencia total de color, el negro se expresa con 000 y la saturación de los tres colores, el blanco como 255255255. Entre ambos se definen los demás colores. Para establecer en HTML color del texto debes convertir a hexadecimal cada uno de estos números. NO ASUSTARSE!!!! En todos los programas de edición de páginas web (incluido Netscape) existe una herramienta para escoger el color del texto (y el del fondo de la página) sin necesidad de estos cálculos. Esta es una de las funciones que puede resultar engorrosa si se utiliza sólo el bloc de notas para realizar paginas web. En cualquier caso existen publicadas en internet tablas de colores y códigos en http://www.reednews.co.uk.colours.html

  Marcador

• : establece con el atributo COLOR el color del texto que indiques.

Marcador

: indica que vamos a crear una tabla.

 

• Atributo BORDER: presenta líneas de separación de celdas así como su ancho en pixels
• Atributo CAPTION: título de la tabla.
• Atributo WIDTH: anchura de la tabla.

 

PIXELS	Pixeles en pantalla.
RELATIVE	Porcentaje de la anchura de página (%)

 Atributo ALIGN en

: tipo de alineación

 

 

JUSTIFY	Ajustar al ancho de la página.
LEFT	Izquierda.
RIGHT	Derecha.

          Marcador              : cabecera de la tabla. Aparecen en negrita.

• Marcador : indica el final de una fila.

• Marcador              : indica un dato de la tabla, es decir una celda.

• Atributo ALIGN en              , y              : tipo de alineación  

CENTER	Centro.
LEFT	Izquierda.
RIGHT	Derecha.

 
  En definitiva, el código del principio de este apartado sobre creación de tablas tendría este resultado:
 
 

Título de la tabla
Cabecera columna 1	Cabecera columna 2
Fila 1, columna 1	Fila 1, columna 2
Fila 2, columna 1	Fila 2, columna 2

    Adición de imágenes internas:
 
Son las imágenes que aparecen cuando se visualiza el documento HTML. Los navegadores sólo pueden visualizar dos tipos de imágenes:
 

• Imágenes en formato GIF o formato de intercambio de gráficos.
• Imágenes en formato JPG o Joint Photographic Expert Group.

El resto de imágenes (tif, bmp, etc.) se tratan como imágenes externas y sólo se pueden visualizar con las aplicaciones auxiliares o los plug-ins de los navegadores
 

Además de que las imágenes tengan que ser de este tipo, es aconsejable que no tengan un tamaño superior a 20-25K para evitar que tarden mucho en cargarse y la página web sea lo suficientemene "ágil". Para ello, es muy importante que la resolución de estas imágenes no sea superior a 75ppp que es la resolución de la pantalla.  Es inútil darles una mayor resolución (que se aplica en la edición en papel) porque sólo van a ocuparnos mayor espacio y no por ello se van a poder ver mejor en el monitor.

• Marcador : permite incluir una imagen en el documento. No necesita terminador.

•  
  • Atributo SRC: permite especificar el archivo que contiene la imagen.
  • Atributo ALT: texto alternativo para cuando no se pueda visualizar la imagen.
  • Atributo ALIGN: alineación física de la imagen.

MIDDLE	Alineación centro.
TOP	Alineación superior.
BOTTOM	Alineación inferior.
LEFT	Alineación izquierda.
RIGHT	Alineación derecha.

• • Atributos HEIGHT Y WIDTH: tamaño de las imágenes en el documento (normalemene en pixeles).
  • Atributo BORDER: permite señalar si se quiere enmarcar la imagen o no, así como el grosor de dicho marco

 Un ejemplo de inclusión de imágen en código html incuyendo todos los atributos  mencionados sería:

Esta línea de codigo indica que insertamos una imagen tipo jpg llamada prueba, de 20x40 pixeles, sin marco, alineada a la derecha y con un texto alternativo (el que aparece cuando no se quieren ver imágenes en el navegador o cuando se están cargando). 
 

prueba de color azul

prueba de color azul

  Atributo TEXT: en el marcador establece el color por defecto del texto de todo el documento.

  Creación de tablas

Una tabla esta compuesta por filas y columnas de información. No solo permiten tabular la información sino mantener un mayor control sobre lo que se visualizará en la pantalla. La intersección de una fila y una columna genera una celda. 

        

Continuacion del lenguaje HTML5

Elaboración de páginas web: Lenguaje HTML
Arquitectura cliente/servidor -Introducción al lenguaje HTML - Principales elementos del lenguaje html - Creación de documentos  HTML - Cabecera del documento - Creación de encabezados, estilos y párrafos - Creación de enlaces y vínculos - Creación de listas - Creación de tablas - Añadir imágenes

Arquitectura cliente/servidor

Antes de comenzar a explicar la estructura de las páginas web y el lenguaje html, es importante tener claro en que consiste la arquitectura cliente/servidor en la que se basan tanto las redes locales como la propia Internet

Pensar en una red clásica de pescadores es bastante gráfico para comprender la estructura de la Red. En ella, se pueden
diferenciar a simple vista dos elementos que se repiten: los nudos y los segmentos de malla que unen los distintos nudos.
 
Al hablar de Internet estamos hablando también de una red y los elementos que componen esa red son los nodos y los enlaces. La estructura de Internet no es tan regular como una red de pescadores, si bien se pretende tener conectividad entre todos los nodos, es decir, lo ideal es tener la posibilidad de encontrar al menos dos rutas o caminos (path en inglés) entre dos nodos cualesquiera. Uno de ellos será el nodo origen  de los mensajes mientras que el otro será el nodo destino.

Los nodos no son más que ordenadores dedicados a encaminar los paquetes hacia su destino, eligiendo el enlace más
adecuado en cada momento. Estos nodos reciben el nombre de enrutadores (ROUTERS), y serían algunos de los nudos de
la parte interna/central de la red de pesca. Igualmente, nosotr@s al conectarnos utilizamos un ordenador, que si bien también
es un nodo de la red se le denomina HOST (tu ordenador).
 
Los enlaces son las conexiones físicas entre nodos y están formados por un conjunto de circuitos de datos en forma de hilos
telefónicos, fibras ópticas, microondas y demás soportes propios de Telecomunicaciones. La información, se divide en trozos
de un número determinado de caracteres. A cada trozo de estos, denominado paquete, se le asocia información de
enrutamiento, y se envía por un enlace. Es decir, cuando se establece una conexión internet, tu equipo queda conectado por un enlace a la red.

Existen una serie de ordenadores  que están conectados a la red con el objeto de ofrecer y proporcionar alguna clase de
servicio a todo aquel que se lo pida. Estos ordenadores son también nodos de la red y se denominan servidores
(SERVERS).

Para poder acceder a los recursos que ofrece un servidor se necesita un tipo de programa específico, denominado programa
cliente, que debes ejecutar en tu ordenador y que es el encargado de mantener el diálogo con el programa servidor. Se dice
que estamos en una arquitectura cliente / servidor, en la que el programa servidor corre en el ordenador que ofrece algúnrecurs o (server) y el programa cliente en el ordenador de aquél que lo reclama (host). Los programas navegadores (Netscape, Explorer) son clientes que piden páginas a diversos servidores que existen en la red.
 

Introducción al HTML
 
Cuando tu programa navegador (cliente) pide una página web al servidor, éste le envía un fichero de texto (con extensión htm o html) en lenguaje html que tu programa (netscape o explorer) se encarga de "traducir"  para que puedas visualizar correctamente en el navegador la página web solicitada incluyendo texto, fondos, gráficos, etc.

El HTML (HipertText Markup Language) ó Lenguaje de enlaces hipertexto es un sistema  que se encarga de 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.

Como cualquier página web está soportada por un fichero de texto,  se pueden elaborar, editar o modificar directamente con el bloc de notas o el wordpad de Windows 95, aunque existen programas editores de páginas web  a la venta como HotDog ó Front Page y programas gratuitos de edición básica como Netscape Composer, que permiten editarlas con algunas funciones  automatizadas a través de botones y menús.
 
 
Elementos del lenguaje HTML
 

Caracteres :

• Cualquier cadena de caracteres imprimibles que no represente un marcado se representa literalmente, aunque los espacios y tabuladores se reducen a un solo carácter cuando no están dentro de un bloque preformateado.

 
Marcadores, marcas o etiquetas (tags) :
 

• Los marcadores delimitan elementos de un documento como cabeceras, párrafos, etc. La mayoría de los marcadores constan de una marca inicial  < ...> , que da el nombre y atributos del elemento, seguida del contenido ó secuencia de caracteres y una marca final.

• Las marcas iniciales se escriben entre los símbolos "<" y ">" (menor y mayor) y las finales entre "Contenido, indica que "Contenido" es una cabecera de nivel uno.

•  Algunos elementos sólo tienen una marca inicial (por ejemplo la marca que representa una línea horizontal) y otros, aunque disponen de ambas, se suelen expresar sólo con la inicial.

  Nombres de etiquetas:
 

• Los nombres consisten en una letra seguida de letras, dígitos, puntos o guiones. Los ejemplos H1 y HR anteriores son ejemplos de nombres de etiquetas. La longitud de un nombre esta limitada a 72 caracteres en la definición del HTML. Los nombres de elementos y atributos no distinguen entre mayúsculas y minúsculas, pero los nombres de entidades (la representación alternativa de los caracteres) sí.

• En las marcas, el nombre del elemento debe comenzar inmediatamente después del <.

 
Atributos:
 

• Cuando una marca inicial admite atributos, éstos se escriben a continuación del nombre del elemento. Generalmente los atributos tienen la forma nombre, signo igual, valor del atributo aunque en algunos casos basta con el nombre del atributo. Se pueden poner espacios en blanco antes y después del signo igual.

• El valor de un atributo puede ser una cadena de caracteres entre comillas (simples o dobles) que no contenga el símbolo de fin de marca ">" o un nombre como los definidos en el apartado anterior. Por ejemplo, en , img src es el nombre de la marca  que se refiere a insertar una imagen en la página web; y "foto.gif" es el atributo que hace referencia al fichero específico  de imagen que queremos incluir.

Comentarios:
 

• Para incluir comentarios en HTML se emplea la declaración de comentarios. Una declaración de comentarios comienza con . Cada comentario comienza con -- e incluye todo el texto hasta la siguiente aparición de -- . Dentro de una declaración de comentarios, se pueden poner espacios en blanco después de cada uno de ellos, pero no antes del primero. Toda la declaración del comentario se ignora.  En páginas web complejas, con abundante código html, se utilizan estos comentarios para señalar partes de la página web que  sirvan de orientación para ubicarse dentro del documento. Por ejemplo, en está señalando una parte de la página web en la que empieza el  grueso del texto de la página.

•  Esta etiqueta se visualiza dentro del código html pero no tiene una traducción hacia el formato final. Es decir, no se visualiza en el navegador cliente y sólo se puede ver si utilizamos la opción Ver/Origen de la Página (en Netscape)

 
Creación de documentos HTML
 

• Los documentos HTML son archivos de texto legibles ASCII con códigos de composición especiales embebidos  o incorporados en el texto. Esto significa que los archivos HTML contienen letras, números, signos de puntuación, etc., más los códigos de composición HTML.  Insistimos, se pueden leer o modificar directamente desde el bloc de notas.

• Aunque no es obligatorio, es muy útil utilizar la extensión .HTM al archivar el documento HTML desde el bloc de notas. Así podrás saber luego de que tipo de documento se trata. Si utilizas un procesador de texto normal debes utilizar la opción Guardar como texto ASCII.

Aspecto de documentos HTML:
 

• Lo que distingue a un archivo HTML de cualquier otro archivo de texto es la presencia de códigos de composición, denominados marcadores HTML. Estos códigos se incluyen en el documento y sirve para controlar el formato y la presentación del documento final. Los códigos también sirven para crear hipervínculos con otros documentos.

• Los códigos de composición se acotan con unos caracteres especiales, que permiten diferenciarlos del texto del documento propiamente dicho. Estos símbolos son los corchetes angulares < y >. Estos códigos no distinguen entre mayúsculas y minúsculas aunque la mayoría de los autores utilizan mayúsculas para distinguirlos del resto del texto.

• Los distintos navegadores muestran sus documentos de formas distintas: varía el color, el tipo de fuente, el tamaño, etc. Por lo tanto debes pensar en tu documento como una entidad lógica y no física, reconociendo que el aspecto físico puede variar de un visor a otro y de un PC a otro. Por ejemplo, si introduces tipos de letra especiales (que se salgan de los corrientes que tienen todos los PCs,  en Arial, Courier, Times o Helvetica) dentro de tu página web, cuando alguien la "vea" en Internet, visualizará esos tipos de letra si están instalados en su PC, si no los verá con el tipo de letra que tenga cargado por defecto en su navegador.

Continuacion del lenguaje HTML4

GRÁFICOS

Para incluir un gráfico en un documento HTML se utiliza la directiva . En dicha directiva debe incluirse un parámetro src="URL", con el cual indicamos dónde está el fichero con el gráfico concreto que queremos para nuestro documento. Esto pone a nuestra disposición una gran flexibilidad, ya que podemos complementar el contenido de nuestro documento tanto con gráficos que se encuentren disponibles en nuestro servidor de WWW como con una foto situada en un servidor de la NASA o del Ministerio de Cultura, por ejemplo, sin que el lector final tenga por qué apreciar ninguna diferencia.

Existe alguna limitación respecto a los formatos gráficos que los programas lectores de HTML puede interpretar sin problemas. El formato fundamental es el GIF, que cualquier programa con capacidades gráficas debería poder mostrar directamente en nuestro texto (Mosaic y Netscape pueden hacerlo). Si utilizamos otro formato diferente, lo más probable es que cuando un lector esté accediendo al documento, el programa no comprenda ese formato y se tenga que solicitar la ayuda de otro programa, con lo cual al final el gráfico no se insertará en el lugar estratégico de nuestro documento, sino que aparecerá en otra ventana diferente.

Hay un parámetro optativo de la directiva que sirve para proponer un texto alternativo a un gráfico. Este texto aparecerá cuando se esté usando para leer el HTML un programa sin capacidades gráficas (por ejemplo Lynx, que sólo trabaja con texto). Se trata de alt="texto". Conviene utilizarlo cuando los gráficos sirven como origen a hiperenlaces, porque si no los programas sin capacidades gráficas no podrían mostrar los enlaces que nosostros queremos.

Como ocurría antes con los enlaces, por lo general no es necesario escribir el URL completo, sino que basta con dar la mínima información. Por ejemplo, para colocar en este punto del documento un monigote que está en el mismo subdirectorio que este manual, en el fichero monigote.gif, escribiremos:

CARACTERES ESPECIALES

Durante todo este manual hemos hecho una pequeña trampa a la hora de explicar las directivas y poner ejemplos, para facilitar la comprensión de las ideas fundamentales sobre HTML. Dicha trampa ha consistido en ocultar ciertas  exigencias de HTML respecto al uso de caracteres especiales, denominación que, para nuestra desgracia como hispanohablantes, incluye a las vocales acentuadas y a la letra eñe. Existen también ciertas limitaciones relativas al uso de ciertos símbolos que significan algo en HTML, como el de menor que (<) o el signo inglés de and (llamado ampersand: &).

Trataremos primero el caso más sencillo. 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 <"> en nuestro texto HTML original debemos poner <">.

El otro caso especial se da cuando en un texto HTML se quiere escribir una eñe, por ejemplo. Existen dos formas de hacerlo. La primera, que es a la que obliga el estándar de HTML, consiste en utilizar entidades, es decir, palabrejas como las que antes se presentaron para escribir ciertos símbolos. Las entidades 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. Las entidades necesarias en nuestro idioma son:   á: á

• é: é
• í: í
• ó: ó
• ú: ú
• Á: Á
• É: É
• Í: Í
• Ó: Ó
• Ú: Ú
• ü: ü
• Ü: Ü
• ñ: ñ
• Ñ: Ñ
• ¿: ¿
• ¡: ¡

Como puede verse, las vocales acentuadas se identifican añadiendo el sufijo acute a la vocal sin acentuar (puesto que se trata de un acento agudo). Para la u con diéresis y la eñe se usan uml tras una u y tilde detrás una ene, respectivamente. La equivalencia de los signos de abrir interrogación y exclamación es algo más oscura: a falta de una denominación más evidente, tenemos que usar el valor numérico de dichos caracteres en el código estándar latin1 (ISO-8859-1). Esto se puede hacer con cualquier otro carácter del código latin1, que es el código de caracteres básico en HTML, escribiendo &#numero;.

La segunda manera, que sin duda es más cómoda, consiste en no preocuparse por esta limitación y escribir literalmente los caracteres afectados. A pesar de que este método suele funcionar en las conexiones WWW directas (porque el protocolo HTTP, que transporta el HTML por los vericuetos de Internet, requiere un canal de 8 bits), no tiene por qué funcionar bien cuando los documentos HTML se envían por correo electrónico, por ejemplo. Por tanto, y a pesar de los inconvenientes, es absolutamente recomendable respetar la norma especificada en HTML.

En cualquier caso, no resulta muy complicado escribir un programa que traduzca todas las apariciones de los caracteres especiales por sus correspondientes entidades HTML, o viceversa. Con un programa así, uno puede escribir los documentos sin preocuparse por estos problemas, y luego traducir a HTML correcto. Al final de este manual encontrará un enlace a un programita en C que hace precisamente eso.

Volviendo al reconocimiento de culpa que antes de hizo por haber ocultado estos detallitos, debemos decir que muchos de los ejemplos que antes se pusieron no eran totalmente correctos. Por ejemplo, cuando se escribió:

Animal de cuatro patas que maúlla y se lleva muy mal con el perro.

 

Continuacion del lenguaje HTML3

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).

Podemos recurrir a tres tipos distintos de listas, cada una con una presentación diferente: no numeradas, numeradas y listas de definiciones (glosarios).

Las listas se pueden anidar, es decir, en el lugar donde debería ir uno de los términos de la lista se pone una nueva lista, que por supuesto no tiene porqué ser del mismo tipo.

Esto es una lista no numerada:

• Tomates

• Tomates
• Zanahorias
• Puerros

Esto una lista numerada:

1. Miguel Induráin

1. Miguel Induráin
2. Tony Rominger
3. Eugeni Berzin

Un glosario está formado por una serie de parejas de término (marcado con al principio de línea) y definición (con ). Por ejemplo, podríamos crear un pequeño diccionario con los términos perro, gato y pescadilla, de la siguiente manera:). Por ejemplo, podríamos crear un pequeño diccionario con los términos perro, gato y pescadilla, de la siguiente manera:

Perro (n. masc.)

Perro (n. masc.)

Animal de cuatro patas que ladra.

Gato (n. masc.)

Animal de cuatro patas que maúlla y se lleva muy mal con el perro.

Pescadilla (n. fem.)

Animal que vive en el mar y está recubierto de escamas.

VARIOS

La directiva sitúa en el documento una línea horizontal de separación. En este documento, por ejemplo, se han utilizado líneas horizontales para separar las diferentes secciones:

---

Para poner un comentario en un documento HTML, es decir, una aclaración que no aparece en la presentación final del documento, se encierra el texto que formará el comentario entre los símbolos . Por ejemplo, un caso típico podría ser:

---

ENLACES Y GRÁFICOS

INTRODUCCIÓN

Además de los muchos estilos y capacidades de presentación que nos ofrece HTML para estructurar el documento en sí, disponemos de varias directivas que nos permiten definir relaciones entre diferentes documentos y estructurar todo un conjunto de documentos para crear una unidad lógica. La facilidad para definir este tipo de enlaces es una de las razones de la potencia y versatilidad de HTML. Por la similitud de tratamiento que tienen los enlaces y los gráficos, tocaremos también en esta sección cómo pueden incluirse estos últimos en un documento.

Los enlaces en HTML se expresan rodeando con la directiva el objeto (que puede ser un fragmento de texto o un gráfico) que vaya a servir como anclaje para el enlace. Por ejemplo, si marcamos con un gráfico, cuando en el documento final se pulse con el ratón sobre dicho gráfico saltaremos al objeto referenciado en el enlace: otro documento, un vídeo musical, o un servidor de información meteorológica.un gráfico, cuando en el documento final se pulse con el ratón sobre dicho gráfico saltaremos al objeto referenciado en el enlace: otro documento, un vídeo musical, o un servidor de información meteorológica.

QUÉ ES UN URL

Para especificar de manera uniforme el objeto al que apunta nuestro enlace, se utiliza una forma estandarizada que se denomina URL (Uniform Resource Locator, es decir, Localizador Uniforme de Recursos ). Un URL está formado de la siguiente manera: esquema://maquina/ruta (en realidad, como se verá dentro de un momento, la barra / puede considerarse parte de la ruta).

El esquema es un nombre que identifica el tipo de servicio que va a proporcionarse en el destino del enlace. La razón de esta aparente complicación es que el WWW pretende unificar el acceso a servicios de información que previamente eran incompatibles entre sí, como ftp, gopher o telnet. El esquema más utilizado es http, correspondiente al propio WWW (es decir, que cualquier referencia a un documento HTML debería comenzar con http://). Otros esquemas muy frecuentes son ftp, telnet, gopher o wais.

La máquina y la ruta sirven para localizar el objeto al que apunta nuestro enlace. La máquina es la identificación del servidor en el cual está situado el objeto al que apunta el enlace. Puede ser simplemente el nombre de un ordenador (como www.etsit.upm.es) o también un nombre y un puerto (por ejemplo www.etsit.upm.es:8000).

La ruta es el nombre del fichero que contiene el documento en concreto, incluyendo el nombre del subdirectorio en el que se encuentra. Los diferentes nombres que constituyan la ruta completa al archivo se deben separar con la barra / (inclinada hacia la derecha), tal y como se hace en el sistema operativo UNIX (y al revés que en MS-DOS). La razón de este convenio es precisamente que la mayor parte de los servidores de WWW que hay en Internet son ordenadores basados en UNIX, debido a la gran superioridad tecnológica de este sistema sobre MS-DOS. Esto se nota también en que por lo general los nombres de los ficheros no tienen muchas limitaciones: pueden ser casi tan largos como queramos, contener varios puntos, etc. Por ejemplo, el nombre de cierto fichero situado en un servidor podría ser /info/documentos/ciencia/fisica/relatividad.html. Debemos tener en cuenta que en UNIX las mayúsculas y las minúsculas son distintas en los nombres de los ficheros: no es igual FICHERO que fichero.

Conviene que nos detengamos momentáneamente en la estructuración habitual de los ficheros en un servidor de WWW. Para empezar, siempre hay una página de bienvenida (home page) que podría compararse con la portada de un periódico o revista: si no sabemos exactamente qué es lo que buscamos, o no sabemos dónde encontrarlo, la portada es lo primero que vemos. Para acceder a la home page de cualquier servidor de WWW, basta con escribir una barra en el lugar de la ruta (es decir, reclamamos al servidor el directorio raíz). Por ejemplo, para acceder a la página de bienvenida de la ETSIT, hay que dirigirse a http://www.etsit.upm.es/, y para ir a la de la NASA habría que contactar con http://www.nasa.gov/.

El resto de la información que se puede encontrar en un servidor de WWW se distribuye a partir de ese directorio raíz en distintos subdirectorios y archivos. Un convenio muy habitual relativo al nombre de los ficheros es hacer que los archivos que contengan documentos HTML terminen en .html.

ENLACES

Con lo que ya hemos dicho, podemos abordar sin problemas el asunto que originalmente nos ocupaba: cómo se introducen enlaces en un documento HTML. Para definir un enlace es necesario marcar con la directiva 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 .

Continuacion del lenguaje HTML2

CÓMO ESPECIFICAR EFECTOS DEL TEXTO

La mayoría de los efectos se especifican de la misma forma: rodeando el texto que se quiere marcar entre dos etiquetas o directivas (tags, en inglés), que definen el efecto o unidad lógica que se desea. Las etiquetas están formadas por determinados códigos metidos entre los signos < y >, y con la barra / cuando se trata de la segunda etiqueta de un efecto (la de cierre). Por ejemplo: para abrir y para cerrar. Ciertas directivas sólo se ponen una vez en el lugar del texto donde queramos que aparezca el efecto concreto. Esto es lo que ocurre, por ejemplo, cuando queremos poner un gráfico, caso en el que se usa algo parecido a (más adelante ya veremos la directiva concreta que se utiliza).

A veces es necesario ofrecer datos adicionales en una directiva. Por ejemplo, cuando se define un hiperenlace hay que especificar su destino. Para ello se incluyen parámetros en la directiva inicial (la de apertura), de la siguiente forma: . La directiva de cierre, caso de ser necesaria, queda como antes: .

Más adelante en el presente documento se muestra el efecto de las directivas más usadas en la creación de un documento HTML. Para cada una de ellas, primero se muestra el texto fuente, y bajo éste, el efecto que produce.

ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML

Un documento HTML comienza con la etiqueta , y termina con . Dentro del documento (entre las etiquetas de principio y fin de html), hay dos zonas bien diferenciadas: el encabezamiento, delimitado por y , que sirve para definir diversos valores válidos en todo el documento; y el cuerpo, delimitado por y , donde reside la información del documento.

La única utilidad del encabezamiento en la que nos detendremos es la directiva

en minúsculas. Obsérverse que el título que encabeza este texto se ha escrito con mayúsculas, para distinguirlo del título global del documento.

El cuerpo de un documento HTML contiene el texto que, con la presentación y los efectos que se decidan, se presentará ante el hiperlector. Dentro del cuerpo son aplicables todos los efectos que se van a mencionar en el resto de esta guía. Dichos efectos se especifican exclusivamente a través de directivas. Esto quiere decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el fichero fuente no tienen ningún efecto a la hora de la presentación final del documento. Por ejemplo, escribiendo:

Estaspalabrasforman          unafrase.

producimos exactamente lo mismo que con:

Estas palabras forman una frase.

A la hora de la verdad lo que se ve es:

Estas palabras forman una frase.

En resumen, la estructura básica de un documento HTML queda de la forma siguiente:

Texto del documento, menciones a gráficos, enlaces, etc.

ESTILOS Y EFECTOS BÁSICOS

Como ya hemos dicho, la estructura lógica del texto y los diferentes efectos que se le apliquen se especifican mediante directivas. En este punto vamos a repasar algunas de las más importantes. En cada uno de los casos que veremos, primero se presenta el texto original HTML, es decir, lo que nosotros editamos, con las directivas situadas en los lugares adecuados; y después se presenta el efecto que dicho texto fuente produce una vez que se interpreta y se representa con el programa adecuado.

Mediante los títulos, en sus diferentes niveles de importancia, podemos definir el esqueleto del documento, su estructura básica.

Mucha importancia

Mucha importancia

Menos importancia

Menos importancia

Mucha menos importancia

Mucha menos importancia

ATRIBUTOS DEL TEXTO

Mediante estos atributos determinamos el estilo y el tipo de letra que tendrá la presentación del documento final.

El primero en el que nos deberíamos detener es el texto normal entendiendo como tal el que no tiene ninguna característica especial. Para definir un párrafo como normal no es necesario poner ninguna etiqueta. Lo único que hay que tener en cuenta, como ya se ha dicho antes, es que al presentar el documento se hace caso omiso de los espacios, tabulaciones y retornos de carro que se encuentren en el texto fuente. Por ello cuando se quiera forzar un final de línea es necesario utilizar dos directivas especiales:

para marcar un fin de párrafo, y
para un único retorno de carro. La diferencia entre ambas es que la separación de líneas que provoca

es algo mayor que la de
, para que los párrafos se distingan bien entre sí. Las dos directivas mencionadas se sitúan en el punto en que queremos poner la separación. Por ejemplo:

Este será un texto normal (párrafo 1, línea 1).
El primer párrafo estará formado por 2 líneas (párrafo 1, línea 2).

Este ya es el segundo párrafo (párrafo 2, línea 1).

Este será un texto normal (párrafo 1, línea 1).
El primer párrafo estará formado por 2 líneas (párrafo 1, línea 2).

Este ya es el segundo párrafo (párrafo 2, línea 1).

Por supuesto, estas dos etiquetas se puede aplicar donde queramos, no sólo en el texto normal.

El texto preformateado (etiqueta ) se aplica cuando queremos que en la presentación final del documento se respeten los espacios y retornos de carro que hayamos puesto en el texto fuente. Además se utilizará un tipo de letra de espaciado fijo, parecido al de una máquina de escribir, más pequeño que el del texto normal. Este estilo de texto puede ser adecuado, por ejemplo, para una tabla numérica sencilla:

Texto preformateado---------------------|  1 |  2 |  3 |  4 ||  5 |  6 |  7 |  8 ||  9 | 10 | 11 | 12 |---------------------Texto preformateado---------------------|  1 |  2 |  3 |  4 ||  5 |  6 |  7 |  8 ||  9 | 10 | 11 | 12 |---------------------

Para hacer una cita textual dentro de nuestro documento, se puede utilizar la directiva

Muchos años después, frente al pelotón de fusilamiento,el coronel Aureliano Buendía había de recordar aquella tarde remota

en que su padre lo llevó a conocer el hielo.

(Gabriel García Márquez, Cien años de soledad)

Muchos años después, frente al pelotón de fusilamiento, el coronel Aureliano Buendía

 había de recordar aquella tarde remota en que su padre lo llevó a conocer el hielo.
(Gabriel García Márquez, Cien años de soledad)

Las direcciones de correo electrónico se suelen marcar con esta directiva:

Dirección: [e-mail]

Dirección: [e-mail]

Se pueden dar también los atributos más tradicionales: negrita y cursiva:

Esto en negrita y esto en cursiva

Esto en negrita y esto en cursiva

Se puede utilizar un tipo de letra similar al de una máquina de escribir:

Máquina de escribir

Máquina de escribir

Para centrar texto (o, en general, cualquier cosa: un gráfico, por ejemplo) se usa la directiva Verde que te quiero verde

Verde que te quiero verde

Continuacion del lenguaje HTML1

Entidades HTML

Los caracteres especiales como signo de puntuación, letras con tilde o diéresis, o símbolos del lenguaje; se deben convertir en entidad HTML para mostrarse en un navegador. La siguiente es una lista de caracteres españoles y su correspondiente entidad HTML:

Caracter   Entidad HTML

  á        á

  é        é

  í        í

  ó        ó

  ú        ú

  ñ        ñ

  Ñ        Ñ

 

Lenguaje html

¿Qué es HTML?

HTML, siglas de HyperText Markup Language (Lenguaje de Marcas de Hipertexto), es el lenguaje de marcado predominante para la construcción de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. HTML se escribe en forma de "etiquetas", rodeadas por corchetes angulares (). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo Javascript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.

HTML también es usado para referirse al contenido del tipo de MIME text/html o todavía más ampliamente como un término genérico para el HTML, ya sea en forma descendida del XML (como XHTML 1.0 y posteriores) o en forma descendida directamente de SGML (como HTML 4.01 y anteriores).

Por convención, los archivos de formato HTML usan la extensión .htm o .html.

Marcado HTML

HTML consta de varios componentes vitales, incluyendo elementos y sus atributos, tipos de data, y la declaración de tipo de documento.

Elementos

Los elementos son la estructura básica de HTML. Los elementos tienen dos propiedades básicas: atributos y contenido. Cada atributo y contenido tiene ciertas restricciones para que se considere válido al documento HTML. Un elemento generalmente tiene una etiqueta de inicio (p.ej. ) y una etiqueta de cierre (p.ej. ). Los atributos del elemento están contenidos en la etiqueta de inicio y el contenido está ubicado entre las dos etiquetas (p.ej. Contenido). Algunos elementos, tales como
, no tienen contenido ni llevan una etiqueta de cierre. Debajo se listan varios tipos de elementos de marcado usados en HTML.

 

Estructura general de una línea de código en el lenguaje de etiquetas HTML

El marcado estructural describe el propósito del texto. Por ejemplo,

establece a "Golf" como un encabezamiento de segundo nivel, el cual se mostraría en un navegador de una manera similar al título "Marcado HTML" al principio de esta sección. El marcado estructural no define cómo se verá el elemento, pero la mayoría de los navegadores web han estandarizado el formato de los elementos. Un formato específico puede ser aplicado al texto por medio de hojas de estilo en cascada.

El marcado presentacional describe la apariencia del texto, sin importar su función. Por ejemplo, negrita indica que los navegadores web visuales deben mostrar el texto en negrita, pero no indica qué deben hacer los navegadores web que muestran el contenido de otra manera (por ejemplo, los que leen el texto en voz alta). En el caso de negrita e itálica, existen elementos que se ven de la misma manera pero tienen una naturaleza más semántica: énfasis fuerte y énfasis. Es fácil ver cómo un lector de pantalla debería interpretar estos dos elementos. Sin embargo, son equivalentes a sus correspondientes elementos presentacionales: un lector de pantalla no debería decir más fuerte el nombre de un libro, aunque éste esté en itálicas en una pantalla. La mayoría del marcado presentacional ha sido desechada con HTML 4.0, en favor de Hojas de estilo en cascada.

El marcado hipertextual se utiliza para enlazar partes del documento con otros documentos o con otras partes del mismo documento. Para crear un enlace es necesario utilizar la etiqueta de ancla Wikipediajunto con el atributo href, que establecerá la dirección URL a la que apunta el enlace. Por ejemplo, un enlace a la Wikipedia sería de la forma . También se pueden crear enlaces sobre otros objetos, tales como imágenes .

Atributos

La mayoría de los atributos de un elemento son pares nombre-valor, separados por un signo de igual "=" y escritos en la etiqueta de comienzo de un elemento, después del nombre de éste. El valor puede estar rodeado por comillas dobles o simples, aunque ciertos tipos de valores pueden estar sin comillas en HTML (pero no en XHTML).^{[] []} De todas maneras, dejar los valores sin comillas es considerado poco seguro.^[] En contraste con los pares nombre-elemento, hay algunos atributos que afectan al elemento simplemente por su presencia^[] (tal como el atributo ismap para el elemento img).^[]

Códigos HTML básicos

·