1.INTRODUCCION

1.1.Antes de empezar

Para escribir las lineas e instrucciones de un programa HTML vas a necesitas un editor de textos, en principio te sirve cualquiera, hasta el propio bloc de notas de Windows, luego basta con que lo guardes con la extensión html o htm; a partir de ese momento ya será reconocido como página web por el explorador y por supuesto por los navegadores de internet. Por ejemplo: miArchivo.html o miArchivo.htm

En este tutorial te incentivamos a que te esfuerzes un poco en el aprendizaje de HTML, ya que hoy en dia se cuenta con programas que son en su caso Generadores de codigo HTML, que te simplifican muchas cosas, especialmente el tiempo dedicado a construir tus páginas web, pero nosotros queremos enfatizar o recomendar que siempre es bueno o bien mucho mas recomendable, aprender a manipular lo mas que se pueda el codigo ya que de esta manera podras realizar una programacion mucho mas personalizada de tus paginas web y lo mas importante, en el momento que tengas un problema, podras corregirlo directamente manipulando el codigo "puro".

Hablando un poco de los programas generadores de codigo HTML, windows 98 viene con uno de estos editores , se trata de FrontPage Express, según parece es una versión reducida de Frontpage que es uno de los editores que existen para este tipo de programación. Como te mencionamos anteriormente este tipo de programas te ahorran tiempo en muchas operaciones, pero limitan la imaginacion de la persona que esta diseñando la pagina, ya que este solo te permite crear tu pagina, pero deacuerdo a sus parametros.

Este tipo de editores se llaman "WYSIWYG", que significa que lo que se ve es lo que se obtiene, por lo que mientras trabajas estas viendo la apariencia real del formato y diseño de la página y no el código; para cuando tengas que insertar fragmentos en código HTML para implementar acciones no previstas por el editor,que es lo que te mencionamos con anterioridad, tendrás una opción para ver la página en código fuente (HTML) y allí podrás escribirlas.Por ejemplo: si estas utilizando Intenet Explorer, abre en la barra de herramientas el menú "ver" y dentro haz click sobre "código fuente", luego sigue leyendo en este punto. ¿Que te ha parecido?, pues todo lo que hayas visto entre las expresiones <HTML>...</HTML> es la programación de esta página, parece complicado, pero en realidad con un poco de practica lograras dominar este codigo en poco tiempo. Puedes consiguir este tipo de editores estarás y escribir el texto tal y como lo ves ahora, como en cualquier editor normal, pero tambien te llevara un poco de tiempo aprender a utilizarlo asi que empieza desde ahora a manipular el codigo para que despues,cuando desees utilizar un generador de codigo se te simplifiquen las cosas.

Al margen de que con este manual vas a conocer bien la programación en HTML, si deseas conseguir uno de estos editores entre los grandes del tema destacan el FrontPage y Macromedia Dreamweaver, pero tambien hay un buen número del tipo shareware que podrás encontrar en la mayoria de webs que ofrezcan recursos gratuitos, eso te lo dejamos a opcion tuya, pero nosotros siempre te recomendamos de manera imprsindible que aprendas el codigo HTML.

1.2.Empezando

HTML son las siglas de "Hyper Text Markup Language", es un lenguaje de programación que permite construir documentos para que puedan ser visualizados por los navegadores de Internet. Hasta la fecha se han producido diversos niveles de estandarización o revisiones del citado lenguaje; la última es la 3.0 y será la utilizada en este manual. Solo a partir de Netscape 2.x y Explorer 3.x serán practicamente reconocidas todas las instrucciones que se citan, otros navegadores mas antiguos pueden no reconocer alguna de ellas.

El lenguaje HTML consta de una serie de instrucciones que indican al navegador, la forma de representar los elementos del documento. Todas las instrucciones se designan mediante una palabra clave que es la que reconoce el navegador. A su vez cada una de estas instrucciones posee una serie de parámetros que la definen.

Hay dos tipos principales de instrucciones: Abiertas y Cerradas. En las primeras, la palabra clave se pone unicamente al principio de la instrucción. En las segundas la palabra clave se pone al principio y al final. En ambos casos las palabras clave van encerradas entre los simbolos < y > y además en la del final se incluye el signo / antes de la palabra.

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

Esta es una instrucción cerrada, y la primera y fundamental para programar en este lenguaje. Todo, absolutamente todo lo que contiene el documento HTML, para que sea reconocido como tal por el navegador debe incluirse dentro de esta instrucción

1.3. Aprender rápido

Con este manual vas a tener suficiente para poder construir tu propia web, no obstante y para poder aplicar lo que vas a ir aprendiendo construiremos paso a paso una web muy sencilla a medida que vayamos conociendo cada una de las instrucciones y sus parámetros. Esta web de ejemplo estará incluida en unos cuadros de color amarillo.

Para editar la Web de ejemplo que vamos a construir, abré una carpeta en el directorio principal de tu disco duro, o creala en el escritorio para mayor comodidad de algunos , con el nombre que quieras, dentro iras guardando todas las páginas y archivos relacionados ( imagenes,sonido,videos, etc...) . Para empezar, vamos a trabajar manera sencilla asi que utilizaremos como editor, el block de notas de windows o en su caso el que posea otro sistema como lo es la apple de machintosh, pero bueno, abrirás seis documentos en los que escribirás uno a uno el código que viene a continuación :

<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>

Si lo deseas aun mas sencillo, sombrea con el mouse el pequeño fragmento de codigo, dale click derecho al mouse y pegalo en el block de notas, y luego guardalos con los siguientes nombres y extenciones: index.htm, portada.htm, cabeza.htm, menu.htm, form.htm y tablero.htm. También deberias incluir en esta carpeta o directorio, junto a los archivos anteriores, un archivo de imagen que utilizaremos en su corespondiente capítulo. Ten en cuenta que solo hay dos formatos de imágenes que todos los navegadores modernos reconocen. Son las imágenes GIF y JPG;por ejemplo:miImagne.gif o miImagen.jpg si no tienes puedes tomar cualquier imagen y convertirlas con algún editor o visor de imagenes, como el photo editor de windows por ejemplo, solo guarda el archivo actual que deseas manipular con cualquiera de las dos extenciones.

NOTA: No utilices acentos en los nombres de archivos y carpetas, causarán errores en el navegador.

Siguiente Arriba