Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • 3.3. Cómo Se Renderiza El HTML

    Cargado por

    target ros
    50 vistas4 páginas
    El documento explica el proceso de renderizado de HTML por parte de los navegadores. Primero, el navegador encuentra la etiqueta DOCTYPE que indica la versión de HTML. Luego, el navegador analiza el código HTML y crea nodos del Modelo de Objetos del Documento (DOM) para cada etiqueta. Finalmente, el navegador renderiza la página web mostrando el contenido de forma incremental desde la parte superior hacia la inferior.

    Descripción original:

    HTML

    Título original

    3.3. Cómo se renderiza el HTML

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    DOCX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento
    El documento explica el proceso de renderizado de HTML por parte de los navegadores. Primero, el navegador encuentra la etiqueta DOCTYPE que indica la versión de HTML. Luego, el navegador analiza el código HTML y crea nodos del Modelo de Objetos del Documento (DOM) para cada etiqueta. Finalmente, el navegador renderiza la página web mostrando el contenido de forma incremental desde la parte superior hacia la inferior.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    50 vistas4 páginas

    3.3. Cómo Se Renderiza El HTML

    Cargado por

    target ros
    El documento explica el proceso de renderizado de HTML por parte de los navegadores. Primero, el navegador encuentra la etiqueta DOCTYPE que indica la versión de HTML. Luego, el navegador analiza el código HTML y crea nodos del Modelo de Objetos del Documento (DOM) para cada etiqueta. Finalmente, el navegador renderiza la página web mostrando el contenido de forma incremental desde la parte superior hacia la inferior.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 4

    HTML >Lección 2: Iniciación a HTML

    Lección 2: Iniciación a HTML


    ¿Cómo se renderiza el HTML?

    Cápsula de conocimiento
    ¿Cómo se renderiza el HTML?
    ¡Hola! En esta lección vamos a conocer el proceso que realiza un navegador
    Web para mostrar un documento HTML en la pantalla.

    El renderizado de un documento HTML es el proceso que realiza el motor de


    render de los navegadores Web.

    Antes de explicarte cómo funciona este proceso en el navegador, debemos


    saber:

    ¿Qué es el DOM? y ¿Qué es el DOCTYPE?

    Entonces ¿Qué es el DOM?

    Sus siglas se refieren a Document Object Model, que traduce, Modelo de


    Objetos del Documento.

    El DOM es la representación de los elementos HTML en el navegador que


    tiene características y funcionalidades propias de HTML5 para cada etiqueta.
    Su estructura es tipo árbol y cada uno de los elementos representa un nodo.

    A través del DOM y el conjunto de funciones que provienen de HTML5,


    podemos manipular una página Web a nuestro gusto.
    Siempre que vamos a crear un documento HTML debemos saber que existen
    un conjunto de etiquetas obligatorias para la creación de una página Web.

    DOCTYPE, es la primera etiqueta obligatoria que da inicio a un documento


    HTML indicando al navegador la versión HTML que vamos a utilizar para la
    creación de nuestra página Web. 

    Esta etiqueta se utiliza luego de la aparición de la versión 2.0 como un recurso


    para que el motor de render identifique el tipo de versión que debe capturar
    durante el proceso.

    DOCTYPE ha evolucionado en la forma como se declara en cada versión.


    Veamos:

    HTML5: 

    <! DOCTYPE html>

    HTML4:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"


    "http://www.w3.org/TR/REC-html40/strict.dtd">

    HTML3:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

    HTML2:

    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">

    Recuerda que la versión de HTML que vamos a usar en este curso es HTML5,
    por lo tanto el único DOCTYPE válido es:
    HTML5: 

    <! DOCTYPE html>

    Ahora, retomemos el proceso que realiza el motor del navegador para


    renderizar el documento HTML. 

    Para comenzar, este proceso se realiza de forma incremental, es decir el motor


    comienza a leer el documento en línea iniciando en la parte superior hacia la
    inferior. 

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-
    scale=1">
    <title> Mi primera página Web</title>
    </head>
    <body>
    <h1>¡Hola Mundo!, esto es HTML</h1>
    </body>
    </html>

    La primera etiqueta que encuentra es el DOCTYPE que indica al motor el tipo


    de versión del documento HTML.

    A continuación siguen las etiquetas semánticas que representan los elementos


    del documento. Este proceso se conoce como Parsear el HTML a Nodos
    DOM. En el mundo de la informática, parsear se refiere a la conversión de un
    elemento de un tipo a otro.  En el contexto del HTML significa convertir una
    marca o etiqueta a un nodo tipo DOM.

    Cuando el motor de render se encuentra con el símbolo de apertura de una


    etiqueta, es decir, menor que (<), comprende que el paso siguiente es leer la
    etiqueta específica, y luego, el símbolo de cierre barra inclinada mayor que
    (/>). Una vez lee la etiqueta  completa procede a Parsear y agregar el nodo
    al Árbol DOM. 

    Los símbolos de apertura y cierre son las etiquetas obligatorias que indican al
    motor del navegador qué elementos son HTML y cuáles no. Aquellos que no
    son parte del lenguaje HTML son ignorados por el motor. 

    La prioridad principal del motor es mostrar los resultados de la manera más


    rápida posible. Así funciona el proceso que realiza el navegador al momento de
    interpretar nuestro documento HTML, y entregarnos el resultado final: nuestra
    página Web.

    Esperamos que hayas disfrutado de la descripción de los procesos necesarios


    para declarar un documento HTML Continúa tu proceso de aprendizaje
    ampliando tus conocimientos.

    ¡Hasta la próxima!

    También podría gustarte