Ir al contenido principal

COMO CREAR UN SITIO WEB CON HTML

¿QUE ES HTML?

HTML, que significa HyperText Markup Language (Lenguaje de Marcado de Hipertexto), es el lenguaje estándar utilizado para crear y estructurar el contenido de páginas web.

HTML utiliza etiquetas o elementos para definir la estructura y el significado del contenido en una página web. Estas etiquetas permiten al navegador web interpretar y mostrar los diversos elementos, como encabezados, párrafos, enlaces, imágenes, listas y tablas, entre otros.

Cada etiqueta de HTML se compone de una etiqueta de apertura y una etiqueta de cierre, que delimitan el contenido al que se aplican. Por ejemplo, el elemento de encabezado se define utilizando la etiqueta <h1> para abrir y </h1> para cerrar. El contenido que se encuentra entre estas etiquetas será tratado como un encabezado principal en la página.



¿COMO FUNCIONA UNA PAGINA WEB HTML?

Una página web HTML funciona a través de un proceso llamado "renderizado". A continuación, te explico los pasos básicos involucrados en el funcionamiento de una página web HTML:

  1. Solicitud y respuesta: Cuando un usuario ingresa la URL de una página web en un navegador web, se envía una solicitud al servidor que aloja el sitio web. El servidor procesa la solicitud y devuelve una respuesta al navegador.

  2. Descarga del HTML: El navegador recibe la respuesta del servidor, que generalmente incluye el código HTML de la página solicitada. El navegador comienza a descargar el HTML y lo interpreta.

  3. Análisis del código HTML: El navegador analiza el código HTML y construye un "árbol de análisis" o "árbol DOM" (Document Object Model). El árbol DOM representa la estructura lógica y jerárquica de los elementos HTML en la página.

  4. Procesamiento de etiquetas: El navegador procesa cada etiqueta HTML y aplica las reglas correspondientes. Esto implica interpretar las etiquetas y sus atributos, y realizar acciones específicas según el tipo de etiqueta. Por ejemplo, si encuentra una etiqueta de imagen <img>, el navegador solicitará la imagen al servidor para mostrarla en la página.

  5. Carga de recursos adicionales: Además del HTML, una página web puede contener recursos adicionales como hojas de estilo CSS, scripts JavaScript y archivos multimedia. El navegador descarga y procesa estos recursos, aplicando los estilos CSS y ejecutando los scripts necesarios.

  6. Renderizado de la página: Una vez que el navegador ha procesado todas las etiquetas y cargado los recursos necesarios, comienza el proceso de renderizado. El navegador utiliza la información del árbol DOM y los estilos CSS para determinar cómo se visualizará cada elemento en la pantalla. Luego, se genera una representación visual de la página web en función de estas instrucciones.

  7. Interacción y eventos: Una vez que la página se ha renderizado, el usuario puede interactuar con ella. Esto puede incluir hacer clic en enlaces, enviar formularios, desplazarse por la página, entre otras acciones. El navegador maneja estos eventos y puede realizar solicitudes adicionales al servidor para cargar nuevas páginas o recursos según sea necesario.
En resumen, una página web HTML funciona mediante el procesamiento y renderizado del código HTML por parte del navegador. El navegador interpreta el código, construye un árbol DOM, aplica estilos y carga recursos adicionales, lo que resulta en la visualización final de la página web en el navegador del usuario.

Etiquetas HTML

Las etiquetas son parte de los elementos de HTML. Se utilizan para informar al navegador sobre la estructura del sitio web. En otras palabras: al escribir código HTML, las etiquetas serán interpretadas por el navegador, produciendo así la estructura y el contenido visual del sitio web.
HTML utiliza etiquetas para marcar y estructurar el contenido de una página web. Estas etiquetas están rodeadas por corchetes angulares ("<" y ">") y pueden contener atributos y valores. Además, una misma etiqueta puede recibir uno o más atributos, los cuales tendrán un valor que cambie su estructura o funcionalidad. Los atributos no son más que propiedades capaces de modificar y personalizar la funcionalidad de una etiqueta. Por tanto, podemos utilizar varios atributos, como ancho, alto, entre otros. 



algunos ejemplos de etiquetas HTML comunes:

  • <html>: Define el comienzo y el final de un documento HTML.
  • <head>: Contiene información meta sobre el documento HTML, como el título de la página y enlaces a hojas de estilo CSS.
  • <body>: Contiene el contenido principal de la página web, como texto, imágenes, enlaces y otros elementos visibles.
  • <h1> a <h6>: Representan los encabezados de nivel 1 a nivel 6, respectivamente. <h1> es el encabezado principal y <h6> es el menos importante.
  • <p>: Define un párrafo de texto.
  • <a>: Crea un enlace a otra página o recurso. El atributo href especifica la URL de destino.
  • <img>: Inserta una imagen en la página. El atributo src indica la URL de la imagen y el atributo alt proporciona un texto alternativo en caso de que la imagen no se pueda mostrar.
  • <ul> y <li>: <ul> crea una lista desordenada y <li> representa cada elemento de la lista.
  • <ol> y <li>: <ol> crea una lista ordenada y <li> representa cada elemento de la lista.
  • <table>, <tr>, <td>: <table> crea una tabla, <tr> define una fila de la tabla y <td> representa una celda de la tabla.
  • <div>: Se utiliza para agrupar elementos y crear bloques lógicos en una página.
  • <span>: Similar a <div>, pero se utiliza para aplicar estilos o manipular contenido en línea.

¿Cómo crear una página web en HTML?

Si quieres crear una página web en HTML, el primer paso es crear una carpeta donde guardarás la página en tu computadora y asignarle un nombre: ejemplo1.
Puedes hacer una página web HTML en el Bloc de Notas. Aquí está un tutorial que te puede ayudar a la codificación:


Comentarios