<La Comunidad-Hacker> - Tutorial HTML avanzado y Empezar desde zero

.:.Esto sirve como tutorial a los que tengan su web.:.

Esta primera parte es la avanzada, ocea para webmasters con experiencia.mas abajo la (HTML desde cero)

Redireccionar una página:

Si tenés una dirección larga, y los servidores que te dan direcciones cortas no tienen buena capacidad de almacenamiento o de taza de transferencia de datos, con este código podés hacer que al escribir una dirección se abra otra, solo tenés que insertar este código en el index.html del dominio corto poniendo tu dirección actual donde está en verde:

dijo:
<HTML>
<HEAD>
<TITLE>Redireccionado por www.sorparen.com.ar</TITLE>
<SCRIPT LANGUAGE="JavaScript">
location.href='http://www.sorparen.com.ar';
</SCRIPT>
</HEAD>
<BODY>

Cambiar el "http://www.sorparen.com.ar" por la web que quieran.

Abrir una Web en Pop Up:

Con este código vamos a hacer que al entrar en nuestra página automáticamente se abra otra, ej. otra Web nuestra, una sección que queremos mostrar, una publicidad, etc.

dijo:
<script language='JavaScript'>window.open('http://www.sorparen.com.ar', 'geoflotante', '');</script>

No dejar seleccionar el texto de nuestra Web:

Con este código vamos a impedir que los visitantes seleccionen el texto de nuestra página para luego copiarlo a otro lado.

dijo:
<script language="Javascript">

</script>

Recomendar Pagina:

Con este código podemos hacer que si a un visitante le gustó nuestra Web, la recomiende a un amigo escribiendo su dirección de correo electrónico en la casilla, al hacer click en "Recomendar esta Web" se envía un mensaje de correo con el asunto "Pienso que te puede interesar esta página..." y en el cuerpo del mensaje aparece la dirección completa donde se encuentra el código y el título de la misma.

dijo:
<form name="eMailer">
ENVÍA ESTA PÁGINA A UN AMIGO
<br>
Indica su e-mail:
<br>
<input type="text" name="address" size="25">
<br>
<input type="button" value="Recomendá esta Web!" onClick="mailThisUrl();">
</form>
<script language="JavaScript1.2">
var good;
function checkEmailAddress(field) {
// the following expression must be all on one line...
var goodEmail = field.value.match(/b(^(S+@).+((.com)|(.net)|
(.edu)|(.mil)|(.gov)|(.org)|(..{2,2}))$)b/gi);
if (goodEmail){
good = true
} else {
alert('Por favor introduce un e-mail valido')
field.focus()
field.select()
good = false
}
}
u = window.location;
m = "Pienso que te puede interesar esta página...";
function mailThisUrl(){
good = false
checkEmailAddress(document.eMailer.address)
if (good){
// the following expression must be all on one line...
window.location = "mailto:"+document.eMailer.address.value+"?subject="+m+"&body="+document.title+" "+u;
}
}
</script>

Crear un Formulario o Libro de Visitas:

Con este código podemos crear un formulario para que complete el visitante. O también un libro de visitas, luego que el visitante apriete el botón "enviar", los datos serán enviados a tu casilla de correo.

dijo:
<H2>Libro de visitas de www.sorparen.com.ar</H2>
<FORM ACTION="mailto:tunombre@tuservidor.com" METHOD="post">

<TABLE>

<TD ALIGN=RIGHT>Nombre:</TD>
<TD><INPUT type="text" size=36 name="nombre"></TD>
<TR><TD ALIGN=RIGHT>Direccion E-mail:</TD>
<TD><INPUT type="text" size=36 name="direccion"></TD>
<TR><TD ALIGN=RIGHT>como llegaste hasta esta pagina?</TD>
<TD><INPUT type="text" size=36 name="procedencia"></TD>
<TR><TD ALIGN=RIGHT>Tus comentatios:</TD>
<TD><TEXTAREA rows=5 cols=30 name="comentarios"></TEXTAREA></TD>

</TABLE>

<INPUT type="reset" value="Borrar todo"> <INPUT type="submit" value="Enviar">

</FORM>

Insertar un sonido o música de fondo:

Si quieren que los visitantes escuchen una canción mientras visitan la Web, o simplemente recibirlos con una melodía estilo presentación, este es el código que estabas buscando. Solo tenés que guardar el sonido en el directorio raíz de tu servidor e insertar el siguiente código html:

dijo:
<BGSOUND SRC="sonido.mid" LOOP=none>
<WIDTH=200 HEIGHT=55 AUTOSTART="true" LOOP="false" HIDDEN="true">

Se recomienda usar sonidos en formato "midi" que son los de menor peso.

Crear un link para download:

Si queremos poner archivos para que los visitantes los puedan descargar a sus computadoras, solo debemos subir ese archivo a nuestro servidor e insertar en nuestra Web el siguiente código HTML:

dijo:
<a href="ejemplo.exe">Descripción del enlace </a>

No existe un comando que inicie la descarga. Lo que sucede es que, siempre que aparece un tipo de archivo no reconocido por el navegador, este comienza a descargarlo automáticamente. Ejemplo: Si el navegador no logra abrir un archivo "zip" (compactado), inicia la descarga automáticamente.

Establecer una página como inicio:

Este código html te sirve para crear un link para que el visitante pueda hacer que tu página sea la de inicio de su computadora. Con solo hacer clic sobre el link creado, tu página se iniciará automáticamente cada vez que esa persona se conecte a Internet.

dijo:
<A class=chlnk style="FONT-WEIGHT: bold; CURSOR: hand;
COLOR: #004080; FONT-FAMILY: Verdana" onclick=
"this.style.behavior='url(#default#homepage)';
this.setHomePage('http://www.sorparen.com.ar');">
<FONT face=Arial color=#000000 size=-2><U>
Establecer como página de inicio</U></FONT></A>

Botón animado:

Aprendé a dar movimiento a tu página con botones animados por Java Script. Cada botón puede llevar a un enlace distinto. Sólo tienes que configurar los parámetros "lineArr" y "urlArr" del script, que permiten destacar cosas en tu página.

dijo:
<font face="Arial, Helvetica, sans-serif" size="2">
<script language="JavaScript">
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineNo = 0
var lineMax = 3
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)
lineArr[1] = "Pauluk Computación"
urlArr[1] = "http://www.sorparen.com.ar"
lineArr[2] = "Trucos PC"
urlArr[2] = "http://www.pauluk.8k.com/trucosprin.htm"
lineArr[3] = "Noticias Tecnológicas y Actualidad"
urlArr[3] = "http://www.pauluk.8k.com/noticias.htm"
var lineText = lineArr[1]
function StartShow() {
StopShow()
ShowLine()
timerRunning = true
}
function FillSpaces() {
for (var i = 1; i <= lineWidth; i++) {
spaces += " "
}
}
function StopShow() {
if (timerRunning) {
clearTimeout(timerID)
timerRunning = false
}
}
function ShowLine() {
if (charNo == 0) {
if (lineNo < lineMax) {
lineNo++
}
else {
lineNo = 1
}
lineText = lineArr[lineNo]
charMax = lineText.length
}
if (charNo <= charMax) {
document.formDisplay.buttonFace.value = lineText.substring(0, charNo)
charNo++
timerID = setTimeout("ShowLine()", 100)
}
else {
charNo = 0
timerID = setTimeout("ShowLine()", 3000)
}
}
function GotoUrl(url)
{
top.location.href = url
}
document.write("<form name="formDisplay">";
document.write("<input type="button" name="buttonFace" value="&{lineText}" size="18" onClick="GotoUrl(urlArr[lineNo])">";
document.write("</form>";
StartShow();
</script></font>

Texto que sigue al mouse:

Hacé que un texto cualquiera siga al mouse del visitante en tu página. Es un efecto fabuloso y fácil de incluir en las páginas

Incluye el siguiente código en tu página HTML:

dijo:
<style>
.animado {position:absolute;visibility:visible;top:-50px;font-size:10pt;font-family:Arial;font-weight:bold;color:black;}
</style>
<script language=JavaScript>
var x,y
var tempo=10
var espera=0

var texto="www.sorparen.com.ar"
texto=texto.split(""

var xpos=new Array()
for (i=0;i<=texto.length-1;i++) {
xpos=-50
}

var ypos=new Array()
for (i=0;i<=texto.length-1;i++) {
ypos=-50
}

function seguir(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
espera=1
}

function animar_cursor() {
if (espera==1 && document.all) {
for (i=texto.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+tempo
ypos[i]=ypos[i-1]
}
xpos[0]=x+tempo
ypos[0]=y

for (i=0; i<texto.length-1; i++) {
var camada = eval("span"+(i)+".style"
camada.posLeft=xpos[i]
camada.posTop=ypos[i]
}
}

else if (espera==1 && document.layers) {
for (i=texto.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+tempo
ypos[i]=ypos[i-1]
}
xpos[0]=x+tempo
ypos[0]=y

for (i=0; i<texto.length-1; i++) {
var camada = eval("document.span"+i)
camada.left=xpos[i]
camada.top=ypos[i]
}
}
var timer=setTimeout("animar_cursor()",30)
}

</script>
<script Language=JavaScript>
for (i=0;i<=texto.length-1;i++) {
document.write("<span id='span"+i+"' class='animado'>"
document.write(texto[i])
document.write("</span>"
}

if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = seguir;
animar_cursor()
</script>

Este plugin sirve mucho para casi obligar a la gente que se registre por ejemplo :p

Página protegida por clave:

Este es un excelente recurso. Podés proteger tus páginas con una clave. Así podés definir exactamente quienes entrarán a tu página. No tenés que preocuparte por configuraciones. Es muy sencillo: la clave siempre será el nombre de tu página sin la extensión .htm, es decir, si la página tiene el nombre de "ejemplo.htm", la clave será "ejemplo". ¿Ves que fácil?.

Para tener este recurso en tu sitio debes incluir un código en la página de "entrada" en donde el visitante ingresará la clave, y enviar a tu sitio el archivo de la página que será cargada.

dijo:
<Form name="frm">
<center>
<Script Language="JavaScript">

</script>
Ingresa tu clave:
<input
type="password" name="pswd" size="20">
</center>
<center>
<p>
<input type="button" value="Entra"
onClick="loadpage()" name="button">
 </p>
</center>
</form>

Mensaje de bienvenida:

Con este recurso personalizás tu sitio para el visitante. Al entrar, el visitante verá un espacio para ingresar su nombre y un mensaje que dice "Hola, Fulano".

Copiá el siguiente código y pégalo donde quieras que aparezca el mensaje:

dijo:
<Script language="JavaScript">
mensagem = prompt("Por favor, ingresa tu nombre",'');
if (mensagem==null) {
document.write("¡Hola, visitante!"
}else{
if (mensagem=='') {
document.write("<b><font face=arial size=2 color=#000000>¡Hola, visitante!</font></b>"
}else{
document.write("<b><font face=arial size=2 color=#000000>¡Hola"+mensagem+"! Bienvenido a mi sitio</font></b>";
}
}
</script>

Atrás y Adelante:

dijo:
Atrás:

dijo:
<a href="javascript:history.go(-1)">Atrás </a>

Adelante:

dijo:
<a href="javascript:history.go(1)">Adelante</a>

Efecto de apertura:

Este es un recurso fabuloso y muy fácil que permite crear un efecto de entrada a tu página. Es sólo copiar y pegar el código en tu página. Siempre que alguien acceda a tu sitio el efecto será activado.

dijo:
<style>

</style>
<div id="i1" class="entrada"></div>
<div id="i2" class="entrada"></div>
<div id="i3" class="entrada"></div>
<div id="i4" class="entrada"></div>
<div id="i5" class="entrada"></div>
<div id="i6" class="entrada"></div>
<div id="i7" class="entrada"></div>
<div id="i8" class="entrada"></div>
<script language="JavaScript1.2">
//
var velocidade=10
var tempo=new Array()
var tempo2=new Array()
if (document.layers){
for (i=1;i<=8;i++){
tempo=eval("document.i"+i+".clip"
tempo2[i]=eval("document.i"+i)
tempo[i].width=window.innerWidth/8-0.3
tempo[i].height=window.innerHeight
tempo2[i].left=(i-1)*tempo[i].width
}
}
else if (document.all){
var clipbottom=document.body.offsetHeight,cliptop=0
for (i=1;i<=8;i++){
tempo[i]=eval("document.all.i"+i+".style"
tempo[i].width=document.body.clientWidth/8
tempo[i].height=document.body.offsetHeight
tempo[i].left=(i-1)*parseInt(tempo[i].width)
}
}
function openit(){
window.scrollTo(0,0)
if (document.layers){
for (i=1;i<=8;i=i+2)
tempo[i].bottom-=velocidade
for (i=2;i<=8;i=i+2)
tempo[i].top+=velocidade
if (tempo[2].top>window.innerHeight)
clearInterval(stopit)
}
else if (document.all){
clipbottom-=velocidade
for (i=1;i<=8;i=i+2){
tempo[i].clip="rect(0 auto+"+clipbottom+" 0)"
}
cliptop+=velocidade
for (i=2;i<=8;i=i+2){
tempo[i].clip="rect("+cliptop+" auto auto)"
}
if (clipbottom<=0)
clearInterval(stopit)
}
}
function gogo(){
stopit=setInterval("openit()",100)
}
gogo()
</script>

¿Querés cambiar el color? Podés cambiarlo por cualquier otro color. ¡Es muy fácil:

Observá que existe una parte del código que contiene:

<style>

</style>

Donde dice "green", debes poner el nombre en inglés o el código hexadecimal del color que deseas.

Podés también seleccionar uno de los colores que siguen y sustituir la referida parte del código original por esta nueva que vas a recibir.

Menú desplegable:

El menú desplegable permite que coloques varios enlaces en un solo lugar. Con esto, ganás espacio y facilidad de navegación. Este menú no necesita un botón para activarse. Basta con seleccionar el enlace y automáticamente el navegador se dirigirá a la página. Este menú funciona en páginas sin marcos.

Para crear tu menú y personalizarlo, pegá el siguiente código en tu página HTML:

dijo:

dijo:
<form>
<select NAME="links" onChange="top.location.href=this.form.links.options[this.form.links.selectedIndex].value">
<option SELECTED>Elija la sección que desee</option>
<option VALUE="http://www.pauluk.8k.com">Pauluk Computación</option>
<option VALUE="http://www.pauluk.8k.com/trucos.htm">Trucos PC</option>
<option VALUE="http:/www.pauluk.8k.com/noticias.htm">Noticias Tecnológicas</option>
</select>
</form>

Instrucciones para personalización: Observá que cada opción del menú se hace con la etiqueta:

dijo:
<option VALUE="Ingresa el enlace aquí">Ingresa el nombre del enlace aquí</option>

No alteres la siguiente etiqueta:

dijo:
<select NAME="links" onChange="top.location.href=this.form.links.options[this.form.links.selectedIndex].value">

Si cambiás algo en ella, tu menú no funcionará correctamente.

No sabes nada?? quers empezar HTML desde cero??

Instrucciones HTML

esta es la parte del tutorial de (empeza desde cero).En esta parte aprenderas HTMLdesde cero.Suerte!



dijo:
Define un comentario. Los exploradores ignoran completamente estas líneas (excepto cuando se incluyen scripts Java). Son útiles, por ejemplo, para aclarar lo que haces en cada sección de tu página (cuando ésta es muy compleja, hay veces que ni siquiera tú mismo/a recuerdas para qué sirve lo que has escrito!).

<A> ...... </A>

dijo:
Sirve para definir una etiqueta de ancla. Lo que se incluya entre sus límites (un texto, una imagen...), actúa como un enlace a otra parte de la página, a una página diferente, a una foto, a grupos de noticias, etc... La manera en que se visualizan las anclas varía según el explorador, si bien se puede modificar ésto con las páginas de estilo (<STYLE>, por ejemplo.
NOTA: Atributos indispensables; por si sola no tiene utilidad alguna.

<ABBREV> ...... </ABBREV>

dijo:
Da aspecto de abreviatura a un texto.

<ACRONYM> ...... </ACRONYM>

dijo:
Formatea un texto con el estilo propio de las siglas o acrónimos.

<ADDRESS> ...... </ADDRESS>

dijo:
Pone el texto entre sus límites en un tipo de
letra cursiva
que se suele utilizar para indicar direcciones URL.

<AU> ...... </AU>

dijo:
Utiliza éste formato cuando te refieras al autor de lo que sea.

<B> ...... </B>

dijo:
Pasa un texto a negritas. Como la etiqueta <STRONG>

<BANNER>

dijo:
Define un rótulo para la página.

<BASE>

dijo:
Se utiliza para guardar el URL original del documento. Es recomendable si queremos que, al bajar una página a nuestro ordenador, los enlaces de la misma funcionen como si estuviéramos en la ubicación original.

<BIG> ...... </BIG>

dijo:
Resalta el texto que queramos, agrandando el tamaño de los caracteres respecto de la fuente activa en esa parte de la página.

<BLINK> ...... </BLINK>

dijo:
Hace parpadear un texto. Si tu navegador lo admite, este texto se ve, no se ve, se ve, no se ve...

<BLOCKQUOTE> ...... </BLOCKQUOTE>

dijo:
Se utiliza para taular (anidar) bloques de texto (o lo que incluyas entre sus límites).
NOTA: Inicialmente, se utilizaba para añadir "Comillas", pero ahora, la mayoría de los exploradores las aceptan escritas directamente (como una letra más).

<BODY> ...... </BODY>

dijo:
Define la sección de "cuerpo" de un documento HTML.

<BR>

dijo:

Provoca un salto de línea en el lugar donde lo escribas. Por si no lo has notado, yo lo escribí entre las palabras "un" y "salto".
Es la manera de insertar saltos de línea en los textos con formato de párrafo (<P> entre otros...

<CAPTION> ...... </CAPTION>

dijo:
Se utiliza en las tablas (<TABLE>, para definir un títilo para la tabla.

<CENTER> ...... </CENTER>

dijo:
Centra entre los límites de la ventana de tu navegador...
Ésta línea, por ejemplo.
NOTA: Hay casos en que el centrado no es respecto de la ventana. Ver ampliación.

<CITE> ...... </CITE>

dijo:
Pasa un texto al formato utilizado para citas textuales (o casi).
"En un lugar de la red de cuyo nombre no puedo acordarme..."

<CODE> ...... </CODE>

dijo:
Marca un texto con la norma para códigos de lenguajes de programación.

IF (llueve) AND (estás al descubierto) THEN saca el paragüas ELSE te mojas END IF

NOTA: Es sólo un formato de texto; no se os ocurra programar algo, incluirlo entre éstas etiquetas, y pretender que el explorador ejecute el programa! (esto se puede hacer insertando scripts Java).

<DD>

dijo:
Identifica cada una de las definiciones dentro de una lista de definiciones (<DL>.

<DFN> ...... </DFN>

dijo:

Muestra el texto en el formato utilizado para definiciones.
NOTA: No lo confundáis con el <DD>. Si estáis haciendo una lista de definiciones es más correcto utilizar la etiqueta <DD>.

<DIR> ...... </DIR>

dijo:
Muestra una lista de elementos de texto a modo de filas y columnas. Algo parecido al famoso DIR /W del MS-DOS. Se utiliza la etiqueta <LI> para definir cada elemento. Lo mismo hace la etiqueta <LISTING>
NOTA: Los elementos no deben pasar de 20 caracteres de longitud. Ver ampliación.

<DL> ...... </DL>

dijo:
Crea una lista de definiciones. Como todo glosario, cada elemento de la lista consta de dos partes: el término que queremos definir (se especifica con la etiqueta <DT> y su definición correspondiente (con la etiqueta <DD>.

<DT> ...... </DT>

dijo:
Distingue el término del cual se hará la definición en una lista de definiciones. (<DL>.

<EM> ...... </EM>

dijo:
Adapta un texto al convenio utilizado para fragmentos enfatizados.

<FIG>

dijo:
Inserta una imagen en la página.
NOTA: Es similar al <IMG> pero no todos los navegadores lo interpretan correctamente (NETSCAPE no lo reconoce).
Ver ampliación.

<FONT> ...... </FONT>

dijo:
Cambia el tipo de letra del texto que se encuentre entre las etiquetas.
NOTA: Atributos esenciales. Ver ampliación.

<FORM> ...... </FORM>

dijo:
Crea un formulario para que el visitante envíe información al administrador de la página (mejor dicho: a donde éste quiera). Utiliza básicamente las etiquetas: <INPUT>, <TEXTAREA>, <SELECT> y <OPTION>.
NOTA: Su funcionamiento puede resultar algo complejo. Ver Ampliación.

<FRAME>

dijo:
Se utiliza para definir cada uno marcos (frames) dentro de una página de este tipo (<FRAMESET>. La página que estás viendo está dividida en dos "frames" verticales).
NOTA: Carece de sentido sin atributos. Ver Ampliación.

<FRAMESET> ...... </FRAMESET>

dijo:
Es la etiqueta utilizada para dividir la ventana del explorador en varias zonas diferentes. En cada una de estas zonas, se puede mostrar una página diferente. Esta lista es un ejemplo: tenéis a la izquierda un marco (frame en inglés), que funciona como índice para el marco de la derecha. Las divisiones deben definirse con etiquetas <FRAME>. NOTA: Una página con "frames" puede ser un poco difícil de programar (sobre todo si los marcos no son independientes). Ver Ampliación.

<H-> ...... </H->

dijo:
Cuidado, el guión lo debes sustituir por un número entre el 1 y el 6. Esta etiqueta se utiliza para formatear encabezamientos. El número se utiliza para indicar la importancia de lo que estás resaltando. La cabecera más importante llevará el
número 1
y la menos relevante,
el número 6
.
NOTA: La forma en la que se ven los textos, varía de un explorador a otro; aunque ésto lo puedes modificar utilizando las páginas de estilo (<STYLE>.

<HEAD> ...... </HEAD>

dijo:
Define la parte del documento que corresponde a la cabecera de tu página.

<HTML> ...... </HTML>

dijo:
Indica el comienzo y el fin de una página web. Es la primera y última instrucción de un documento. NO es imprescindible escribirla para que la página funcione correctamente. Es un formalismo (el cuál supongo que le sirve al lenguaje HTML como reafirmación personal , pero en el furuto parece ser que se hará obligatoria.
NOTA: Si la página es de las que se utilizan para definir documentos con marcos (ver <FRAMESET>, se DEBE omitir esta etiqueta.

<HR> ...... </HR>

dijo:
Inserta una línea de separación en el documento. Las que delimitan una definición de otra en esta página, son un ejemplo de lo que se obtiene si se utiliza sin atributos.

<I> ...... </I>

dijo:
Transforma el tipo de letra de un texto en cursiva.

<IMG>

dijo:
Inserta una imagen (GIF o JPG), en el punto exacto donde se escriba la instrucción (la lupa a la derecha de las etiquetas). Mira también <FIG>. NOTA: Es fundamental utilizar atributos. Ver ampliación.

<INPUT>

dijo:
Se utiliza junto con la instrucción <FORM>. Acepta información del lector/usuario de la página en varios formatos diferentes.
NOTA: Ver ampliación.

<ISINDEX>

dijo:
Sirve para buscar en una base de datos, lo que el usuario teclee.
NOTA: Ver ampliación.

<KBD> ...... </KBD>

dijo:
Da a un texto el formato utilizado para indicar que algo debe introducirse desde el teclado. NOTA: Es sólo un formato de texto, no implica que el usuario deba teclear nada en la página.

<LANG> ...... </LANG>

dijo:
Se usa para modificar el contexto lingüistico del fragmento incluído en su interior (vaya palabros que me han salido!). Es útil (o debería serlo) cuando necesitas, por ejemplo, que se vean correctamente las muy hispanas EÑES en ordenadores que están configurados con otra tabla de códigos diferente (creo que en la red hay alguno que otro...).
NOTA: Se deben incluir atributos. Ver ampliación.

<LH>

dijo:
Crea un encabezamiento en listaa ordenadas (<OL> y listas no ordenadas

.

<LI>

dijo:
Define un elemento en una lista del tipo: Listas ordenadas (<OL>, listas sin ordenar (<UL>, listas de menú (<MENU> y listas estilo directorio (<DIR>.

<LINK>

dijo:
Se utiliza para determinar, por ejemplo, funciones diferentes de las habituales a los botones BACK, FORWARD y HOME, de la barra de herramientas de algunos navegadores. Aún no lo reconocen los exploradores Web.

<LISTING> ...... </LISTING>

dijo:
Su función es similar a la de la etiqueta <DIR>. No aconsejo su utilización ya que acabará desapareciendo del lenguaje.

<MATH> ...... </MATH>

dijo:

Es muy útil cuando deseamos escribir fórmulas matemáticas de una manera sencilla (dentro de lo que cabe). Se pueden incluir caracteres muy difíciles (cuando no imposibles) de conseguir por teclado. Será incluso más útil cuando los exploradores la entiendan. (

<MENU> ...... </MENU>

dijo:
Es un tipo de lista que se consigue también como una variante de las listas no ordenadas <UL>. Sus elementos se enumeran dentro de éstas etiquetas con la instrucción <LI>.

<NEXTID>

dijo:
Es un elemento que utilizan los editores HTML para generar identificadores de páginas. Puedes ignorarlo completamente, ya que los exploradores también lo hacen.

<NOTE> ...... </NOTE>

dijo:
Más formatos de texto, éste es usado para diferenciar notas.

<OL> ...... </OL>

dijo:
Genera una lista ordenada. Inserta un número que corresponde a la posición del elemento en la lista (comienza a numerar a partir del 1, a menos que se indique lo contrario). Se puede definir un encabezamiento de la lista (<LH> y los elementos se definen con la etiqueta <LI>.

<OPTION>

dijo:
Etiqueta que se utiliza dentro de un formulario (<FORM>, para insertar cada una de las opciones de un cuadro de selección (<SELECT>.

<P> ...... </P>

dijo:
Indica al explorador que lo que sigue es un fragmento en forma de párrafo. El terminador se puede omitir y el párrafo acabará cuando se encuentre la siguiente etiqueta de párrafo. En el formato de párrafo, no se admite más de un espacio entre palabras (si hay más, el explorador los ignora). Tampoco se reconocen los saltos de línea que estén en el fragmento en forma de "ENTER"; para conseguir el salto de línea, se debe incluir la etiqueta <BR>.

<PERSON> ...... </PERSON>

dijo:
Se utiliza para destacar nombres de personas.

<PRE> ...... </PRE>

dijo:
Designa un trozo del documento como texto preformateado. Esto significa que el explorador mostrará el texto tal y como lo has escrito en el documento original; respetando TODOS los espacios, los finales de línea, los caracteres especiales (como < > etc...). Pero cuidado, NO ignora las etiquetas válidas que se incluyan (la instrucción <XMP> si lo hace).

<PLAINTEXT>

dijo:
Otra instrucción del estilo <XMP>. Como ves, no lleva terminador con lo que a partir de esta instrucción, todo lo que venga detrás será tomado como un texto normal y corriente.
NOTA: Esta etiqueta está cayendo en desuso y será retirada del lenguaje en futuras versiones.

<S> ...... </S>

dijo:
Se utiliza para tachar un texto.

<SAMP> ...... </SAMP>

dijo:
Formatea un texto para que se muestre como un ejemplo.

<SELECT> ...... </SELECT>

dijo:
Se incluye dentro de un formulario (<FORM>. Crea un cuadro de selección con opciones predefinidas... si, si, esos que se despliegan cuando, con el ratón, se pulsa sobre la flechita! Cada una de las opciones predefinidas, se crea con la etiqueta <OPTION>.

<SMALL> ...... </SMALL>

dijo:
Reduce el tamaño de las fuentes, respecto de la fuente que se esté utilizando en esa parte del documento.

<STRONG> ...... </STRONG>

dijo:
Enfatiza caracteres. Como las negritas (<B>.

<STYLE> ...... </STYLE>

dijo:
Son las páginas de estilos. Se utilizan para cambiar el aspecto que tendrán los encabezamientos <H->, las anclas <A> y muchas otras cosas más. Estas definiciones afectarán a toda la página en la que se incluya. NOTA: Ver ampliación.

<SUB> ...... </SUB>

dijo:
Convierte un fragmento a subíndices.

<SUP> ...... </SUP>

dijo:
Da formato de superíndices a un texto.

<TABLE> ...... </TABLE>

dijo:
Define una tabla dentro de una página web. Admite algunos atributos y tiene unas etiquetas específicas para poner título a la tabla (<CAPTION>, incluir cabeceras columnas (<TH>, crear filas (<TR> y celdas dentro de éstas últimas (<TD>.
NOTA: Las tablas tienen una ingente cantidad de variantes y atributos. Ver ampliación.

<TD>

dijo:
Dentro de una tabla (<TABLE>, y en una fila determinada, indica que lo que se escriba a la derecha (hasta el próximo <TD> ó <TR> forma parte de una celda.

<TEXTAREA>

dijo:

Funciona dentro de los formularios (<FORM>, para que el lector de tu página, te envíe un texto con varias líneas.
NOTA: Necesita atributos. Ver ampliación.

<TITLE> ...... </TITLE>

dijo:
Es lo que da nombre a la página. Si utilizas Windows y NETSCAPE ó EXPLORER, es el texto que aparece arriba del todo (donde están los botones de control de la ventana).

<TR>

dijo:
Se utiliza en las tablas (<TABLE> para indicar dónde comienza una nueva fila. No tiene terminador (una línea acaba donde empieza la siguiente, como eso que se dice sobre la libertad ¿no?).

<TT> ...... </TT>

dijo:
Otro formato de textos, éste simula caracteres tipográficos.

<U> ...... </U>

dijo:
Añade un subrayado al texto que incluyas.

<UL> ...... </UL>

dijo:
Crea una lista de elementos desordenada. Cada uno de los elementos de la lista de definen con <LI>. Mira también <MENU>.

<VAR> ...... </VAR>

dijo:
Muestra un texto con el formato utilizado para distinguir variables.

<XMP> ...... </XMP>

dijo:
Funciona como la etiqueta <PRE> pero a diferencia de ésta, <XMP> ignora completamente la función de las etiquetas que se incluyan dentro de ella y las escribe como si fueran texto normal. Como imaginarás, no puedes cambiar tipos de letra ni tamaños dentro de la instrucción, pero sí desde un punto del documento inmediatamente anterior al inicio de la instrucción <XMP>.
Algo parecido hace la etiqueta <PLAINTEXT>.

Con esto saben todo lo basico de un webmaster, con esto podran empezar a tener una nocion del HTML.

Espero que te sirva .:. comentar es agradecer.:.