MANUAL HTML ESTRUCT BASICA

Primer documento HTML
153

En este apartado del tutorial se explica cuál es la estructura básica de un
documento HTML a través de un ejemplo sencillo ("dos-parrafos.html") donde
se visualizan dos párrafos. Por ejemplo, en Google Chrome, el resultado que
se espera ver en pantalla será algo parecido a:

Elemento "html"
Un documento HTML contiene marcas (etiquetas), las cuales se escriben
empleandolos caracteres menor que "<", mayor que ">" y barra inclinada "/".
Por ejemplo, las etiquetas de inicio () y fin () representan al
elemento raíz ("html") que en todo documento HTML hay que escribir.



Elemento "head"
Dentro del elemento "html", es decir, entre y , se debe
escribir el elemento "head" que, como iremos viendo a lo largo del tutorial,
puedecontener diversa información sobre el documento:






Elemento "title"
Entre y se pueden escribir otros elementos. Por ejemplo,
el elemento "title", el cual sirve para indicar el título del documento.






Véase en el ejemplo "dos-parrafos.html" que, el texto escrito
entre , esdecir "Ejemplo de 2 párrafos", se visualiza en
la parte superior de la pestaña donde se muestra la página web en el
navegador.

Elemento "body"
En un documento HTML, después del "head", hay que escribir el elemento
"body":








El elemento "body" alberga todo el contenido (párrafos, imágenes, vídeos...)
del documento, loscuales se mostrarán en el navegador.

Elemento "p"
En este caso, entre y se incluyen dos elementos "p"
delimitados por la etiqueta de inicio

y la de cierre

:





Esto es un párrafo.

Esto es otro párrafo.

Estructura básica de un documento HTML
Finalmente, completaremos el código deeste primer ejemplo añadiendo:

Esto es un párrafo.

Esto es otro párrafo.



en la primera línea. Esta es la forma de indicar al
navegador donde se visualice el documento que este está escrito en la versión
HTML5.





lang="es-ES" enla etiqueta de inicio . Esto sirve para especificar,
mediante el atributo lang, el idioma del contenido del elemento "html". En este
caso español (España). Otros posibles valores del atributo lang son: "esAR" para español (Argentina), "es-CO" para español (Colombia), "esMX" para español (México), etc.
dentro del elemento "head". Así, se indica la
codificación decaracteres del documento, en esta ocasión UTF-8 (8-bit
Unicode Transformation Format, Formato de Transformación Unicode de 8
bits). Obsérvese que, el elemento "meta" está vacío (no tiene contenido) y, en
consecuencia, no necesita ser cerrado escribiendo .

De esta forma, hemos escrito la estructura básica de un documento HTML
que muestra por pantalla dos párrafos. Gráficamente, los elementosutilizados se pueden representar del siguiente modo:

Nota: los documentos HTML están formados por elementos cuya gran mayoría
deben escribirse delimitados por una etiqueta de inicio y otra de
fin, tales como: "html", "head", "body", "title" o "p". No obstante,
existen otros elementos que no necesitan ser cerrados con la etiqueta de fin,
como por ejemplo: "meta".

Cómo crear undocumento HTML
Por ejemplo, con el Bloc de notas de Microsoft Windows, podemos crear el
siguiente archivo "dos-parrafos.html" (la extensión del archivo puede
ser ".html" o".htm"):

A la hora de guardar el archivo, pinchando en "Archivo" > "Guardar como...",
es importante hacerlo codificado en UTF-8, como se muestra en la siguiente
imagen:

El resultado sería el esperado. Ahora bien, si se...