¿CÓMO CREAR UNA PAGINA DE INICIO?
¿Es necesario que el archivo de mi página principal se llame "index.html"?.
Sí. Para que aparezca su página principal cuando visite la URL, debe tener un archivo de nombre index.html. Puede modificar esa página, o, cargar una nueva, pero en ambos casos debe llamarse index.html. ¡Atención!: en los nombres de archivo se diferencian mayúsculas y minúsculas, así "index.html" no es igual que "Index.html" o "INDEX.HTML". Además, ".htm" es distinto de ".html". De esta forma, cuando un navegante teclee la dirección de su web: http://pepito, o juanito.com/nombre El servidor le estará mostrando de forma automática la dirección: http://juanito, o pepito.com/nombre/index.html Por tanto, es necesario que su página principal tenga exactamente el nombre index.html.
¿CÓMO EMPIEZA EL CODIGO HTML DE UNA PAGINA?
A continuación, se detalla el formato básico para una página en HTML:
<HTML>
<HEAD>
<TITLE> Título </TITLE>
</HEAD>
<BODY>
Aquí se introducen las tablas, las fotos, enlaces, etc.
</BODY>
</HTML
Las páginas empiezan con la etiqueta <HTML>, seguida por las etiquetas <HEAD>. Encontrará las etiquetas para introducir el nombre de la página en las etiquetas
<TITLE>. Se trata del título que aparece en la esquina izquierda superior de su navegador al acceder a la página. Note que se cierran las etiquetas TITLE y HEAD antes de introducir el contenido en sí de la página dentro de las etiquetas <BODY>.
¿CÓMO CREAR PARRAFOS?
Para crear un nuevo párrafo sólo tiene que añadir una etiqueta <P> delante del texto. Así se crea una línea en blanco antes de empezar el párrafo.
Los saltos de línea se crean con la etiqueta <BR>, que hace que el texto comience una línea por debajo de la anterior, pero sin insertar ninguna línea en blanco.
También observará que puede usar la barra espaciadora del teclado mientras modifica textos HTML, aunque el navegador convertirá todos esos espacios a un espacio como máximo.
Para crear más de un espacio debe usar la etiqueta & nbsp; (por favor, no incluya el espacio en blanco que figura entre & y nbsp.
Al insertar esta etiqueta en el texto está indicando al navegador que desea insertar espacios en la línea…
TEXTO NEGRILLA:
<b> texto </b>
TEXTO CURSIVA:
<i> texto </i>
TEXTO SUBRAYADO:
<u> texto </u>
TEXTO TACHADO:
<s> texto </s>
TEXTO MEDIO BORROSO:
<span style="height: 20;filter:blur(add=1,direction=270,strength=10)">texto</span>
TEXTO DE NIVELES:
<H1> texto </H1> | <H2> texto </H2> | <H3> texto </H3> | <H4> texto </H4> | <H5> texto </H5> | <H6> texto </H6> |
TEXTO MODO MAQUINA DE ESCRIBIR:
<tt> texto </tt>
TEXTO MODO FANTASMA:
<span style="height: 1; Filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, FinishX=100%)">texto</span>
TEXTO SUPERINDICE:
<sup> texto </sup>
TEXTO SUBINDICE:
<sub> texto </sub>
PROPIEDADES DEL TEXTO:
Para modificar un texto la etiqueta es la siguiente:
<font> texto </font>
ES PRIMORDIAL ESTA ETIQUETA QUE TAMBIEN PUEDE REMPLAZARSE POR LA ETIQUETA: <span> texto </span>
Dentro de <font> o <span> es donde se le dan las especificaciones por medio
de etiquetas.
ETIQUETA - FUNCION
face=”tipo de letra” elegir el tipo de letra que se quiera hay muchas en Word
size=numero elegir el tamaño del texto
color=”color” elegir el color del texto TAMBIEN SE PUEDE EN BINARIO
EJEMPLO:
<p align=”center”><font face=”simpson” size=15 color=”red”>!HOLA¡</font>
y esta es para alinear generalmente se utiliza solo en texto:
<p align=”dirección”> NO NECESITA CERRARSE
p se puede remplazar por div EJEMPLO:
<div align=”center”><font face=”simpson” size=15 color=”red”>!HOLA¡</font>
¿CÓMO PONER COLOR A UNA PAGINA WEB?
Para darle colores a una página, debes darle la orden luego de la etiqueta.
Ahora los colores se nombran ya sea en su nombre correspondiente en Inglés, o también en sus códigos respectivos en números.

Ejemplo 1:
< body bgcolor="black" text="white" >
Ejemplo 2:
< body bgcolor="#000000" text="#FFFFFF" >
Esto hará que tu página sea con un fondo de color negro y el texto blanco.
¿CÓMO CAMBIAR LOS COLORES DEL FONDO Y TEXTO?
La etiqueta <BODY> controla los colores, las imágenes de fondo y algunas otras características.
Puede controlar el color del fondo, texto y enlaces de la página principal por medio de la etiqueta <BODY>.
Para establecer el color del fondo, texto, enlace, enlace visitado o enlace activo, sustituya el valor de un color modificando los seis caracteres que aparecen tras el símbolo "#" como en el siguiente ejemplo.
No haga que todos ellos tengan el mismo color, ya que de hacerlo no vería nada en la página (porque tanto el fondo como el texto tendrían el mismo color).
Puede incluir cualquiera de los siguientes elementos (BGCOLOR, TEXT, LINK, VLINK o ALINK), o no incluir ninguno de ellos.
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#="#0000FF" VLINK="#="#009900" ALINK="#FF0000">
Éstos son algunos colores que puede usar:
Blanco
Amarillo
Rojo
Gris
Azul
Verde
Negro
Morado
Azul claro
#FFFFFF
#FFFF66
#FF0000
#CC9999
#0000FF
#00FF00
#000000
#CC33FF
#00CCFF
Estos valores hexadecimales representan la combinación de Rojo, Verde y Azul (RGB) que produce el color en cuestión.
¿CÓMO SE CREAN LOS LINKS?
En la página puede crear enlaces que señalen a:
1. Una página o archivo del directorio
2. Una página o archivo de un subdirectorio
3. Una ubicación externa (en Internet)
Para crear un enlace a una página o archivo del mismo directorio que el de la página que se modifica, basta con usar la ruta de acceso relativa, con lo que el enlace sólo incluirá el nombre del archivo:
<a href="pagina.html">Página siguiente</a>
En la página aparecerá el texto "Página siguiente", y al hacer clic en él aparecerá la página cuyo archivo se denomina pagina.html.
Si desea cambiar el texto del enlace sustituya "Página siguiente" por el que desee usar. Además, si desea que el enlace señale a otra página, bastará con que sustituya "pagina.html"
por el nombre de ese archivo.
Cuando el enlace sea a un subdirectorio, debe usar este formato:
<a href="subdirectorio/pagina.html">Página siguiente</a>
Al crear un enlace a una página externa al directorio, o en Internet, basta con usar la dirección completa (denominada ruta de acceso absoluta) en lugar de la ruta de acceso relativa:
<a href="http://servidor.com. ó, .es">Ir a Mi página!</a>
El código anterior, crea un enlace que permite ir a la página "seleccionada!".
¿CÓMO CREAR GRAFICOS EN MINIATURA?
La página puede incluir gráficos en miniatura enlazados a las versiones en tamaño completo de las imágenes (también llamados "thumbnails", para ello debe tener dos versiones distintas de la imagen: una en miniatura y la otra de tamaño completo.
Para ello debe crear al menos dos páginas, una para la imagen en tamaño completo y otra con los gráficos en miniatura.
Supongamos que el nombre de la imagen es "imagen.gif" y la página en la que desea incluir esta imagen se llama "pagina1.html". En esa página debe incluir este código:
<img src="imagen.gif">
En la página de los gráficos en miniatura debe crear enlaces a la página "pagina1.html".
<a href="pagina1.html"><img src="miniatura.gif"></a>
miniatura.gif es la versión pequeña de la imagen e incluye un enlace a la pagina1.html, que es la que tiene la imagen en tamaño completo.
Para cambiar correctamente el tamaño de las imágenes debe usar un programa de edición de imágenes o agregando las etiquetas WIDTH=numero PARA EL ANCHO DE LA IMAGEN Y HEIGHT=numero PARA EL LARGO DE LA IMAGEN
EJEMPLO:
<img src=”imagen.gif width=100 height=100> AQUI SALDRIA LA IMAGEN CON 100 DE ANCHO Y 100 DE LARGO
¿CÓMO AGREGAR MUSICA DE FONDO?
Hay dos juegos de códigos diferentes cuyo uso se recomienda para hacer que suene una música de fondo cuando alguien visite la página. Microsoft Internet Explorer usa la etiqueta <BGSOUND SRC>, mientras que Netscape Navigator usa <EMBED>. Incluya el código siguiente (dentro de la etiqueta HEAD) para que la página tenga una música de fondo:
<EMBED SRC="musica.mid" AUTOSTART=TRUEHIDDEN=TRUE><NOEMBED><BGSOUND SRC="musica.mid"></NOEMBED>
Sustituya "musica.mid" por el nombre actual del archivo que desea usar.
También puede hacer que la música de fondo suene ininterrumpidamente, hasta que el visitante haga clic en el botón "DETENER" del navegador, o vaya a otra página. Éste es el mismo código del ejemplo anterior, pero con reproducción continua:
<EMBED SRC="musica.mid" AUTOSTART="TRUE" HIDDEN="TRUE" LOOP="TRUE"><NOEMBED><BGSOUND SRC="musica.mid" LOOP="INFINITE"></NOEMBED>
Atención: tenga en consideración que el archivo de sonido que utilice como música de fondo debe estar entre los archivos de su página (como las imágenes) y que deberá cargarlo utilizando la herramienta de Carga Fácil (desde el Administrador de archivos) o un programa de FTP.
¿COMO CREAR UN ENLACE AL CORREO ELECTRONICO?
Claro que sí. Ese enlace se denomina "mail-to" ya que ése es el formato del código:
<A HREF="mailto:nombre@servidor.es">enviar un mensaje de correo</A>
El código anterior hace que aparezca en la página el texto "enviar un mensaje de correo", al hacer clic en ese texto se abre una nueva ventana del programa de correo predeterminado con la dirección de correo-e ya escrita en el campo "PARA:". Este enlace sólo funciona correctamente cuando el visitante usa un programa de correo-e para enviar correo electrónico.
Otra posibilidad que funciona en cualquier caso consiste en usar la opción "¡Envíeme un correo-e!" en el Cajetín Publicitario. Si tiene incluido dicho Cajetín en su página principal (situado en la esquina superior derecha), puede activar el enlace "¡Envíeme un correo-e!". Cuando un visitante haga clic en él, pasará a una página Web donde puede escribirle un mensaje. Ese mensaje se enviará a la dirección de correo que elija al personalizar el Cajetín Publicitario.
¿CÓMO CREAR IMAGEN DE FONDO PARA MI WEB?
Claro que sí. Al añadir el atributo BACKGROUND a la etiqueta BODY puede hacer que un mosaico de imágenes cubra completamente el fondo. Recuerde que la imagen se muestra en forma de mosaico, por eso puede usar una imagen pequeña y cubrir totalmente la página. Es aconsejable usar imágenes pequeñas para que la página se cargue con mayor rapidez. Utilice el código siguiente para incluir una imagen como fondo.
<BODY BACKGROUND="imagen.jpg">
Sustituya "imagen.jpg" por el nombre real del archivo de imagen.
Nota importante: si ya ha creado la página y ésta ya incluye una etiqueta BODY, debe añadir dentro de esa etiqueta el atributo BACKGROUND. No cree una nueva etiqueta BODY.
COMO CREAR LISTAS:
Hay dos etiquetas para hacer esto:
<UL> Que sirve para hacer listas desordenadas o viñetas
</UL> la de puntitos por si no has entendido
O si prefieres ser más ordenado:
<OL> Que sirve para hacer listas ordenadas o numerales
</OL> la de numeritos por si no has entendido
Ahora que ya hayas elegido alguna de las dos sigue otra etiqueta que va en medio de <UL>………</UL> U <OL>………</OL> esa etiqueta es:
<LI> NO NECESITA CERRARSE
Esta sirve para colocar una viñeta o numeral según hayas elegido.
EJEMPLO:
ETIQUETA RESULTADO ETIQUETA RESULTADO
<UL> <OL>
<LI>hola • hola <LI>hola 1. hola
<LI>como • como <LI>como 2. como
<LI>si • si <LI> si 3. si
</UL> </OL>

COMO CREAR UNA LINEA SEPARADORA:
Para hacer una línea separadora que es de extremo a extremo se pone donde se quiera la siguiente etiqueta la cual NO NECESITA CERRARSE:
<HR>
COMO CREAR UNA CITA:
Para crear una cita se utiliza la siguiente etiqueta:
<blockquote><span class="texto_mini">Cita:</span><hr>ejemplo de cita <hr></blockquote>
Y para colocarle titulo se modifica Cita por el titulo deseado
COMO CREAR UNA MARQUESINA:
Una marquesina es un texto que se desliza en un área determinada y en una dirección determinada y sus etiquetas son:
<marquee behavior=scroll direction=direccion scrollamount=1 height=60>texto</marquee>
Si se pone <marquee>texto</marquee> es automáticamente hacia la izquierda Y NO SOLO PARA TEXTO TAMBIEN SIRVE PARA IMAGENES.
Y PARA PERSONALIZARLO SOLO HAY QUE MODIFICAR LAS ETIQUETAS:
Direction= la dirección que quieras pero en ingles aquí van:
ARRIBA - up
ABAJO - down
A LA IZQUIERDA - left
A LA DERECHA - right
Scrollmount= el numero que quieras de velocidad con que se mueva por ejemplo si cambias el 1 por un 10 será 10 veces mas rápido.
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 podes 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:
<HTML>
<HEAD>
<TITLE>Redireccionado por www.GratiZone.com</TITLE>
<SCRIPT LANGUAGE="JavaScript">
location.href='http://www.GratiZone.com ';
</SCRIPT>
</HEAD>
<BODY>
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.
<script language='JavaScript'>window.open('http://www.GratiZone.com', '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.
<script language="Javascript">
<!-- Begin
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false"
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
// End -->
</script>
HORAS RESTANTES PARA FINALIZAR EL DÍA:
Con este código insertamos un pequeño relojito que indica la cuenta regresiva de las horas, minutos y segundos que faltan para finalizar el día.
<body>
<p>El reloj...</p>
<form name="Reloj">
<input type="text" size="7" name="tiempo" value="mm:hh:ss" title="Tiempo restante para finalizar el día">
<script language="JavaScript">
<!--
var tiempoAtras;

updateReloj();
function updateReloj() {
var tiempo = new Date();
var hora = 23-tiempo.getHours();
var minutos = 59-tiempo.getMinutes();
var segundos = 59-tiempo.getSeconds();

tiempoAtras= (hora < 10) ? hora :hora;
tiempoAtras+= ((minutos < 10) ? ":0" : ":" + minutos;
tiempoAtras+= ((segundos < 10) ? ":0" : ":" + segundos;

document.Reloj.tiempo.value = tiempoAtras;

setTimeout("updateReloj()",1000);
}
//-->
</script>
</form>
</body>
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.
<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.
<H2>Libro de visitas de www.GratiZone.com</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>
CREAR UN TÍTULO QUE CAMBIA DE COLORES:
Con este código podemos crear por ejemplo el título para nuestra Web o una de nuestras secciones.
<!-- inicio de head-->
<script>
mesk=new
Array();mesk[10]="A";mesk[11]="B";mesk[12]="C";mesk[13]="D";mesk[14]="E";mesk[15]="F";A=10;B=11;C=12;D=13;E=14;F=15;let="ABCDEF";function
mes(num){if(let.indexOf(num) != -1){return eval(num)};else{if(num
< 10){return eval(num)};else{return mesk[num]}}};

function color(begin,einde,stappen,stap){
hh1=(mes(begin.charAt(0))*16)+mes(begin.charAt(1));
hh2=(mes(begin.charAt(2))*16)+mes(begin.charAt(3));
hh3=(mes(begin.charAt(4))*16)+mes(begin.charAt(5));
pp1=(mes(einde.charAt(0))*16)+mes(einde.charAt(1));
pp2=(mes(einde.charAt(2))*16)+mes(einde.charAt(3));
pp3=(mes(einde.charAt(4))*16)+mes(einde.charAt(5));

if(hh1 < pp1){ff1=hh1+Math.floor((pp1-hh1)/stappen*stap);
ff1=eval("\'"+mes(Math.floor(ff1/16))+"\'"+eval("\'"+mes(ff1-(Math.floor(ff1/16)*16))+"\'";}

;else{ff1=hh1-Math.floor((hh1-pp1)/stappen*stap);
ff1=eval("\'"+mes(Math.floor(ff1/16))+"\'"+eval("\'"+mes(ff1-(Math.floor(ff1/16)*16))+"\'";}

if(hh2 < pp2){ff2=hh2+Math.floor((pp2-hh2)/stappen*stap);
ff2=eval("\'"+mes(Math.floor(ff2/16))+"\'"+eval("\'"+mes(ff2-(Math.floor(ff2/16)*16))+"\'";}

;else{ff2=hh2-Math.floor((hh2-pp2)/stappen*stap);
ff2=eval("\'"+mes(Math.floor(ff2/16))+"\'"+eval("\'"+mes(ff2-(Math.floor(ff2/16)*16))+"\'";}

if(hh3 < pp3){ff3=hh3+Math.floor((pp3-hh3)/stappen*stap);
ff3=eval("\'"+mes(Math.floor(ff3/16))+"\'"+eval("\'"+mes(ff3-(Math.floor(ff3/16)*16))+"\'";}

;else{ff3=hh3-Math.floor((hh3-pp3)/stappen*stap);
ff3=eval("\'"+mes(Math.floor(ff3/16))+"\'"+eval("\'"+mes(ff3-(Math.floor(ff3/16)*16))+"\'";}

;return ff1+ff2+ff3}
bum=0;bum2=0;txt=new Array();txt[0]="";function lightf(){
for(i=0;i !=
Math.floor(message.length/2);i++){txt=color(lightcolor1,lightcolor2,Math.floor(message.length/2),i)};

for(i=Math.floor(message.length/2);i !=
message.length;i++){txt=color(lightcolor2,lightcolor1,Math.floor(message.length/2),(i-Math.floor(message.length/2)))};

lightf1()}
function
lightf1(){txt[message.length+1]="";bum2=message.length-bum;for(i=0;i !=
message.length;i++){if(i+bum
< message.length){txt[message.length+1]=txt[message.length+1]+"<font color='#"+txt[(i+bum)]+"'>"+message.charAt(i)+"</font>"};else{txt[message.length+1]=txt[message.length+1]+"<font color='#"+txt[i-bum2]+"'>"+message.charAt(i)+"</font>"
}};if(bum !=
message.length){bum++;};else{bum=0};light.innerHTML=txt[message.length+1];setTimeout("lightf1()",50)}

</script>
</head>

<body bgcolor="#FFFFFF" background="globulos.jpg">
<!--inicio del body -->
<center><h1><div id="light"></div></h1>
<script>
lightcolor1="FF0000" // color
lightcolor2="33CC66" // color
message="Título que cambia de colores" // introduce el texto
lightf()
</script>
</center>
<!--fin del body -->
CUADRO EXPLICATIVO DE LOS ENLACES:
Sorprende a tus visitantes con este asombroso truco. Al pasar el mouse sobre el link, aparece la explicación de ese link en un cuadro con la cantidad de palabras que queramos poner. Solo tenés que reemplazar mis direcciones por las tuyas, y el texto deseado por el tuyo.
<p>
<script language="JavaScript"><!--
function escribe(frase){document.desplaza.cuadro.value=frase; }
// --></script>
</p>
<table border="0">
<tr>
<td width="200"><p align="center"><strong>Opciones.</strong></p>

<p><a href="http://www.CheNico.com"
onmouseover="escribe(' Página principal\n ----------------\n\n Cuando hagas Click en este enlace irás directamente a la página de inicio de mi web');">Página
principal</a><br>
<a href="http://***/pauluk/trucosprin.htm"
onmouseover="escribe(' Trucos PC\n -----------\n\n Este enlace te llevará a la página de Trucos PC en la que podés encontrar muchos más trucos interesantes para realizar e incluir en tus páginas web');">Trucos PC</a><br>
<a href="http://***/pauluk/GLOSARIO.HTM"
onmouseover="escribe(' Glosario\n -------------- \n\n Diccionario de Términos Informáticos. Enterate el significado de esas palabras de computación que decís todos los días pero que no sabés exactamente qué significa.');">Glosario</a><br>
</p>
</td>
<td><form name="desplaza">
<p><textarea name="cuadro" rows="8" cols="30"
wrap="physical"></textarea></p>
</form>
</td>
</tr>
</table>
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:
<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:
<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.
EFECTO NIEVE CON CUALQUIER IMAGEN:
Con este truco podés hacer que caigan por la pantalla varias veces la misma imagen con un efecto estilo nieve.
<script>
var no = 5; // snow number
var speed = 15; // smaller number moves the snow faster
var snowflake = "snow.gif";

var ns4up = (document.layers) ? 1 : 0; // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 400, doc_height = 500;
if (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = 500;
doc_height = 500;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++ i) {
dx = 0; // set coordinate variables
xp = Math.random()*(doc_width-50); // set position variables
yp = Math.random()*doc_height;
am = Math.random()*20; // set amplitude variables
stx = 0.02 + Math.random()/10; // set step variables
sty = 0.7 + Math.random(); // set step variables
if (ns4up) { // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ";
document.write("top=\"15\" visibility=\"show\"><img src=\"";
document.write(snowflake + "\" border=\"0\"></layer>";
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ";
document.write("top=\"15\" visibility=\"show\"><img src=\"";
document.write(snowflake + "\" border=\"0\"></layer>";
}
} else if (ie4up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ";
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ";
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"";
document.write(snowflake + "\" border=\"0\"></div>";
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ";
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ";
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"";
document.write(snowflake + "\" border=\"0\"></div>";
}
}
}
function snowNS() { // Netscape main animation function
for (i = 0; i < no; ++ i) { // iterate for every dot
yp += sty;
if (yp > doc_height-50) {
xp = Math.random()*(doc_width-am-30);
yp = 0;
stx = 0.02 + Math.random()/10;
sty = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx += stx;
document.layers["dot"+i].top = yp;
document.layers["dot"+i].left = xp + am*Math.sin(dx);
}
setTimeout("snowNS()", speed);
}

function snowIE() { // IE main animation function
for (i = 0; i < no; ++ i) { // iterate for every dot
yp += sty;
if (yp > doc_height-50) {
xp = Math.random()*(doc_width-am-30);
yp = 0;
stx = 0.02 + Math.random()/10;
sty = 0.7 + Math.random();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx += stx;
document.all["dot"+i].style.pixelTop = yp;
document.all["dot"+i].style.pixelLeft = xp + am*Math.sin(dx);
}
setTimeout("snowIE()", speed);
}

if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
</script>
SUBRAYAR UN LINK AL PASAR EL MOUSE:
Con este código podemos lograr ese tan conocido efecto que al pasar el mouse sobre un link, este se subraye. Podemos hacer que tenga un color antes de visitar el link, y que tenga otro una vez visitado.
<STYLE type="text/css">
<!--
A:link {COLOR: red; TEXT-DECORATION: none}
A:visited {COLOR: gray; TEXT-DECORATION: none}
A:active {TEXT-DECORATION: none}
A:hover {COLOR: blue; TEXT-DECORATION: underline} -->
</STYLE>
</p>
<p><a href="l1.htm">El texto que quieras.</a><br>
<a href="l2.htm">otro texto.</a><br>
<a href="l3.htm">Otro texto.</a><br>
</p>
TRANSFORMAR EL CURSOR EN UNA MIRA:
Transformá la clásica flechita de Windows en una mira de disparo.
<style type="text/css">
<!--
body { cursor: crosshair}
-->
</style>
TABLA DE COLORES HTML:
Esta tabla contiene todos los códigos para ponerle colores a las barras de desplazamiento, a las fuentes y muchas otras funciones más.
Si no da por el nombre da por los códigos.

Nombre del color Código del color Apariencia
White #FFFFFF
Red #FF0000
Green #00FF00
Blue #0000FF
Magenta #FF00FF
Cyan #00FFFF
Yellow #FFFF00
Black #000000
Aqua #70DB93
Baker's Chocolate #5C3317
Blue Violet #9F5F9F
Brass #B5A642
Bright Gold #D9D919
Brown #A62A2A
Bronze #8C7853
Bronze II #A67D3D
Cadet Blue #5F9F9F
Cool Copper #D98719
Copper #B87333
Coral #FF7F00
Corn Flower Blue #42426F
Dark Brown #5C4033
Dark Green #2F4F2F
Dark Green Copper #4A766E
Dark Olive Green #4F4F2F
Dark Orchid #9932CD
Dark Purple #871F78
Dark Slate Blue #6B238E
Dark Slate Grey #2F4F4F
Dark Tan #97694F
Dark Turquoise #7093DB
Dark Wood #855E42
Dim Grey #545454
Dusty Rose #856363
Feldspar #D19275
Firebrick #8E2323
Forest Green #238E23
Gold #CD7F32
Goldenrod #DBDB70
Gray #C0C0C0
Green Copper #527F76
Green Yellow #93DB70
Hunter Green #215E21
Indian Red #4E2F2F
Khaki #9F9F5F
Light Blue #C0D9D9
Light Grey #A8A8A8
Light Steel Blue #8F8FBD
Light Wood #E9C2A6
Lime #32CD32
Mandarian Orange #E47833
Maroon #8E236B
Medium Aquamarine #32CD99
Medium Blue #3232CD
Medium Forest Green #6B8E23
Medium Goldenrod #EAEAAE
Medium Orchid #9370DB
Medium Sea Green #426F42
Medium Slate Blue #7F00FF
Medium Spring Green #7FFF00
Medium Turquoise #70DBDB
Medium Violet Red #DB7093
Medium Wood #A68064
Midnight Blue #2F2F4F
Navy #23238E
Neon Blue #4D4DFF
Neon Pink #FF6EC7
New Midnight Blue #00009C
New Tan #EBC79E
Old Gold #CFB53B
Orange #FF7F00
Orange Red #FF2400
Orchid #DB70DB
Pale Green #8FBC8F
Pink #BC8F8F
Plum #EAADEA
Quartz #D9D9F3
Rich Blue #5959AB
Salmon #6F4242
Scarlet #8C1717
Sea Green #238E68
Semi-Sweet Chocolate #6B4226
Sienna #8E6B23
Silver #E6E8FA
Sky Blue #3299CC
Slate Blue #007FFF
Spicy Pink #FF1CAE
Spring Green #00FF7F
Steel Blue #236B8E
Summer Sky #38B0DE
Tan #DB9370
Thistle #D8BFD8
Turquoise #ADEAEA
Very Dark Brown #5C4033
Very Light Grey #CDCDCD
Violet #4F2F4F
Violet Red #CC3299
Wheat #D8D8BF
Yellow Green #99CC32
CÓDIGO COLOR
#000000
#000033
#000066
#000099
#0000CC
#0000FF
#003300
#003333
#003366
#003399
#0033CC
#0033FF
#006600
#006633
#006666
#006699
#0066CC
#0066FF
#009900
#009933
#009966
#009999
#0099CC
#0099FF
#00CC00
#00CC33
#00CC66
#00CC99
#00CCCC
#00CCFF
#00FF00
#00FF33
#00FF66
#00FF99
#00FFCC
#00FFFF
CÓDIGO COLOR
#330000
#330033
#330066
#330099
#3300CC
#3300FF
#333300
#333333
#333366
#333399
#3333CC
#3333FF
#336600
#336633
#336666
#336699
#3366CC
#3366FF
#339900
#339933
#339966
#339999
#3399CC
#3399FF
#33CC00
#33CC33
#33CC66
#33CC99
#33CCCC
#33CCFF
#33FF00
#33FF33
#33FF66
#33FF99
#33FFCC
#33FFFF
CÓDIGO COLOR
#660000
#660033
#660066
#660099
#6600CC
#6600FF
#663300
#663333
#663366
#663399
#6633CC
#6633FF
#666600
#666633
#666666
#666699
#6666CC
#6666FF
#669900
#669933
#669966
#669999
#6699CC
#6699FF
#66CC00
#66CC33
#66CC66
#66CC99
#66CCCC
#66CCFF
#66FF00
#66FF33
#66FF66
#66FF99
#66FFCC
#66FFFF
CÓDIGO COLOR
#990000
#990033
#990066
#990099
#9900CC
#9900FF
#993300
#993333
#993366
#993399
#9933CC
#9933FF
#996600
#996633
#996666
#996699
#9966CC
#9966FF
#999900
#999933
#999966
#999999
#9999CC
#9999FF
#99CC00
#99CC33
#99CC66
#99CC99
#99CCCC
#99CCFF
#99FF00
#99FF33
#99FF66
#99FF99
#99FFCC
#99FFFF
CÓDIGO COLOR
#CC0000
#CC0033
#CC0066
#CC0099
#CC00CC
#CC00FF
#CC3300
#CC3333
#CC3366
#CC3399
#CC33CC
#CC33FF
#CC6600
#CC6633
#CC6666
#CC6699
#CC66CC
#CC66FF
#CC9900
#CC9933
#CC9966
#CC9999
#CC99CC
#CC99FF
#CCCC00
#CCCC33
#CCCC66
#CCCC99
#CCCCCC
#CCCCFF
#CCFF00
#CCFF33
#CCFF66
#CCFF99
#CCFFCC
#CCFFFF
CÓDIGO COLOR
#FF0000
#FF0033
#FF0066
#FF0099
#FF00CC
#FF00FF
#FF3300
#FF3333
#FF3366
#FF3399
#FF33CC
#FF33FF
#FF6600
#FF6633
#FF6666
#FF6699
#FF66CC
#FF66FF
#FF9900
#FF9933
#FF9966
#FF9999
#FF99CC
#FF99FF
#FFCC00
#FFCC33
#FFCC66
#FFCC99
#FFCCCC
#FFCCFF
#FFFF00
#FFFF33
#FFFF66
#FFFF99
#FFFFCC
#FFFFFF

COMENTARIO SOBRE UN LINK EN LA BARRA DE ESTADO:
Al pasar el mouse sobre el link deseado, veremos en la barra de estado un comentario sobre éste.
<a href="http://www.GratZone.com"
onmouseout="window.status=''"
onmouseover="window.status='Acá aparece el mensaje que quieras';return true">
Pauluk Computación</a>
DIFICULTAR COPIA DE PÁGINA:
Con este recurso sencillo podemos hacer más difícil el acceso al código-fuente o la copia de imágenes de nuestro sitio. Cuando el visitante haga click con el botón derecho del mouse, surgirá un mensaje creado previamente por nosotros. Recordemos que a algunas personas no les gusta este tipo de bloqueo. Nosotros tenemos que decidir si queremos incluirlo o no en nuestras páginas.
Podemos colocarlo antes de la etiqueta <html> o después de la etiqueta <body>.

<Script language=JavaScript>
function right(e) {
if (navigator.appName == 'Netscape' && (e.which == 3 || e.which == 2)){
alert("Coloca el mensaje aquí.";
return false;
}
else if (navigator.appName == 'Microsoft Internet Explorer' &&
(event.button == 2 || event.button == 3)) {
alert("Coloca el mensaje aquí.";
return false;
}
return true;
}
document.onmousedown=right;
if (document.layers) window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=right;
</script>

Nota: Para evitar este truco, también hay un contratruco, si entrás a una página que tiene este truco que no te deja copiar imágenes o texto, solo tenés que hacer click con el botón derecho del mouse sobre la barra de estado y sin soltarlo arrastrarlo hasta la imágen. Listo, se abrirá el menú como si la página no estuviese bloqueada a la copia. Hay que tener en cuenta que muy poca gente conoce este truco, por lo tanto podés usar tranquilo el truco de bloqueo.
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.
<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.GratiZone.com');">
<FONT face=Arial color=#000000 size=-2><U>
Establecer como página de inicio</U></FONT></A>
ENVIAR UN E-MAIL CON ASUNTO Y MENSAJE:
Con este truco podés hacer que al hacer clic sobre una palabra, se abra el Outlook para enviar un mensaje con tu dirección, el asunto que quieras y el texto que quieras.
<a href="mailto:webmaster@pauluk.8k.com?subject=Prueba.&body=Estoy probando el truco...">Hacé clic acá para mandarme un mensaje</a>

ABRIR UN LINK EN UNA VENTANA NUEVA:
Cuando tenemos Links en nuestras páginas y alguien hace clic sobre ellos, automáticamente se abre esa dirección en nuestra ventana. Con este truco podemos hacer que al hacer clic sobre un determinado Link, esta dirección se abra en una ventana nueva, quedando la nuestra también abierta:
<a href="http://www.GratiZone.com" target="_blank">Pauluk Computación</a>