Usando un esqueleto HTML

Un esqueleto es el marco de soporte de un organismo.

Por lo general, está hecho de algo duro, para proteger un cuerpo más vulnerable.

Enciclopedia

Todo desarrollador web debería tener un esqueleto HTML.

Debe guardarlo en su bolsillo y usarlo para cada trabajo:

Ejemplo

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="">
<style>
</style>
<script src=""></script>
<body>

<img src="img_la.jpg" alt="LA" style="width:100%">

<div class="">
 <h1>This is a Heading</h1>
 <p>This is a paragraph.</p>
 <p>This is another paragraph.</p>
</div>

</body>
</html>

Haga clic en el botón "Pruébelo usted mismo" para ver cómo funciona.

Intenta cambiar el texto "Este es un encabezado" por "Esta es mi boda".

¿Tú lo hiciste?

¡Felicidades! Ahora ya sabes cómo editar HTML.


Esqueleto HTML explicado

El DOCTYPE debe estar presente. Le informa al navegador que se trata de un documento HTML:

<!DOCTYPE html>

Una etiqueta de inicio html y una etiqueta final html definen el inicio y el final de un documento HTML.

El idioma es el ingles:

<html lang="en">

</html>

Una etiqueta de juego de caracteres meta define el juego de caracteres (UTF-8):

A la página HTML le faltan etiquetas de encabezado. Las etiquetas de encabezado no son necesarias en HTML.

En HTML, todo lo que está antes de la etiqueta del cuerpo se considera parte de la cabeza.

<meta charset="UTF-8">

El estándar HTML requiere un título de página adecuado:

<title>Page Title</title>

Una metaetiqueta de ventana gráfica hace que la página se vea bien en todos los tamaños de pantalla (portátil, móvil):

<meta name="viewport" content="width=device-width,initial-scale=1">

La etiqueta de enlace se vincula a una hoja de estilo:

<link rel="stylesheet" href="name">

La etiqueta de inicio y la etiqueta final rodean el estilo CSS futuro:

<style>
</style>

La etiqueta del script se vincula a un script:

<script src="name"></script>

La etiqueta de inicio y la etiqueta final rodean el cuerpo visible del documento HTML:

<body>
</body>

Las etiquetas de imagen definen imágenes HTML:

<img src="img_la.jpg" alt="LA" style="width:100%">

Acostúmbrese a "empaquetar" secciones HTML en elementos div.

Prepárese para dar a cada sección un nombre de clase:

<div class="class name">
</div>

Las etiquetas de encabezado definen encabezados HTML:

<h1>This is a Heading</h1>

Las etiquetas de párrafo definen párrafos HTML:

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>