Prepa Ibero
INTRODUCCIÓN AL HTML PROGRAMACIÓN EN HTML/ TEMA 2
En este tema, se explicaremos qué es HTML de manera más profunda y cuál es su papel para programar una página web y a su vez un sitio web. Es importante, para comprender la estructura de una página web, sus fórmulas y códigos para poder construirla y también encontrar errores y componerlos en caso de que los tenga. El uso se trata de construir páginas en un editor que se llama DREAM WEAVER. Con este software es muy sencillo hacer documentos HTML (páginas web), pero para comprender su funcionamiento y estructura, es necesario primero hacer ejercicios en el BLOC DE NOTAS.
LO QUE DEBES SABER Y RECORDAR:
1.- 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.
2.- 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.
3.- 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). Es decir, se deben guardar así: nombredeldocumento.html o nombredeldocumento.htm.
4.- 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.
EMPEZAR A PROGRAMAR CON EL BLOC DE NOTAS:
1.- Para abrir el bloc de notas, se hace desde el menú inicio:
, al colocar el cursor sobre
Programas aparece otra lista, buscar Accesorios, seguidamente Bloc de notas, hacer clic sobre este, o en el caso de Windows Vista en:
Menú inicio y luego escribir “Bloc de notas”.
Siempre que se abre el bloc de notas aparece un documento en blanco. Es recomendable insertar una nueva línea para cada nueva etiqueta HTML, ya que resulta más fácil trabajar de este modo.
2.- En un primer ejercicio, vamos a escribir como TITLE de la página “Curso HTML Ibero”, como BODY “Mensaje de prueba en la página de la Prepa Ibero”. Indica el inicio del código.
Head. Indica que empieza la cabecera de la página.
OJO. Todos los códigos empiezan con palabras encerradas en < >. Pero para marcar que el código termina, las mimas palabras se vuelven a escribir y encierran en </ >.
Body. Es el cuerpo del texto que se escribe en la página.
TITLE. Es el título del documento
3.- En este siguiente ejercicio se escribirá una segunda línea y un segundo párrafo. 3.1.- En general, cuando trabajamos en Word, se produce un salto de línea al pulsar la tecla Enter. Si pulsamos Enter en un documento HTML, el salto de línea se producirá en el código, pero no se mostrará en el navegador. En lugar de pulsar la tecla Enter hay que insertar la etiqueta <br> donde se desee que se produzca el salto. Aquí se hace el salto de línea.
La etiqueta <br> no precisa ninguna etiqueta de cierre. No hay que insertar la etiqueta </br> después de ella, ya que dicha etiqueta no existe.
3.2.- El texto de una página puede agruparse en párrafos. Para ello, el texto de cada uno de los párrafos debe insertarse entre las etiquetas <p> y </p>. La etiqueta <p> para el salto del párrafo.
3.3.- Las etiquetas para darles distintos estilos al texto para resaltarlo. Recordando que todas las etiquetas tienen un código de inicio y uno de fin. Etiquetas <b> </b> <i> </i> <u> </u> <s> </s>
Significado negrita cursiva subrayado tachado
Ejemplo curso HTML curso HTML curso HTML curso HTML
Por ejemplo, si quiero escribir: La preparatoria Ibero fue mi primera elección para estudiar el nivel medio superior. El código en el bloc de notas se debe escribir así: La preparatoria <b>Ibero</b> fue mi <b>primera elección</b> para estudiar el <b>nivel medio superior</b>.