Make your own free website on Tripod.com

Boletín "La Web"

Año 1,  Nro. 2

¿CÓMO HAGO MI PÁGINA WEB?


Esta pregunta se podría  responder  de  dos  maneras.      La primera opción implica obtener programas especializados en la creación de páginas web.   Me refiero al  Front Page   de  Microsoft, el Composer de Netscape o el Dreamweaver  3.0  de Macromedia.   Si tienes cualquiera de los tres la tarea se hace más sencilla, pues el uso de estos softwares son intuitivos. Te cuento que de los tres el Composer es el único gratuito. Sólo tienes que bajarte el Netscape Navigator y luego buscar la opción Composer en el item Task (Tareas) que está en la barra de tu navegador.

La otra opción es considerar que no tienes otro programa más que tu simple navegador y tu block de notas (notepad) presente en la sección Accesorios de Windows.   Como esta última opción es la más probable vamos a trabajar un pequeño taller de creación de páginas web. La idea es enseñarles lo básico paso a paso, para que luego ustedes perfeccionen su estilo a en otras páginas especializadas en HTML.

Primer paso: " Block de notas y navegador a la mano"
El block de notas le servirá para escribir en HTML las instrucciones de su página y el navegador para ir visualizando su primera página web.

Lo primero es perderle miedo al HTML ya que este lenguaje de marcas es muy sencillo y si sigue las instrucciones que vienen a continuación la tarea va a resultar sencilla.

Este lenguaje de marcas supone escribir una etiqueta que abre y otra que cierra cada orden que escriba. Me refiero, por poner un ejemplo, a esto abre <HTML> cierra </HTML>

Lo siguiente es señalar que una página web está dividida en dos partes: la cabecera o Head y el cuerpo o Body. La cabecera hace referencia al nombre de su página que aparece en letras pequeñas en la parte superior izquierda del website.

El Cuerpo o Body es donde usted pondrá el titular de su página, fotos, texto y enlaces a otras páginas ya sean internas o externas.

Dicho esto pondremos un ejemplo práctico. Escriba por favor en su block de notas las siguientes marcas

<HTML>
<HEAD>
<TITLE> Mi primera Página Web
</TITLE>
</HEAD>
<BODY> Esta es una página muy sencilla que todavía no tiene ni color, ni fotos y menos enlaces, pero que servirá como ejemplo para graficar lo sencillo que es el HTML.
</BODY>
</HTML>

Terminado esto guarde el archivo en su escritorio con el nombre ejemplo.html y finalmente vaya a su navegador entre a la opción File, luego Open, Browse y seleccione ejemplo.html. De un clic y verá su primer site. Fíjese en la parte superior izquierda (head) y en la parte central (body).

Segundo paso: "Luces, cámaras y acción"
El siguiente paso será darle color a su website y escribir el titulo en un texto de mayor tamaño. Para eso va a escribir en su notepad lo siguiente:

<HTML>
<HEAD>
<TITLE> Mi primera página Web.
</TITLE>
</HEAD>
<BODY bgcolor="blue">
<H1> <FONT size=+6 color="Red"> MI PRIMER WEBSITE </H1>
<P Align=left>
<FONT size=-1 color="white" face="Arial">
<br >Escriba aqui el texto que usted guste para su página web
<br >Escriba aquí el texto que usted guste para su Página Web.
<br >Escriba aquí el texto que usted guste para su Página Web.
<br >Escriba aquí el texto que usted guste para su Página Web.
</BODY>
</HTML>

Realizada esta tarea grabe el archivo y vea cómo quedó.

Como ve el website ha cambiado por acción de tres marcas que pasamos a analizar:
<BODY bgcolor="blue"> a la marca de body o cuerpo de la página se le asignado una característica (bgcolor="blue") Puede ser cualquier otro color siempre y cuando cambie el blue por black, red, pink u otro color escrito en inglés.
<H1> <FONT size=+6 color="Red"> MI PRIMER WEBSITE </H1>
La marca <H1> es para establecer el inicio del título y se le ha asignado dos atributos tamaño del texto (Font Size=+6) y color (color="red")
La tercera marca es <br> y se usa para pasar el texto de un reglón a otro.

Tercer paso: "La imagen lo es todo"
Para terminar este pequeño capítulo cerraremos la explicación con las marcas que se deben poner para agregarle una foto a nuestra página web. Al respecto debemos señalar que el archivo de la foto o gráfico debe tener la extensión JPG o GIF, que son las que reconocen los browsers. En nuestro caso vamos a utilizar la foto que aparece a su derecha. Titulada ejemplo.jpg. Si quiere usar la misma foto presione botón derecho del mouse y luego save picture as. Ahora guarde la foto en la carpeta en donde tiene guardado su archivo en html. Para incluirla en nuestra página sólo debe escribir el siguiente código :

<IMG SRC="ejemplo.jpg" align=left> inserto dentro de las demás marcas. Veamos.

<HTML>
<HEAD>
<TITLE> Mi primera página Web.
</TITLE>
</HEAD>
<BODY bgcolor="blue">
<H1> <FONT size=+6 color="Red"> MI PRIMER WEBSITE </H1>
<P Align=left>
<FONT size=-1 color="white" face="Arial">
<IMG SRC="ejemplo.jpg" align=left>
Escriba aquí el texto que usted guste para su Página Web.
</BODY>
</HTML>

Analizando las nuevas marcas tenemos que la marca de gráfico o foto es:
<IMG SRC="rostro.jpg">.

Listo. Ya tiene su primera página Web. De aquí en adelante, aprender más de HTML depende de usted y de su curiosidad. Le falta conocer sobre enlaces, tablas, mapas, formularios y extensiones. Todo esto correctamente ordenado lo encontrará en la página de Webmaestro   

Renovamos los artículos cada semana, si requieres algún artículo anterior, haz click aquí para solicitarlo.

Volver a la página principal