Lección 1
Estructura básica de una página Web
HTML, por su sigla de HyperText Markup Language (lenguaje de marcas de hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas web. Está compuesto por una serie de etiquetas rodeadas por corchetes angulares (<,>) que el navegador interpreta y da forma en la pantalla. HTML dispone de etiquetas para imágenes, hipervínculos que nos permiten dirigirnos a otras páginas, saltos de línea, listas, tablas, etc.
HTML también puede describir, hasta un cierto punto, la apariencia de un documento.
HTML es un lenguaje de programación, que nos permiten crear páginas web estáticas, es decir que su información no cambia, y la posibilidad de integrar otros lenguajes de programación como PHP, creando así páginas Web dinámicas, es decir, que su contenido puede cambiar dinámicamente.
La programación de HTML se puede hacer desde cualquier editor de texto y el resultado de su ejecución se puede ver desde cualquier navegador (Chrome, Mozilla, Opera, etc).
Los documentos HTML se deben guardar con la extensión htm, html o php en el caso que incluya código de PHP. Ejemplo: mi_pagina.html
Como vemos aquí, todo el documento se encierra entre las etiquetas <html> y </html> e internamente contiene las etiquetas <head> </head> y <body> </body> las cuales traducen en español cabeza y cuerpo, respectivamente.
Entre las Etiquetas <head> </head>, pueden ir otras etiquetas, como por ejemplo <title> </title>, en esta se define el título que queremos que aparezca en la pestaña del navegador. Un ejemplo de esto, se muestra a continuación:
Dando como resultado:
Entre las etiquetas <head> </head> se puede especificar el autor de la página, una descripción, la codificación de caracteres etc, utilizando la etiqueta <meta> de la siguiente forma:
En nuestro caso debemos establecer la codificación de caracteres en UTF8, esta permitirá que en la página se reconozcan las tildes y otros caracteres propios del español.
Todo lo que va entre las etiquetas <head> y </head> no será visible en la página, a excepción del título que aparece en la pestaña con la etiqueta <title> </title>.
Todo lo que será visible irá entre las etiquetas <body></body>.
La etiqueta <!DOCTYPE html> indica el tipo de documento, y para este caso está indicando que es un documento html en su última versión, la cual corresponde a HTML5.
Los navegadores aún no soportan en su totalidad HTML5 dado que es una versión relativamente nueva, sin embargo poco a poco lo irán haciendo hasta soportarlos a un 100%.