Dejemos las cosas claras ...
Comprendo que tendrás muchas ideas de como quieres que sea tu
página. Pues bien, lo fundamental es el contenido o sea lo
que vas a contar a la gente, no está mal que lleves un esquema gráfico
de la página, pero no te obsesiones, el HTML te gastará malas
pasadas y no será lo que tú creías y además
qué le vas a decir a la gente.
Así que primero redacta lo quieres contar y luego poco
a poco le puedes ir dando mejor aspecto.
Vamos al grano
Mucho rollo,
¿pero qué es HTML?
El HTML surge en marzo de 1989 en el CERN. La propuesta inicial consistía
en un sistema hipertexto a través de la red para transmitir documentos
entre los miembros del CERN. Inicialmente no había intención
de incluir video ni audio. era simplemente una herramienta para que la
comunidad científica pudiese divulgar sus estudios entre los científicos.
El HTML (Hypertext Markup Language) es un lenguaje de etiquetas que
permiten las distintas intrucciones HTML, la forma general de una instrucción
será:
<ETIQUETA parámetros> Elementos afectados por la Etiqueta
</ETIQUETA>
Lo mejor para aprender es ver cómo está hecha la página,
te vas al menú del navegador y debería haber una opción
que sea Ver, dentro del submenú elige Origen de la página
y verás las tripas de esta página en HTML.
En el ejemplo siguiente se ve la cabecera de la página:
<html>
<title>Haz tu Página WEB</title>
<body background=ca.jpg>
<center>
<img src="web.gif"><br>
<p>
<b>¡Hola!, por fin te has decidido</b>, vas a ver como es muy
fácil
<br>No soy la persona más adecuada para mostrar mis conocimientos
de
<b>HTML</b> que son escasillos pero bueno, allá tú.
</center>
...
Para editarlo te bastará con un simple editor ASCII vale el
EDIT de DOS o vi, emacs, jed, ... de Linux.
De todas formas hay múltipes editores Freeware y Shareware: HTMLWriter,
Htmled, ... que te ayudan a escribir ya que mediante un botón
p. ej: el de negrita escriben <B> </B>
También hay ya herramientas comerciales más avanzadas
WYSIWYG en la que se trabaja de forma más "visual" como: Microsoft
FrontPage, Adobe PageMill, Netscape Navigator Gold (versión 3),
Netscape Composer (versión 4), ..., pero te aseguro que es posible
hacer páginas con una alta calidad simplemente con un editor ASCII,
de hecho esta está hecha así.
De donde sacan
esos fondos, imágenes,botones, ...
Si te conectas a una página de una empresa importante, te darás
cuenta de que tienen un diseño que da envidia, además que
hacen virguerías con el texto tienen unas imágenes con un
montón de resolución y que casi no ocupan.
Pues bien, tienes varias opciones: la primera vez yo utilicé
un programa que hacía banners del año la picor y después
con un capturador de pantallas la pasé a formato GIF, un tanto rudimentario
pero vale. También pudes usar, mucho más aconsejable programas
de retoque fotográfico como Adobe Photoshop, en Shareware está
el PaintShop Pro que hace maravillas (recuerda Shareware no es
gratis, pero lo puedes probar unos días), también hay
gente que lo hace con el POV, para
los fondos lo mismo de lo mismo, incluso te puedes rayar con el PaintBrush,
no es lo más adecuado, pero todo depende de tu imaginación.
Bueno supongo que habrá muchas más formas, si sabes más
mándame un email. Los botones, todavía no sé cómo
lo hacen, yo con poner texto y degradar colores voy "sobrao".
Cómo
se hacen GIF's animados
No puede ser, he visto un icono que se movía, ¿estoy
poseído?, no algo más mundano: GIF's animados ¿comorr?,
consiste en un fichero GIF que contiene varios "fotogramas" y vistos uno
después de otro dan la sensación de movimiento. Hace falta:
un poco de maña, algún progrma de retoque fotográfico
y un programa del estilo de GIF Construction que es Shareware,
seleccionas la secuencia de fotogramas ajustas unos parámetros y
¡TACHÁN! mira cómo corre el erizo.
Cómo
se hacen imágenes transparentes
Ahora que ya consigues poner imágenes en tu página, ves
que hay gente que las tiene de formas irregulares (no son rectangulares),
la solución consiste en hacerlas transparentes. Aquí también
puedes usar el GIF Construction o el LView que son Shareware.
El color que rodea al objeto que contiene tu GIF lo haces transparente
de forma que visto en el navegador el fondo que tengas cubrirá la
"zona transparente".
Cómo
se hacen imágenes sensibles
La cuestión es definir mediante unas coordenadas las diversas
zonas de la imagen.
Para ello hay programas como Mapedit, Map This que lo hacen.
Por ejemplo en la imagen de abajo se definen 5 zonas y sus enlaces:
<MAP name="barra_de_iconos">
<AREA SHAPE="rect" COORDS="0,0 61,40" HREF="mio.htm">
<AREA SHAPE="rect" COORDS="69,0 125,40" HREF="util.htm">
<AREA SHAPE="rect" COORDS="129,0 194,40" HREF="web.htm">
<AREA SHAPE="rect" COORDS="199,0 281,40" HREF="amstrad.htm">
<AREA SHAPE="rect" COORDS="284,0 339,40" HREF
="ismael.htm">
</MAP>
<IMG SRC="barra_ic.gif" BORDER=0 USEMAP="#barra_de_iconos">
Aquí
están los enlaces
http://www.htmlgoodies.com
Aquí hay muchos ejemplos de Html y Java
Juegos en JavaScript ¿Recuerdas los "destrozaladrillos"?, bueno este es en versión ASCII