Al abrir una p\u00e1gina web con nuestro navegador lo que est\u00e1 haciendo la aplicaci\u00f3n del navegador web es, principalmente, interpretar un fichero con extensi\u00f3n HTM o HTML.<\/p>\n
HTML son las siglas de HyperText Markup Language (Lenguaje de Marcado de Hipertexto). Es importante resaltar lo de lenguaje de marcado: HTML no es un lenguaje de programaci\u00f3n. No \u201cejecuta\u201d l\u00f3gica como lo har\u00eda Swift, Python o JavaScript, sino que marca el contenido para indicar diversa informaci\u00f3n sem\u00e1ntica como qu\u00e9 t\u00edtulo tiene la p\u00e1gina, en qu\u00e9 idioma est\u00e1 el contenido principal, qu\u00e9 elementos hay en la p\u00e1gina (p\u00e1rrafos, im\u00e1genes, controles de formulario, etc) indicando qu\u00e9 es cada trozo de contenido en la p\u00e1gina.<\/p>\n
HTML se usa principalmente para estructurar contenido en la Web, aportar sem\u00e1ntica en los contenidos y ser el nexo de uni\u00f3n para otras tecnolog\u00edas de la web como CSS y Javascript.<\/p>\n
Un ejemplo b\u00e1sico del c\u00f3digo HTML de un fichero .htm podr\u00eda ser el siguiente:<\/p>\n
<!doctype html><\/p>\n
<html><\/p>\n
\u00a0 <head><\/p>\n
\u00a0 \u00a0 <title>Mi primera p\u00e1gina<\/title><\/p>\n
\u00a0 <\/head><\/p>\n
\u00a0 <body><\/p>\n
\u00a0 \u00a0 <h1>Mi primera p\u00e1gina<\/h1>
\u00a0 \u00a0 <p>Este es un p\u00e1rrafo con informaci\u00f3n.<\/p>
\u00a0 \u00a0 <a href=\u00bbhttps:\/\/programaraciegas.net\u00bb>Visitar el blog<\/a><\/p>\n
\u00a0 <\/body><\/p>\n
<\/html><\/p>\n
\u00a0<\/pre>\nSi copiamos el contenido anterior en un fichero con la extensi\u00f3n .htm, por ejemplo \u00abprueba.htm\u00bb y lo abrimos con nuestro navegador web veremos lo que hemos creado.<\/p>\n
Partes de un fichero HTML<\/h2>\n
Un archivo HTML suele tener extensi\u00f3n .html (por ejemplo, index.html). Aunque puede contener muchas secciones, la estructura base se repite casi siempre.<\/p>\n
Declaraci\u00f3n del tipo de documento<\/h3>\n
La primera l\u00ednea t\u00edpica es:<\/p>\n
<!doctype html><\/pre>\nEsta declaraci\u00f3n indica al navegador que el documento debe interpretarse como HTML moderno.<\/p>\n
Elemento ra\u00edz: <html><\/h3>\n
Todo el contenido se engloba dentro de <html>…<\/html>:<\/p>\n
<!doctype html>
<html>
...
<\/html><\/pre>\nCabecera del documento: <head><\/h3>\n
La secci\u00f3n <head> contiene metadatos: informaci\u00f3n para el navegador y para otros sistemas, pero que normalmente no se muestra como contenido principal en pantalla.<\/p>\n
Ejemplo:<\/p>\n
<head>
<meta charset=\"utf-8\">
<title>Introducci\u00f3n a HTML<\/title>
<\/head><\/pre>\nLa l\u00ednea <meta charset=\u00bbutf-8″><\/strong> indica la codificaci\u00f3n de caracteres (muy importante para tildes y caracteres especiales).<\/p>\n
La l\u00ednea <title><\/strong> define el t\u00edtulo que suele verse en la pesta\u00f1a del navegador.
Cuerpo del documento: <body><\/h3>\nEn <body><\/strong> va el contenido visible o \u201cprincipal\u201d: textos, enlaces, im\u00e1genes, formularios, etc.<\/p>\n
<body>
<h1>Introducci\u00f3n a HTML<\/h1>
<p>HTML estructura el contenido de una p\u00e1gina web.<\/p>
<\/body><\/pre>\nLas etiquetas HTML<\/h2>\n
Una etiqueta (tag) es una marca que indica al navegador qu\u00e9 tipo de elemento es un fragmento de contenido.<\/p>\n
La mayor\u00eda de elementos HTML se representan con una sintaxis b\u00e1sica consistente en un nombre de etiqueta encerrado entre los signos menor que y mayor que (< y >).<\/p>\n
<hr><\/p>\n
Algunas etiquetas requieren otra etiqueta de cierre. Esta etiqueta de cierre suele ser la misma etiqueta pero su nombre comienza con el s\u00edmbolo de barra (\/). Entre la etiqueta de apertura y la de cierre va el contenido.<\/p>\n
<p>Esto es un contenido.<\/p><\/p>\n
Adem\u00e1s, hay etiquetas que incluyen atributos para poder realizar ciertas acciones.<\/p>\n
<a href=\u00bbhttps:\/\/programaraciegas.net\u00bb>
Visita Programar a ciegas
<\/a><\/p>\nEl atributo href<\/em> permite indicar qu\u00e9 direcci\u00f3n URL se abrir\u00e1 el enlace identificado por la etiqueta a<\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"
Al abrir una p\u00e1gina web con nuestro navegador lo que est\u00e1 haciendo la aplicaci\u00f3n del navegador web es, principalmente, interpretar un fichero con extensi\u00f3n HTM o HTML. HTML son las siglas de HyperText Markup Language (Lenguaje de Marcado de Hipertexto). Es importante resaltar lo de lenguaje de marcado: HTML no es un lenguaje de programaci\u00f3n. … <\/p>\n