CREACION DE UNA PAGINA WEB
Para crear una página web se pueden utilizar varios programas especializados en esto, como por ejemplo, el Microsoft Front Page o el Macromedia Dreamweaver Otra forma de diseñar un archivo html, es copiar todo en el Bloc de Notas del Windows, ya que este sencillo programa cumple con un requisito mínimo que es la posibilidad de trabajar con las etiquetas con las que trabaja este lenguaje.
A continuación les mostraremos las etiquetas mas comunes que deben aprenderse para hacer una pagina Web.
Estructura de los documentos de HTML
Si se tiene en cuenta el contenido del documento, todos los documentos de HTML bien escritos comparten una estructura en común. Un documento de HTML empieza con la etiqueta <HTML>, que es la que encerrará el documento actual. Contiene dos secciones primordiales: la cabecera y el cuerpo encerradas respectivamente por los elementos <HEAD> cabeza y <BODY> cuerpo.
La cabecera puede contener información y siempre contiene el titulo del documento encerrado por el elemento < TITLE>.
En el cuerpo se encuentra todo el contenido del documento, ya sea, texto, imágenes, sonidos, hipervínculos, etc.
Un documento escrito en HTML contiene las siguientes etiquetas en el siguiente orden:
Ejemplo:Si se tiene en cuenta el contenido del documento, todos los documentos de HTML bien escritos comparten una estructura en común. Un documento de HTML empieza con la etiqueta <HTML>, que es la que encerrará el documento actual. Contiene dos secciones primordiales: la cabecera y el cuerpo encerradas respectivamente por los elementos <HEAD> cabeza y <BODY> cuerpo.
La cabecera puede contener información y siempre contiene el titulo del documento encerrado por el elemento < TITLE>.
En el cuerpo se encuentra todo el contenido del documento, ya sea, texto, imágenes, sonidos, hipervínculos, etc.
Un documento escrito en HTML contiene las siguientes etiquetas en el siguiente orden:
<HTML>
<HEAD>
<TITLE> Título de mi página de Internet </TITLE>
</HEAD>
<BODY>
< H1> <CENTER> Primera pagina </CENTER> </H1>
< HR>
Para escribir títulos se usa la etiqueta <Hx></Hx> en donde x es un número.
Ejemplo:
<h1>Titulo principal</h1>
< h2>Titulo secundario</h2>
<h3>Titulo terciario</h3>
<h4>Titulo cuarto nivel</h4>
< h5>Titulo quinto</h5>
<h6>Titulo sexto</h6>
Quedaría mas o menos así:
Titulo principal
Titulo secundario
Titulo terciario
Titulo cuarto nivel
Titulo quinto
Titulo sexto
6. Como insertar una imagen
A la hora de crear una página Web podemos introducir gráficos de forma muy sencilla, sólo hay que tener en cuenta que las imágenes deben tener formato Gif o JPEG.
La etiqueta utilizada para agregar imágenes a una página Web es <IMG> y va acompañada de un atributo fundamental "SCR", que indica la ruta donde se encuentra el archivo que contiene la imagen a insertar.
Es decir:
<IMG SRC="lugar donde guardo la imagen">
Supongamos que tenemos la imagen dragonball.gif, que está presente en el mismo directorio en donde está la página y que la queremos insertar. La etiqueta apropiada sería:
<IMG SRC="dragonball.gif">
Y el usuario verá en el browser:
Para poner la imagen en la izquierda escribir:
<IMG ALIGN=LEFT SRC=" dragonball.gif ">
A la derecha: <IMG ALIGN=RIGHT SRC=" dragonball.gif">
Y si se quiere poner la imagen en el centro:
<P ALIGN=CENTER> <IMG SRC=" dragonball.gif"> </P>
<IMG ALIGN=LEFT SRC=" dragonball.gif ">
A la derecha: <IMG ALIGN=RIGHT SRC=" dragonball.gif">
Y si se quiere poner la imagen en el centro:
<P ALIGN=CENTER> <IMG SRC=" dragonball.gif"> </P>
Hiperenlaces, Hyperlinks, Anclas o Links
Para definir un enlace es necesario marcar con la etiqueta <a> el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href="URL" para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con < a href="URL">, y después cerrar con </a>. Por ejemplo, si queremos que el texto "pulse aquí para visitar la NASA" nos conduzca a la "home page" de la NASA, debemos escribir en nuestro texto HTML:
<a href="http://www.nasa.gov/">Pulse aquí para visitar a la NASA</a>
Para definir un enlace es necesario marcar con la etiqueta <a> el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href="URL" para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con < a href="URL">, y después cerrar con </a>. Por ejemplo, si queremos que el texto "pulse aquí para visitar la NASA" nos conduzca a la "home page" de la NASA, debemos escribir en nuestro texto HTML:
<a href="http://www.nasa.gov/">Pulse aquí para visitar a la NASA</a>
Que se vería de esta forma: Pulse aquí para visitar a la NASA
Si queremos que el texto "Foto" nos lleve a una imagen tenemos que escribir:
< a href="imagen.gif">Foto</a> entonces al hacer clic en el texto Foto nos abrirá la imagen.gif.
Si queremos que el texto "Foto" nos lleve a una imagen tenemos que escribir:
< a href="imagen.gif">Foto</a> entonces al hacer clic en el texto Foto nos abrirá la imagen.gif.
También se puede ir a otro enlace por medio de una imagen. Lo único que se debe hacer es cambiar el texto por una imagen:
<a href="http://www.altavista.com"><img src="Logo.jpg"></a>
Con esto tendremos por resultado que cuando se pase el puntero del mouse por arriba del Logo.jpg (que podría ser el logo del Altavista) y se convierta en una "manito", al hacer clic nos envíe al buscador Altavista.
Si se quiere hacer un link para que nos manden un E-Mail se debe hacer de la siguiente manera:
<a href="mailto:pfravioli[arroba]fibertel.com.ar">Mandame un Email</a>
Entonces cuando se haga clic sobre esta palabra Mandame un Email se abrirá (por defecto) el Microsoft Outlook Express con la dirección del destinatario ya escrita.
<a href="http://www.altavista.com"><img src="Logo.jpg"></a>
Con esto tendremos por resultado que cuando se pase el puntero del mouse por arriba del Logo.jpg (que podría ser el logo del Altavista) y se convierta en una "manito", al hacer clic nos envíe al buscador Altavista.
Si se quiere hacer un link para que nos manden un E-Mail se debe hacer de la siguiente manera:
<a href="mailto:pfravioli[arroba]fibertel.com.ar">Mandame un Email</a>
Entonces cuando se haga clic sobre esta palabra Mandame un Email se abrirá (por defecto) el Microsoft Outlook Express con la dirección del destinatario ya escrita.
No hay comentarios:
Publicar un comentario