Qué es HTML

¿Qué es el HTML?
Las siglas HTML vienen de “Hyper Text Markup Language”
o Lenguaje Marcado de Hipertexto.
Los códigos HTML son el lenguaje universal que se utiliza
para crear y dar formato a los sitios web. Funcionan en
cualquier sistema operativo (Windows, Mac, Linux, etc.) y
con cualquier navegador (Chrome, Explorer o Mozilla).

Etiquetas HTML
El lenguaje HTML está conformado por un sistema de etiquetas en serie o tags, que incluyen
instrucciones que los navegadores traducen como:
•Imágenes
•Texto
•Hipervínculos
•Listas de palabras
•Tablas, etc.
Así, para que un elemento de este tipo pueda ser leído, la etiqueta debe tener dos partes: una etiqueta de inicio
(<etiqueta>) y una de cierre (</etiqueta>) entre guiones (< >).
Por ejemplo, las etiquetas <strong> y </strong> definen un texto en negrita. Si en nuestro documento HTML escribimos
una frase con el siguiente código:
<strong>Este texto va en negritas.</strong>
El resultado será:
No todas las etiquetas necesitan forzosamente un
“cierre”. Por ejemplo, el código <br> para introducir
saltos de línea es considerado un “elemento vacío” y
puede ir por sí solo en cualquier parte del cuerpo del
texto.

La primera línea de un documento HTML siempre
debe contener la etiqueta <!DOCTYPE html>. Esto
hará que el código de tu sitio sea legible en cualquier
navegador.
Un documento HTML bien armado tiene cuatro
etiquetas esenciales para que el contenido se
distribuya correctamente. Estas son:
Estructura básica HTML

1. HTML
<html> está al inicio de un documento HTML e indica a los navegadores que la página tiene
código HTML para que pueda leerlo de esa forma. Siguiendo la sintaxis del lenguaje, la
etiqueta de cierre </html> será el último elemento del documento.
2. Encabezado
<head> es la etiqueta que se utiliza para el encabezado de la página. Su principal función es
contener toda la información del funcionamiento del sitio. Debido a esto, es un código
encriptado que las personas que entran a la página no pueden ver.
3. Título de la página
<title> es la etiqueta que da a tu sitio un nombre para que los usuarios puedan identificarlo. Es
el título que puedes ver en las pestañas del navegador.
4. Cuerpo
<body> es la etiqueta que contiene todos los elementos individuales del sitio. O dicho de otra
forma, comprende todo el contenido visible del sitio. Aquí se podrá insertar texto, imágenes,
videos o cualquier otra funcionalidad que se desee mostrar.

Ejemplo de las cuatro etiquetas
esenciales:
<html>
<head>
<title>Mi página de ejemplo</title>
</head>
<body> Aquí va el contenido </body>
</html>

5. Títulos y subtítulos
<h1> <h2>… <h6> son etiquetas que funcionan para agregar títulos y subtítulos en el cuerpo del texto, lo
cual ayuda a jerarquizar la información. Por cierto, te recomendamos utilizar la etiqueta H1 sólo una vez
dentro del contenido.
Ejemplo:<h1>Esta es una etiqueta H1. Utilízala en el título.</h1>
<h2>Esta es una etiqueta H2. Utilízala en los encabezados de secciones.</h2>
<h3>Esta es una etiqueta H3. Utilízala en sub-secciones.</h3>
<h4>Esta es una etiqueta H4. No se usan muy a menudo.</h4>
<h5>Esta es una etiqueta H5.</h5>
<h6>Esta es una etiqueta H6.</h6>
Resultado:

6. Párrafos
Las etiquetas <p> y <br> te ayudarán a organizar el texto en párrafos y saltos de línea.
Ejemplo:
<p>Tu primer párrafo.</p>
<p>Tu segundo párrafo.</p>
<p>Un enunciado.<br>
Un segundo enunciado (pegado al primero).</p>
Resultado:

7. Imágenes
<img> con esta etiqueta se podrá agregar imágenes al cuerpo de la página. Combinarlo con el
atributo src permitirá especificar la ubicación donde se encuentra la imagen, y el atributo alt ayudará a
darle un título a esa imagen para que lo lean buscadores como Google.
La estructura de los atributos es la siguiente: primero viene la palabra o abreviatura que lo define (en
este caso src es abreviatura de “source” o fuente), luego el signo igual (=) y al último el modificador del
atributo entre comillas dobles (“_”) o simples (‘_’).
Ejemplo:
<img src="https://images.unsplash.com/photo-1535378917042-
10a22c95931a">
Resultado:

8. Hipervínculos
<a> te permite insertar un hipervínculo a la página. Por ejemplo, el link hacia tus redes sociales o hacia
otro sitio web con el que desees conectar tu página.
Ejemplo:
<a href="https://Google.com">Visita Google como
buscador</a>
Resultado:
Visita Google como buscador

9. Listas e índices
<ol> sirve para agregar listas numeradas y <ul> para agregar viñetas, los cuales mejoran la legibilidad de
tus textos.
Ejemplo:
<ul>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
Resultado:

10. Estilo
Aunque usualmente se ubica dentro de la etiqueta <head>, con el atributo <style> puedes definir el
estilo de tu contenido en términos de:
•Color
•Tamaño de fuente
•Tipografía, etc.
Ejemplo:
<p style="color:red; font-size:100px">Hola
Mundo</p>
Resultado:

Qué es HTML

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (15)

Similar a Qué es HTML

Similar a Qué es HTML (20)

Último

Último (20)

Qué es HTML