MANUAL BÁSICO DE HTML
CREACIÓN Y ESTRUCTURA DE PAGINAS WEB
Introducción
Internet está al borde de una pequeña revolución que transformara la manera en que usted lo utilizara.
De todos los servicios que nos presta internet, el segundo más utilizado es World Wide Web o www.
Y siempre nos preguntamos cómo se crean estas páginas en internet?
La respuesta es…. Con HTML.
¿Qué es HMTL?
HTML son las iniciales de Hiper Text Markup Languaje.
Es una serie de etiquetas incluidas en un archivo de texto que definen la estructura de un documento www y sus vínculos con otros documentos.
WWW leen los archivos de texto y determinan como desplegar las páginas web.
¿Por dónde comenzar?
1.- Utilizar programas para desarrollo de páginas web como :
· Microsoft Front page
· Hot dog
· Microsoft Internet Assistant
· Microsoft Office 97
2.- Utilizar un editor de texto y crear nuestro propio código.
La primera opción es la más sencilla y rápida pero es limita y dependiente del software que utiliza, ya que este se encarga de de elabora y ubicar los códigos de la página WEB.
La segunda opción es más lenta y menos vistosa, pero esta enseña a utilizar cada uno de los comandos de HTML sin depender de ningún programa. Esto tiene sus beneficios y el principal es que nuestras páginas WEB ya no contaran con un código basura, por lo que ocuparan menos espacio y serán mas rápidas y por ello se gastara menos dinero pagando al proveedor de internet.
Para creara hipertextos utilizaremos El Bloc de Notas.
PAGINAS WEB
El hipertexto es un archivo que contiene instrucciones que pueden ser interpretadas por un navegador de Internet, a estas se las denomina etiquetas.
ETIQUETAS
<nombre de la etiqueta> | Apertura de una etiqueta siempre entre “<>” |
Texto/gráfico/etiquetas | A la cual se aplica la etiqueta |
</nombre de la etiqueta> | Cierra la etiqueta siempre entre “</>” |
Al guardar un hipertexto este se debe guardar con la extensión .html o .htm.
ESTRUCTURA BASICA DE UNA PAGINA WEB
Una página web está compuesta de 2 partes: el encabezamiento y el cuerpo de la página.
Además existen tres etiquetas fundamentales y que deben estar incluidas en el archivo HTML. Estas etiquetas son:
* <html> </html> Indica que es un documento HTML. Esta abre al inicio del archivo y cierra el mismo.
* <head> </head> Detalla el encabezado de la página WEB. Abre luego de <html>.
* <body> </body> Cuerpos de la página. Se abre luego de cerrar el encabezamiento con </head> y se extiende hasta el final de la página cerrándose antes de HTML.
Ejemplo 1:
<html>
<head> </head>
<body>
Bienvenidos al curso html
</body>
</html>
Guardamos el archivo con el nombre práctica1.html. Al asignar .html ya se ha creado un hipertexto.
Ingrese a su navegador e introduzca la ruta completa del archivo y podrá ver su primera página web.
Importante:
Toda etiqueta abierta debe ser cerrada.
Etiqueta: <title> </title>
Va en la parte del encabezamiento y define el título de la página web.
Ejemplo 2:
<html>
<head> <title> 5 FIMA "B" </title> </head>
<body >
Bienvenidos al curso html
</body>
</html>
Guardamos y en la página web presionamos F5 y veremos el titulo en la parte superior izquierda.
Etiqueta <body> </body>:
Bgcolor | Define el color de fondo de la página |
Text | Define el color del texto de la página |
Link | Define el color de los vínculos de la página |
Alink | Define el color del vínculo actual o activado en la página |
Vlink | Define el color del vínculo ya visitado |
Backgroun | Define el archivo gráfico que será desplegado como fondo |
Bgsound | Define el archivo de audio que se tocara en la pagina |
Bgproperties | Define el movimiento vertical del fondo |
¿Cómo se utilizan los colores en HTML?
Se puede llegar a tener 6millones de colores en una página WEB.
Existen dos formas ara aplicar colores:
1.- Se especifica el color deseado directamente con el nombre del color en ingles. Ej: blue…etc
2.-Se específica el color deseado mediante números hexadecimales mediante la siguiente estructura:
#RRVVAA
El color tiene un signo de numeral # antecediendo a los 6 numero.
Existen dos números para cada color principal: rojo, verde y azul.
Cada uno de los números varía hexadecimal mente (0,1,2….9,A,B…..F)
Ejemplos de colores:
#RRVVAA | color | #RRVVAA | color |
#FFFFFF | Blanco | #000000 | Negro |
#0000FF | Azul | #00FF00 | Verde |
#00FFFF | Cyan | #FF00FF | Magente |
#70DB93 | Agua Marino | #FFFF00 | Amarillo |
#FF7F00 | Coral | #000080 | Azul marino |
#FF0000 | Rojo | #A62A2A | Café |
#C0C0C0 | Plomo | #4F2F4F | Violeta |
Ejemplo 3:
<html>
<head> <title> 5 FIMA "B" </title> </head>
<body bgcolor="#00FFFF" text="#FF00FF">
Bienvenidos al curso html
</body>
</html>
Se puede llegar a tener mas de 16 millones de colores en una página web.
Existen 2 formas de aplicar colores a una página web:
1.- Se especifica el color deseado directamente con el nombre del colr en ingles.
2.- Se especifica el color deseado mediante números hexadecimales mediante la siguiente estructura: #RRVVAA
Texto en HTML
HTML fue creado en principio para el alfabeto inglés, pero se buscaron modos para mostrar también caracteres especiales.
Utilizaremos & y ; para denotar el inicio y el final respectivamente de un símbolo especial.
Etiqueta <br>
La etiqueta <br> instruye al navegador cliente que inserte un salto de línea en un documento HTML.
Etiqueta <hr>
La etiqueta <hr> dibuja una manera predeterminada una regla horizontal alineada automáticamente, con una apariencia de tercera dimensión.
Encabezados
Las etiquetas <hl> </hl> al <h6> </h6> son encabezados del cuerpo de texto. El encabezamiento <hl> nos proporciona las letras de mayor tamaño
Unicación, formato y atributos de texto
Etiqueta <center> </center>
Se utiliza para centrar el texto/imagen o datos que se encuentren entre la apertura y el cierre.
Etiqueta <b> </b>
Esta es la etiqueta que nos posibilita un texto con negrillas.
Etiqueta <u> </u>
Etiqueta que posibilita resaltar un textosubrayado.
Etiqueta <i> </i>
Etiqueta que permite resaltar el texto coninclinación itálica
kl
