Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Bloque 1 Guia de Estudio

    Cargado por

    joe sebastian ortiz trujeque
    3 vistas7 páginas
    El documento describe los elementos básicos de HTML como la estructura, títulos, encabezados, párrafos y listas. Explica que la estructura básica de un documento HTML consta de las etiquetas <html>, <head> y <body>. También detalla el uso de encabezados, párrafos y listas ordenadas y no ordenadas para organizar el contenido de manera clara y comprensible.

    Descripción original:

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento
    El documento describe los elementos básicos de HTML como la estructura, títulos, encabezados, párrafos y listas. Explica que la estructura básica de un documento HTML consta de las etiquetas <html>, <head> y <body>. También detalla el uso de encabezados, párrafos y listas ordenadas y no ordenadas para organizar el contenido de manera clara y comprensible.

    Copyright:

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

    Bloque 1 Guia de Estudio

    Cargado por

    joe sebastian ortiz trujeque
    El documento describe los elementos básicos de HTML como la estructura, títulos, encabezados, párrafos y listas. Explica que la estructura básica de un documento HTML consta de las etiquetas <html>, <head> y <body>. También detalla el uso de encabezados, párrafos y listas ordenadas y no ordenadas para organizar el contenido de manera clara y comprensible.

    Copyright:

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

    Programación web

    Karla Fabiola Trejo López

    Bloque I. HTML Básico 2


    1.1 Estructura del documento 2
    1.2 Título 3
    1.3 Encabezados 3
    1.4 Párrafos 4
    1.5 Listas 5
    Referencias 7
    Bloque I. HTML Básico

    1.1 Estructura del documento


    La estructura del documento en el contexto de la programación web se refiere a cómo
    se organiza y presenta el contenido en una página web. Una página web efectiva
    debe tener una estructura clara y coherente para garantizar que los usuarios puedan
    acceder y comprender fácilmente la información presentada.

    La estructura básica de un documento HTML consta de elementos clave, como la


    etiqueta `<html>`, que engloba todo el contenido, seguida de las secciones `<head>`
    y `<body>`. La sección `<head>` contiene información meta sobre la página, como el
    título y enlaces a archivos externos, mientras que la sección `<body>` alberga el
    contenido visible para los usuarios.

    Es importante considerar la jerarquía de la información al diseñar la estructura de una


    página web. Los elementos deben estar organizados de manera lógica utilizando
    encabezados y párrafos para presentar la información de manera clara y
    comprensible. Además, el uso adecuado de etiquetas semánticas como `<header>`,
    `<nav>`, `<main>` y `<footer>` puede ayudar a mejorar la accesibilidad y la usabilidad
    de la página.

    Imagen 1. Estructura del documento.


    1.2 Título
    El título es un elemento esencial en una página web, ya que proporciona información
    clave sobre el contenido y ayuda a los motores de búsqueda y a los usuarios a
    comprender de qué trata la página. En HTML, el título se define mediante la etiqueta
    `<title>` en la sección `<head>` del documento.

    Un título efectivo debe ser descriptivo, conciso y relevante para el contenido de la


    página. Debe captar la atención del usuario y transmitir la idea principal de la página
    de manera clara. Además, es recomendable incluir palabras clave relevantes en el
    título para mejorar la visibilidad en los resultados de búsqueda.

    Es importante recordar que el título de la página se muestra en la barra de título del


    navegador y también se utiliza como el título predeterminado cuando los usuarios
    guardan la página como marcador o enlaces. Por lo tanto, dedicar tiempo a crear un
    título significativo puede marcar la diferencia en la experiencia del usuario.

    Imagen 2. Ejemplo de uso título <title>.

    1.3 Encabezados
    Los encabezados desempeñan un papel crucial en la organización y jerarquización
    del contenido en una página web. En HTML, se utilizan etiquetas de encabezado
    `<h1>` a `<h6>` para definir diferentes niveles de encabezados, donde `<h1>`
    representa el nivel de encabezado más alto y `<h6>` el nivel más bajo.

    Los encabezados se utilizan para introducir secciones y subsecciones de contenido,


    lo que facilita la navegación y la comprensión del usuario. Un encabezado `<h1>`
    generalmente se usa para el título principal de la página, mientras que los
    encabezados de niveles inferiores se utilizan para subdividir el contenido en temas
    más específicos.
    Es importante utilizar los encabezados de manera semántica y coherente. Los
    encabezados adecuadamente estructurados mejoran la accesibilidad y la legibilidad
    de la página, tanto para los usuarios como para los motores de búsqueda.

    Imagen 3. Ejemplo de uso de encabezados <h1><h2>.

    1.4 Párrafos
    Los párrafos son bloques de texto que se utilizan para presentar información detallada
    y desarrollar ideas en una página web. En HTML, los párrafos se definen utilizando la
    etiqueta `<p>`. Los párrafos permiten una presentación estructurada del contenido, lo
    que mejora la legibilidad y la comprensión del usuario.

    Cada párrafo debe centrarse en un tema o idea específica. Es importante mantener


    los párrafos concisos y evitar la sobrecarga de información en un solo bloque de texto.
    Se pueden utilizar elementos adicionales, como el énfasis mediante etiquetas `<em>`
    o `<strong>`, para resaltar partes importantes del contenido y hacer que la lectura sea
    más atractiva.

    El uso adecuado de párrafos contribuye a una experiencia de usuario positiva, ya que


    facilita la absorción de la información y mantiene a los visitantes interesados en el
    contenido de la página.

    Imagen 4. Ejemplo de uso párrafos <p>.

    1.5 Listas
    Las listas son una forma efectiva de presentar información de manera organizada y
    fácilmente comprensible en una página web. HTML ofrece dos tipos principales de
    listas: listas ordenadas (`<ol>`) y listas no ordenadas (`<ul>`).

    Las listas ordenadas se utilizan cuando se necesita establecer un orden específico


    entre los elementos, mientras que las listas no ordenadas se emplean para enumerar
    elementos sin un orden específico. Cada elemento de la lista se define con la etiqueta
    `<li>`.

    Las listas pueden utilizarse para presentar instrucciones paso a paso, características
    destacadas o cualquier tipo de información que requiera una estructura organizada.
    Además, las listas también pueden anidarse dentro de otras listas para crear una
    jerarquía de información más compleja.

    Al usar listas de manera adecuada, se mejora la claridad y la accesibilidad del


    contenido, lo que beneficia la experiencia del usuario.

    Las listas (ya sean ordenadas, no ordenadas) pueden contener varios atributos que
    permiten personalizar su apariencia y comportamiento. A continuación, se describen
    algunos de los atributos comunes que se pueden utilizar con las etiquetas de lista en
    HTML:

    type: Este atributo se utiliza para especificar el tipo de marcador o numeración en las
    listas. Para listas no ordenadas (<ul>), los valores comunes son "disc" (viñetas),
    "circle" (círculos) y "square" (cuadrados). Para listas ordenadas (<ol>), los valores
    comunes son "1" (números), "A" (letras mayúsculas), "a" (letras minúsculas) y "I"
    (números romanos mayúsculos).

    Imagen 5. Ejemplo de uso de listas <ul>, <ol>


    Referencias

    Mozilla Developer Network. (s.f.). HTML Basics. https://developer.mozilla.org/en-


    US/docs/Learn/Getting_started_with_the_web/HTML_basics

    Mozilla Developer Network. (s.f.). HTML Lists. https://developer.mozilla.org/en-


    US/docs/Web/HTML/Element/ul

    Google. (s.f.). Improve snippets with a meta description makeover.


    https://developers.google.com/search/docs/advanced/appearance/good-titles-
    snippets

    W3C. (2017). HTML Living Standard - The `h1`, `h2`, `h3`, `h4`, `h5`, and `h6`
    elements. https://html.spec.whatwg.org/multipage/sections.html#the-h1-h2-h3-
    h4-h5-and-h6-elements

    World Wide Web Consortium (W3C). (2017). HTML Living Standard - The `p`
    element. https://html.spec.whatwg.org/multipage/grouping-content.html#the-p-
    element

    También podría gustarte