INTRODUCCIÓN A HTML - NOVENO - III PERIODO

 

INTRODUCCIÓN A HTML


El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las páginas web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que está compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del documento.


Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse como un documento multimedia.


Los documentos HTML deben tener la extensión html o htm, para que puedan ser visualizados en los navegadores (programas que permiten visualizar las páginas web).


Los navegadores se encargan de interpretar el código HTML de los documentos, y de mostrar a los usuarios las páginas web resultantes del código interpretado.


Etiquetas


Las etiquetas o marcas delimitan cada uno de los elementos que componen un documento HTML. Existen dos tipos de etiquetas, la de comienzo de elemento y la de fin o cierre de elemento.

La etiqueta de comienzo está delimitada por los caracteres < y >. Está compuesta por el identificador o nombre de la etiqueta, y puede contener una serie de atributos opcionales que permiten añadir ciertas propiedades. Su sintaxis es: <identificador atributo1 atributo2 ...>

Los atributos de la etiqueta de comienzo siguen una sintaxis predefinida y pueden tomar cualquier valor propio del usuario, o valores HTML predefinidos.

La etiqueta de final está delimitada por los caracteres </ y >. Está compuesta por el identificador o nombre de la etiqueta, y no contiene atributos. Su sintaxis es: </identificador>

Cada uno de los elementos de la página se encontrará entre una etiqueta de comienzo y su correspondiente etiqueta de cierre, a excepción de algunos elementos que no necesitan etiqueta de cierre. También es posible anidar etiquetas, es decir, insertar etiquetas entre otras etiquetas de comienzo y de cierre.

A continuación tenemos un ejemplo en el que tenemos la etiqueta <font..> anidada dentro de la etiqueta <p..>.:

<p align="center"><font color="#993366" size="4" face="Comic Sans MS, Arial, MS Sans Serif">BIENVENIDOS AL TERCER PERIODO</font></p>

Estructura básica de un documento HTML

Lo vemos por encima, porque lo importante en este post son las utilidades concretas de algunas etiquetas HTML para tu WordPress, pero básicamente esto es:

<html> (Abrimos el documento)

<head> (Abrimos el head)

En la cabecera o “head” se inserta todo lo referente al title, styles vinculados, scripts, etc.

</head> (Cerramos el head)

<body> (Abrimos el body)

En el cuerpo del documento o “body”, es donde va el contenido general, el grueso de la página.

</body> (Cerramos el body)

</html> (Cerramos el documento)


EDITOR DE HTML: BLOC DE NOTAS

UTILIZAR EL NAVEGADOR PARA VER LAS PÁGINAS

LOS ARCHIVOS DEL BLOG DE NOTAS SE GUARDAN CON EXTENSIÓN HTML

VER AQUÍ EL CÓDIGO DE COLORES


ACTIVIDAD 1 MIS PRIMERAS PÁGINAS


Lo primero que tienes que hacer es abrir el Bloc de notas. Para abrirlo, puedes dirigirte al menú Inicio, Programas, Accesorios, opción Bloc de notas.

1. Ejemplo1

Seguidamente introduce, en el documento en blanco, el texto siguiente:





Guarda el documento con la extensión htm, con el nombre Ejemplo1.htm. Puedes guardarlo a través del menú Archivo, opción Guardar.

Pulsando dos veces sobre el icono del archivo miprimpag.htm, éste debería abrirse automáticamente en el navegador que tengas instalado en tu computador.

2. Ejemplo2

Abrir otro archivo nuevo en el Bloc de Notas y realizar el siguiente ejercicio.



3. Responder en el cuaderno:

¿Para qué sirve la etiqueta <title> y <br> <body bgcolor>?

4. Hacer una página web con titulo "MI NOMBRE" que muestre su nombre completo en 10 formas distintas de tamaño y color. El fondo de la página debe de ser de un color distinto al blanco.

Comentarios