TERCER CORTE

HTML

Lenguaje demarcado de Hipertexto, es el lenguaje dominante para la elaboración de paginas web.
la forma de escribir y reconocer HTML es con etiquetas <>

Un documento HTML se divide en dos partes fundamentales:

  •  el encabezamiento o cabecera 
  • el cuerpo del documento.
Todos los elementos y el contenido de un documento HTML están encerrados dentro de las marcas <HTML></HTML> cuya función es servir de apertura y cierre al archivo. 

LAS ETIQUETAS MAS UTILIZADAS EN HTML


<HEAD>

Los elementos <HEAD></HEAD> se colocan inmediatamente después de la apertura de la marca <HTML> y cierran el encabezamiento propiamente dicho del documento; es decir toda la información que necesita el navegador, el servidor de web y los motores de búsqueda. Se trata del primer elemento que lee el navegador y, por ello, es el mejor lugar para insertar sintaxis script . Dentro de <HEAD></HEAD> se introduce el título del documento y otros datos.


<TITLE>

El elemento <TITLE></TITLE> es el más utilizado dentro de la marca <HEAD>, dado que sirve para dar título a la página. El título suele ser visualizado por los navegadores en la cabecera de página.
<TITLE>Mi primera portada con la guía de HTML</TITLE>


<BODY>

El elemento <BODY> se coloca inmediatamente después del cierre de la marca </HEAD> y, en cualquier caso, dentro de los elemenos <HTML></HTML>; tiene una marca de apertura y una de cierre y delimitado por ellas figura el cuerpo del documento.

<BODY>
Contenido del documento</BODY>


BGCOLOR

El atributo BGCOLOR imposta un fondo de un solo color. La sintaxis correcta es:<BODY BGCOLOR="red">Es posible sustituir el nombre en inglés con valores hexadecimales. Por ejemplo, el color rojo (red) se sustituye de esta manera:<BODY BGCOLOR="#ff0000">La utilidad de los colores hexadecimales es mayor cuando no se desea un color estándar sino tonalidades diversas o difuminadas. Los editores HTML de mayor difusión prevén paletas para la definición de los colores hexadecimales, mientras que Paint Shop Pro proporciona también, además del color, el correspondiente valor hexadecimal que copiar/pegar.


BACKGROUND

BACKGROUND tiene una función similar a BGCOLOR, pero mientras el segundo muestra un tono único del color, el primero visualiza en el fondo una imagen en formato gráfico .gif o .jpg.
<BODY BACKGROUND="sfondo.gif">


TEXT

Si no viene establecido diversamente, el color del texto del documento es el negro ya que los navegadores asignan este color por defecto. Gracias al atributo TEXT es posible asignar al texto un color distinto del negro.
<BODY BACKGROUND="sfondo.gif" TEXT="red">


Formatear títulos de <H1> ad <H6>

La marca <Hn> (donde n puede ser cualquier número comprendido entre 1 y 6) se emplea para definir el estilo de los encabezados de la página, dándoles más o menos relieve según el número correspondiente. Como hemos señalado, los números van del 1 al 6, siendo más importantes los números más bajos que los altos. 

<FONT>

La marca FONT se emplea para formatear el tipo y tamaño del texto en algunos puntos del documento específicos. En realidad, si la marca FONT abriera y cerrara el documento, todo el texto comprendido dentro quedaría formateado tal y como estuviera indicado. Sin embargo, conceptualmente la marca FONT ha sido concebida para definir partes limitadas de texto. Por otro lado, mientras TEXT determina tan sólo en color del texto, la marca FONT puede definir el tipo utilizado, así como su tamaño y color.
<FONT FACE="arial" SIZE=5 COLOR=red>Tipo para formatear</FONT>
El atributo FACE="arial" indica el tipo que se visualizará; SIZE=5 el tamaño del tipo, que puede estar comprendido entre 1 y 7 (mayor dimensión cuanto más cercano al 7); COLOR=red indica el color del texto (que puede expresarse asimismo en valores hexadecimales).

<B>, <I>, <U>

<B>, <I>, <U> son tres de las marcas de formatación tipográfica más usadas del HTML. Todas ellas deben constar de apertura y cierre:
<B> Texto en negrita </B>
El texto comprendido entre estas marcas queda formateado en negrita (la B corresponde al inglés BOLD).
<I> Texto en cursiva </I>
El texto comprendido entre estas marcas queda formateado en cursiva (la I corresponde al inglés ITALIC)
<U> Texto subrayado </U>
El texto comprendido entre estas marcas queda subrayado aun sin ser un enlace (la U corresponde al inglés UNDERLINE).
Existe también la marca STRIKE para el texto tachado:
<STRIKE> Texto tachado </STRIKE>

Crear párrafos con <P>

La marca <P> sirve para definir un nuevo párrafo de texto, indicando al navegador que el mismo debe empezar en una nueva línea y colocarse a la derecha, a la izquierda o centrado. Si no se especifica otra cosa, la marca <P> alinea el texto por defecto a la izquierda. Para indicar otros tipos de alineación, existen atributos específicos:
<P ALIGN=left>Define un párrafo y alinea el texto a la izquierda(left).
<P ALIGN=right>Define un párrafo y alinea el texto a la derecha (right).
<P ALIGN=center>Define un párrafo y centra el texto (center).

Salto de línea con <BR>

<BR> es una marca de interrupción de línea. Tiene un funcionamiento similar a la marca de párrafo vista anteriormente, pero se diferencia porque no indica el inicio de un nuevo párrafo.Dicho de otro modo, su función es parecida a la de la tecla "enter" del teclado.Se usa sin marca de cierre.
Líneas horizontales con <HR>

Las líneas horizontales constituyen un instrumento idóneo para dividir partes del documento y hacer más legible el texto. La sintaxis necesaria para su inserción en un documento HTML es la siguiente:

<HR align="CENTER" size="2" width="400" color="Red" noshade>

La marca HR (acrónimo de Horizontal Rule) no necesita cierre. Consta de diversos atributos:



  • aling="CENTER": define la alineación de la línea (center, right, left).


  • size="2": define el grosor, en píxel, de la línea.


  • width="400": define la longitud horizontal, en píxel, de la línea. Puede también expresarse en tanto por cien respecto al espacio a disposición: width=80%.


  • color="RED": define el color de la línea.





  • Listas ordenadas

    Las listas ordenadas constan de una sola marca de apertura y cierre <OL></OL> y tantas marcas de lista como voces hay en el menú <LI>. La sintaxis correcta para elaborar listas ordenadas es:

    <OL>
    <LI> Primera voz del menú
    <LI> Segunda voz del menú
    <LI> Tercera voz del menú
    </OL>


    Listas desordenadas

    Las listas desordenadas funcionan de manera similar a las ordenadas. La diferencia básica es que en el caso de las listas desordenadas no existen relaciones jerárquicas entre los elementos del elenco, por lo cual no se prevén ordenaciones progresivas como las obtenidas mediante números o letras.

    Las listas desordenadas constan de una sola marca de apertura y cierre<UL></UL> y tantas marcas de lista como voces hay que ordenar <LI>. La sintaxis correcta para definir una lista desordenada es:

    <UL>
    <LI> Primera voz del menú
    <LI> Segunda voz del menú
    <LI> Tercera voz del menú
    </UL>


    <IMG>

     Los documentos HTML se limitan a prever dentro de ellos un espacio en el que se insertan las imágenes solicitadas.

    <IMG SRC="immagine.gif">

    donce SRC corresponde al inglés Search y es el recorrido del que el navegador saca la imagen (en este caso "immagine.gif"). Como hemos señalado, esta marca es única en el sentido de que NO lleva como cierre el correspondiente </IMG>.

    <A HREF>

    El elemento <A> (la A corresponde al inglés Anchor) necesita una marca de apertura y una de cierre y entre ellas podemos insertar texto, imágenes y otros elementos multimedia.
    Para que funcione, el elemento <A> debe estar asociado a otros atributos. De éstos, el más importante es HREF (abreviatura del inglés Hypertext Reference), que contiene el URL o página donde ir. La sintaxis es:

    <A HREF="http://www.htmlpoint.com">Visita HTMLpoint</A>

    MAILTO (enlace a e-mail)

    Es posible asimismo incluir enlaces con direcciones de correo electrónico utilizando una sintaxis algo distinta de la indicada para los URL. El código es:

    <A HREF="mailto:webmaster@html.it">Escribe a HTMLpoint</A>



    MAILTO (enlace a e-mail)

    Es posible asimismo incluir enlaces con direcciones de correo electrónico utilizando una sintaxis algo distinta de la indicada para los URL.