Introduccion HTML

Anexo I: INTRODUCCIN A HTML
INTRODUCCIN A HTML
El HTML, acrnimo ingls de Hyper Text Markup Language (lenguaje de etiquetas de
hipertexto), es un lenguaje informtico diseado para estructurar textos y presentarlos en
forma de hipertexto. Por hipertexto entendemos un archivo de texto que contiene
instrucciones que pueden ser interpretadas por
un navegador de Internet. Estas
instrucciones son denominadas Etiquetas.

Por tanto un documento HTML constar de texto que ser el contenido y la informacin
del documento y de etiquetas HTML que resaltarn este contenido y le darn un formato
fcil y agradable de leer y con la posibilidad de relacionar documentos y fuentes de
informacin mediante hiperenlaces.
Las etiquetas del lenguaje HTML especifican:
La estructura lgica del documento: Cabeceras, tipos y tamaos de las fuentes,

prrafos de texto, centrado, enumeraciones o listas, formularios, tablas etc.
Distintos estilos que definen el texto: negrita, cursiva, subrayado, etc.
Diferentes efectos: inclusin de hipertextos para acceder a otros documentos

relacionados, inclusin de imgenes, videos, etc.
ESTRUCTURA BSICA DE UN DOCUMENTO HTML

Una pgina web est compuesta de 2 partes: el encabezamiento y el cuerpo de la pgina.
Paralelamente a esto, existen tres etiquetas fundamentales, las mismas que deben estar
incluidas en el archivo HTML de manera obligatoria. Estas tres etiquetas fundamentales
son:
<html> </html>
Indica al navegador que el documento texto que est leyendo es un documento

HTML. Esta etiqueta se abre al inicio del archivo y se cierra al final del mismo.
<head> </head>
Delimita a la cabecera que sirve para definir diversos valores vlidos en todo el
documento.
<body> </body>
Delimita el cuerpo de la pgina donde reside la informacin del documento
Universidad Carlos III de Madrid
Pgina 202
El cuerpo de un documento HTML contiene el texto que, con la presentacin y los

efectos que se decidan, se presentar ante el hiperlector. Dentro del cuerpo son aplicables
todos los efectos que se especifican exclusivamente a travs de directivas. Esto quiere
decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el fichero
fuente no tienen ningn efecto a la hora de la presentacin final del documento.
En el caso de google sites, el cdigo HTML accesible al creador de la pgina es el del
cuerpo de la pgina, por lo que al editar este cdigo, se est editando el cdigo contenido
entre las etiquetas <body></body>, por tanto ninguna de las tres etiquetas generalmente
obligatorias en HTML, <html>,<head> y <body>, son necesarias, ni permitidas en el
espacio editable de html de cada pgina.
COLORES EN HTML
Se pueden llegar a tener 16 millones de colores en una pgina web.
Existen dos formas para aplicar colores a una pgina web:
Se especifica el color deseado directamente con el nombre del color en ingles:

blue, green, yellow
Se especifica el color deseado mediante nmeros hexadecimales mediante la

siguiente estructura:
#RRVVAA
EFECTOS DEL TEXTO

La mayora de los efectos se especifican de la misma forma: rodeando el texto que se
quiere marcar entre dos etiquetas o directivas (tags, en ingls), que definen el efecto o
unidad lgica que se desea. Las etiquetas estn formadas por determinados cdigos
metidos entre los signos < y >, y con la barra / cuando se trata de la segunda etiqueta de
un efecto (la de cierre). Por ejemplo: <efecto> para abrir y </efecto> para cerrar. Ciertas
directivas slo se ponen una vez en el lugar del texto donde queramos que aparezca el
efecto concreto.
Pgina 203
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 parmetros en
la directiva inicial (la de apertura), de la siguiente forma: <efecto parametro1 parametro2
...>. La directiva de cierre, caso de ser necesaria, queda como antes: </efecto>.
ENCABEZADOS EN HTML
Las etiquetas <h1> </h1> al <h6> </h6> (acrnimos de heading 1..6) son encabezados
del cuerpo del texto. El encabezamiento <h1> nos proporciona las letras de mayor
tamao.
La etiqueta tiene el siguiente atributo:
Align Permite ubicar el encabezamiento a la izquierda, centro o derecha de la

pantalla (LEFT, CENTER,RIGHT)
ATRIBUTOS DE TEXTO
Mediante estos atributos determinamos el estilo y el tipo de letra que tendr la
presentacin del documento final. El primero en el que nos deberamos detener es el texto
normal entendiendo como tal el que no tiene ninguna caracterstica especial. Para definir
un prrafo como normal no es necesario poner ninguna etiqueta. A continuacin se
muestran las etiquetas principales de formato y ubicacin:
Etiqueta <center> </center>

Se utiliza para centrar el texto/imagen o datos que se encuentren entre la apertura
y el cierre.
Etiqueta <b> </b>

Esta es la etiqueta que nos posibilita un texto con negrillas.
Etiqueta <u> </u>

Etiqueta que posibilita resaltar un texto con subrayado.
Pgina 204
Etiqueta <i> </i>

Etiqueta que permite resaltar el texto con inclinacin itlica.
Etiqueta <font> </font>

Esta etiqueta proporciona al autor un medio de personalizar el texto con respecto
al tipo de fuente, tamao y color. Sus atributos son:
Color: determina el color que se aplica al texto
Size: determina el tamao relativo del texto. Los tamaos vlidos son del 1
al 7, siendo el predeterminado el 3 y el ms grande el 1.
Face: asigna una fuente o tipo de letra.
LISTAS
Las listas se definen de forma muy sencilla: se dice dnde empieza la lista, dnde
empieza cada punto y dnde acaba la lista. Las etiquetas que se utilicen en cada caso
deben aparecer al principio de lnea, o al menos sin texto por delante (slo espacios o
tabulaciones).
Podemos recurrir a dos tipos distintos de listas, cada una con una presentacin diferente:
no numeradas y numeradas. Adems las listas se pueden anidar, es decir, en el lugar
donde debera ir uno de los trminos de la lista se pone una nueva lista, que no tiene
porqu ser del mismo tipo.
Etiqueta <ul> </ul>

Indica al navegador que cree una lista no numerada.
Etiqueta <ol> </ol>

Esta etiqueta indica al navegador que numere la lista de elementos comprendidos
dentro de las etiquetas <ol>
Etiqueta <li> </li>
Pgina 205
Se usa para indicar al navegador que el texto que le sigue es un elemento de una
lista.
TABLAS
El modelo de tablas de HTML permite a los autores organizar datos -- textos, texto
preformateado, imgenes, vnculos, formularios, campos de formularios, otras tablas, etc.
-- en filas y en columnas de celdas.
Para definir una tabla se usan las etiquetas:
Etiqueta <table> y </table>

Son las etiquetas entre las que donde est contenida la tabla.
Etiqueta <tr> y </tr>

Son las etiquetas que indican el comienzo y fin de una fila.
Etiqueta <td> y </td>

Sealan una celda
La tabla se va definiendo declarando una fila y a continuacin las celdas que contiene esa
fila, luego otra fila y sus celdas, etc. No es necesario que todas las filas contengan el
mismo nmero de celdas.
Los atributos que puede tener una tabla son :
Align : Establece la alineacin de la tabla o texto mediante
align=left o align=right
Bgcolor : Establece el color de fondo de las celdas de la tabla
Border : Determina el ancho del borde en pixeles
BorderColor: Asigna un color al borde
Pgina 206
BorderDark: Determina el color de la parte oscura de un borde de 3 dimensiones
BorderLight: Asigna el color de la parte clara de un borde de 3 dimensiones
Caption: Especifica el titulo para la tabla
Cellpadding: Establece la cantidad de espacio libre junto al contenido de una

celda
Cellspacing: Asigna la cantidad de espacio entre las celdas de una tabla
Width : Determina el ancho de la tabla en pixeles o en un porcentaje
ENLACES
Para definir un enlace es necesario marcar con la directiva <a> el objeto del cual va a
partir dicho enlace. Dicha directiva debe incluir el parmetro href="URL" para
especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir
con <a href="URL">, y despus cerrar con </a>.
TABLAS
Para incluir un grfico en un documento HTML se utiliza la directiva <img>. En dicha
directiva debe incluirse un parmetro src="URL", con el cual indicamos dnde est el
fichero con el grfico concreto que queremos para nuestro documento. Esto pone a
disposicin una gran flexibilidad, ya que se puede complementar el contenido de la
pgina tanto con grficos que se encuentren disponibles en nuestro servidor de www
como con una foto situada en el servidor.
Hay un parmetro optativo de la directiva <img> que sirve para proponer un texto
alternativo a un grfico. Este texto aparecer cuando se est usando para leer el HTML un
programa sin capacidades grficas Se trata de alt="texto".
Pgina 207

Introduccion HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Introduccion HTML

Cargado por

Copyright:

Formatos disponibles

Anexo I: INTRODUCCIN A HTML

un navegador de Internet. Estas

instrucciones son denominadas Etiquetas.

La estructura lgica del documento: Cabeceras, tipos y tamaos de las fuentes,

Distintos estilos que definen el texto: negrita, cursiva, subrayado, etc.

Diferentes efectos: inclusin de hipertextos para acceder a otros documentos

ESTRUCTURA BSICA DE UN DOCUMENTO HTML

Indica al navegador que el documento texto que est leyendo es un documento

Delimita el cuerpo de la pgina donde reside la informacin del documento

Universidad Carlos III de Madrid

Anexo I: INTRODUCCIN A HTML

El cuerpo de un documento HTML contiene el texto que, con la presentacin y los

Se especifica el color deseado directamente con el nombre del color en ingles:

Se especifica el color deseado mediante nmeros hexadecimales mediante la

EFECTOS DEL TEXTO

Universidad Carlos III de Madrid

Anexo I: INTRODUCCIN A HTML

Align Permite ubicar el encabezamiento a la izquierda, centro o derecha de la

Etiqueta <center> </center>

Etiqueta <b> </b>

Etiqueta <u> </u>

Universidad Carlos III de Madrid

Anexo I: INTRODUCCIN A HTML

Etiqueta <i> </i>

Etiqueta <font> </font>

Color: determina el color que se aplica al texto

Face: asigna una fuente o tipo de letra.

Etiqueta <ul> </ul>

Etiqueta <ol> </ol>

Etiqueta <li> </li>

Universidad Carlos III de Madrid

Anexo I: INTRODUCCIN A HTML

Etiqueta <table> y </table>

Etiqueta <tr> y </tr>

Etiqueta <td> y </td>

Align : Establece la alineacin de la tabla o texto mediante

Bgcolor : Establece el color de fondo de las celdas de la tabla

Border : Determina el ancho del borde en pixeles

BorderColor: Asigna un color al borde

Universidad Carlos III de Madrid

Anexo I: INTRODUCCIN A HTML

BorderDark: Determina el color de la parte oscura de un borde de 3 dimensiones

BorderLight: Asigna el color de la parte clara de un borde de 3 dimensiones

Caption: Especifica el titulo para la tabla

Cellpadding: Establece la cantidad de espacio libre junto al contenido de una

Cellspacing: Asigna la cantidad de espacio entre las celdas de una tabla

Width : Determina el ancho de la tabla en pixeles o en un porcentaje

Universidad Carlos III de Madrid

También podría gustarte