Comunidades Virtuales

MODULO 4 EDITORES WEB
LENGUAJES

GUÍA DE HTML 3.2

Este documento pretende ser una guía de referencia rápida del lenguaje HTML, no un tutorial. La guía está dividida en secciones cada una de las cuales presenta su contenido en columnas. En la primera están las etiquetas y atributos, en la tercera una breve descripción y en la segunda la versión en la que fueron incluidos. Si en esta segunda columna no hay nada significa que pertenece al estándar HTML 2.0, mientras que H3.2 significa que pertenece al estándar HTML3.2.
Esta guía abarca los estandares HTML 2.0 y HTML 3.2.

ELEMENTOS BÁSICOS

Elementos Principales
<HTML></HTML> Declara que el documento es de tipo HTML. Deben estar en la primera y última linea respectivamente
<HEAD></HEAD> Cabecera del documento
<BODY background="img" bgcolor, text, link, vlink, alink="#RRGGBB">
</BODY> Estas etiquetas delimitan el contenido de la página

Elementos De La Cabecera
<TITLE></TITLE> Indicar el título de la página
<SCRIPT></SCRIPT>H3.2Programar un script
<ISINDEX PROMPT="texto" ACTION="cgi">H3.2El documento es un índice-Debe existir un CGI (usado cuando no existían formularios)
<LINK HREF="" REL="" REV="" TITLE=""> Establecer una relación con otro archivo, hoja de estilo,...
<BASE HREF=""> Especificar una dirección base
<META HTTP-EQUIV="" NAME="" CONTENT="">H3.2Insertar descripción de la página, redirigir a otra página, refrescar...

ELEMENTOS FORMATEADORES DE BLOQUE

Elementos Principales
<H?></H?> Seis niveles de cabeceras(1-6)
<H? align="left|center|right"></H?> H3.2 Alineamiento a la izquierda, centro o derecha.
<ADDRESS></ADDRESS> Para indicar autor, url...Renderizado con letra pequeña
<P></P> Párrafo, </P> es optativo
<P align="left|center|right></P> H3.2 Alineación del texto del párrafo
<CENTER></CENTER> Centrado
<DIV align=""></DIV> División (establece alineamiento y hoja de estilo)
<BLOCKQUOTE></BLOCKQUOTE> Texto parafraseado
<PRE WIDTH=N></PRE> Texto preformateado, width mal soportado
<FORM ACTION="cgi" METHOD="get|post|put"></FORM> H3.2 Formulario (campos tratados más adelante)

Separadores
<BR></BR> Cambio de linea
<BR clear="left|right|all"></BR> H3.2 Para no bordear imágenes
<HR></HR> Inserta linea horiontal
<HR ALIGN="" SIZE="n" WIDTH="n|%" NOSHADE"></HR> H3.2 Alineamiento,
grosor, ancho y sin efecto 3D
<WBR></WBR> Romper aquí si es necesario
  H3.2 Espacio en blanco

Listas
<UL><LI></UL> Lista no numerada
<UL compact type="disc|circle|square"><LI
type="disc|circle|square"></UL> H3.2 Renderizado compacto y tipo de símbolo
<OL><LI></OL> Lista numerada
<UL compact type="A|a|I|i|1" start=""><LI></UL> H3.2 Renderizado compacto, tipo de numeración y donde empezar
<DIR><LI></DIR> Directorio (normalmente igual que <UL>)
<MENU><LI></MENU> Menu (normalmente igual que <UL>)
<DL><DT>termino<DD>definición</DL> Menu (normalmente igual que <UL>)
<DIR,MENU,DL compact></DIR,MENU,DL> Renderizado compacto

Tablas
<TABLE BORDER=n CELLSPACING=m CELLPADDING=l WIDTH=n|%> H3.2 Define una tabla (por defecto sin borde) con espacio entre celdas m y margen de celdas l, de ancho n pixeles o % de página (las tablas pueden anidarse)
<CAPTION align=top|bottom></CAPTION> H3.2 Titulo de la tabla
<TR align="" valign="top|middle|bottom" BORDER=n CELLSPACING=m
CELLPADDING=l WIDTH=n|%></TR> H3.2 Nueva fila(</TR> optativo)
<TH></TH> H3.2 Cabecera dentro de la fila actual(mismos atributos
que <TD>) [negrita y centrada]
<TD nowrap rowspan,colspan=N align,valign="" widtn=n height=n></TD>
H3.2 Celda

ELEMENTOS FORMATEADORES DE TEXTO

Estilo Físico
<FONT SIZE="n|+n|-n"></FONT> H3.2 Tamaño de la fuente absoluto (0-7) o relativo
<FONT COLOR="#RRGGBB"></FONT> H3.2 Color de la fuente
<TT></TT> Teletipo o monoespaciado
<I></I> Cursiva
<B></B> Negrita
<U></U> H3.2 Subrayado
<STRIKE></STRIKE> ó <S></S> H3.2 Tachado
<BIG></BIG> H3.2 Letra grande (igual que +1)
<SMALL></SMALL> H3.2 Letra pequeña (igual que -1)
<SUB></SUB> H3.2 Subíndice
<SUP></SUP> H3.2 Superíndice
<BLINK></BLINK> N3 Texto que parpadea

Estilo Lógico
<EM></EM> Enfasis [cursiva]
<STRONG></STRONG> Fuerte [negrita]
<CODE></CODE> Codigo [monoespaciado]
<SAMP></SAMP> Scripts,... [monoespaciado]
<VAR></VAR> Texto escrito por el usuario [cursiva]
<CITE></CITE> Citas y referencias [cursiva]
<DFN></DFN> H3.2 Definicion [cursiva]
<KDB></KDB> Input [monoespaciado]

Caracteres Especiales
&#???; Caracter especial con código ASCII ???
&[vocal]acute; ej:Á á Acentos. Ej. en mayúsculas y minúsculas
< > Símbolos < (menor que - Lower Than) y > (mayor que - Greater Than)
& Ampersand [&]
" Dobles comillas ["]
® © Marca registrada [®] y Copyright [©] respectivamente

Links (Enlaces Hipertexto)
<A HREF="URL|URL#etiq" ></A> Link a un archivo o a una etiqueta.
<A rel|rev=""></> Establecer relación directa o inversa
<A NAME="etiq"><A/> Definición de la etiqueta etiq

Imágenes Y Sonido
<IMG SRC="URL" ALT="texto"> Insertar imagen o poner texto alternativo
<IMG WIDTH="n" HEIGHT="n"> H3.2 Tamaño
<IMG BORDER="n"> H3.2 Borde, sólo si la imagen es un link
<IMG VSPACE="n" HSPACE="n"> H3.2 Espaciado alrededor de la imagen
<IMG SRC="URL" ALIGN="top|middle|bottom|left|right"> H3.2 Alinear la imagen
<IMG SRC="URL" ISMAP> Imagen mapa con CGI(la imagen debe ser un link a dicho CGI)
<IMG SRC="URL" USEMAP="URL|#nom"> H3.2 Imagen mapa (mapa definido en HTML)
<MAP NAME="nom"></MAP> H3.2 Definición del mapa
<AREA SHAPE="rect" COORDS="x1,y1,x2,y2" HREF="" TARGET=""> </AREA>
H3.2 Define una sección rectangular en el mapa
<AREA SHAPE="circle" NOHREF COORDS="CentroX,CentroY,radio" ></AREA>
H3.2 Define una sección circular en el mapa
<AREA SHAPE="poly" COORDS="x1,y1,x2,y2,.." HREF=""> </AREA> H3.2
Define una sección poligonal en el mapa

Elementos de Formulario
Estos elementos deben ir entre las etiquetas formateadoras de bloque <FORM> y </FORM>. Todas deben incluir además de sus atributos especificos el atributo NAME que servirá para identificarlas.
<INPUT TYPE="text|passwd" MAXLENGTH="M" SIZE="N" text="texto por defecto"></INPUT> Caja de texto o passwd(no se muestra lo escrito)
<INPUT TYPE="checkbox|radio" CHECKED VALUE="></INPUT> Caja de selección o radio con el atributo optativo checked
<INPUT TYPE="hidden"></INPUT> Variable oculta
<INPUT TYPE="submit" ></INPUT> Enviar la información
<INPUT TYPE="image"></INPUT> Enviar la info. y el punto de la imágen en que se pulsó
<INPUT TYPE="reset"></INPUT> Resetear los campos
<SELECT SIZE=M MULTIPLE>
<OPTION selected>
</SELECT> Persiana de selección o caja combo (si n<M)
<TEXTAREA ROWS=N COLS=M></TEXTAREA> Ventana de texto de N filas por M columnas

Applets Y Scripts
<APPLET CODE="URL(.class)" WIDTH="n" HEIGHT="m"></> H3.2 Incluye el applet indicado reservandole un espacio de nxm
<APPLET codebase="URL" name="" align="" ALT="" vspace="i" hspace="j"></> H3.2 Atributos optativos
<PARAM NAME="param1" VALUE="valor1"></> Paso de parametros al applet
(entre <APPLET></APPLET>)
<APPLET>Código HTML</APPLET> Código alternativo para navegadores sin soporte Java
<SCRIPT LANGUAJE="javascript#.#"> Codigo</SCRIPT> H3.2 Insertar codigo Javascript versión #.# (p.e:nada=1.0,1.1)

Varios
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN//3.2"> Ejemplo de declaración de tipo de documento (debe ser la 1ª linea)
 Insertar comentarios
<META HTTP-EQUIV="refresh" CONTENT="5 ;URL=otro.html"> Actualizar página o cargar otra en 5 segs.
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;
charset=iso-8859-1"> Tipo de archivo mime y codigo de caracteres usado
<META NAME="author" CONTENT="Nombre autor">
<META NAME="description" CONTENT="Descripcion">
<META NAME="url" CONTENT="http://...">
<META NAME="keywords" CONTENT="HTML, web, guia">
<META NAME="exclude" CONTENT="no|yes">Informacion para los buscadores
<KDB></KDB> <LISTING></LISTING> <XPM></XPM> <KEY></KEY>
<PLAINTEXT></PLAINTEXT> Elementos en desuso:No es recomendable utilizarlos