jueves, 21 de abril de 2022

Introducción HTML



HTML es el lenguaje de marcado estándar para crear páginas Web.


¿Qué es HTML?

  • HTML significa Hyper Text Markup Language (Lenguaje de marcado de hipertexto)
  • HTML es el lenguaje de marcado estándar para crear páginas Web
  • HTML describe la estructura de una página Web
  • HTML consta de una serie de elementos
  • Los elementos HTML indican al navegador cómo mostrar el contenido
  • Los elementos HTML etiquetan piezas de contenido como "esto es un encabezado", "esto es un párrafo", "esto es un enlace", etc.

Un documento HTML simple

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

Ejemplo explicado

  • La declaración define que este documento es un documento HTML5<!DOCTYPE html>
  • El elemento es el elemento raíz de una página HTML<html>
  • El elemento contiene metainformación sobre la página HTML<head>
  • El elemento especifica un título para la página HTML (que se muestra en la barra de título del navegador o en la pestaña de la página)<title>
  • El elemento define el cuerpo del documento, y es un contenedor para todos los contenidos visibles, como encabezados, párrafos, imágenes, hipervínculos, tablas, listas, etc.<body>
  • El elemento define un encabezado grande<h1>
  • El elemento define un párrafo<p>

¿Qué es un elemento HTML?

Un elemento HTML se define mediante una etiqueta de inicio, algo de contenido y una etiqueta de fin:

<tagname> El contenido va aquí... </tagname>

  • El elemento HTML es todo, desde la etiqueta de inicio hasta la etiqueta de fin:
<h1> Mi primer encabezado</h1>
<p> Mi primer párrafo. </p>

Start tag                      Element content                              End tag
<h1>                          My First Heading                          </h1>
<p>                            My first paragraph.                       </p>
<br>                           none                                              none


Nota: Algunos elementos HTML no tienen contenido (como el elemento <br>). Estos elementos se denominan elementos vacíos. ¡Los elementos vacíos no tienen una etiqueta final!


Navegadores Web

El propósito de un navegador web (Chrome, Edge, Firefox, Safari) es leer documentos HTML y mostrarlos correctamente.

Un explorador no muestra las etiquetas HTML, pero las utiliza para determinar cómo mostrar el documento:
Ver en navegador


Estructura de página HTML

A continuación se muestra una visualización de una estructura de página HTML:

<html>
    <head>
        <title>Titulación de la página</title>
    </head>
    <body>  
        <h1>Este es un encabezado</h1>
        <p>Este es un párrafo.</p>
        <p>Este es otro párrafo.</p>
    </body>
</html>


Nota: El contenido dentro de la sección <cuerpo> (el área blanca de arriba) se mostrará en un navegador. El contenido dentro del elemento <title> se mostrará en la barra de título del navegador o en la pestaña de la página.


Historia HTML

Desde los primeros días de la World Wide Web, ha habido muchas versiones de HTML:
         Year  Version
  • 1989 Tim Berners-Lee invented www
  • 1991 Tim Berners-Lee invented HTML
  • 1993 Dave Raggett drafted HTML+
  • 1995 HTML Working Group defined HTML 2.0
  • 1997 W3C Recommendation: HTML 3.2
  • 1999 W3C Recommendation: HTML 4.01
  • 2000 W3C Recommendation: XHTML 1.0
  • 2008 WHATWG HTML5 First Public Draft
  • 2012 WHATWG HTML5 Living Standard
  • 2014 W3C Recommendation: HTML5
  • 2016 W3C Candidate Recommendation: HTML 5.1
  • 2017 W3C Recommendation: HTML5.1 2nd Edition
  • 2017 W3C Recommendation: HTML5.2

Este tutorial sigue el último estándar HTML5.


No hay comentarios:

Publicar un comentario

Imágenes HTML

Las imágenes pueden mejorar el diseño y la apariencia de una página web. Ejemplo < img  src ="pic_trulli.jpg"  alt ="Itali...

Política de Privacidad
Este sitio utiliza cookies de Google para analizar el tráfico a este sitio. La información sobre su uso de nuestro sitio se comparte con Google para ese propósito. Acepto Más información