HTML Semantico

Estructura de un sito Web

La mayoría de páginas Web se ven diferentes,  pero todas están formadas con las misma etiquetas HTML

Estructura básica

Header

Sección utilizada para ubicar contenido como el título de la página, logo, lema, menú

Navigation Bar

Sección utilizada para mostrar una colección de menú o opciones de navegación

Main

Sección grande, con el contenido principal de una página web suele estar dividida en varias secciones

Sidebar

Sección utilizada para ubicar información secundaria como link a página externas, información del autor...

Footer

Sección para ubicar elementos relacionados con el SEO. copyright, información de contacto

Ejemplo de estructura

<header>
    <h1>Header</h1>
</header>
<nav>
       ...
</nav>
<main>
    <article>
        <h2>Article heading</h2>
        ...
        <h3>Subsection</h3>
        ...
    </article>
    <aside>
        <h2>Related</h2>
        <ul>
            ...
        </ul>
    </aside>
</main>
<footer>
    <p>...</p>
</footer>

¿Como se añade información de contacto?

¿teléfono, correo, dirección?

¿Como se contenido multimedia?

¿Video, audio, images?

Planeación de un sitio Web

04 [PW] [Clase] HTML Semántico

By Néstor Aldana

04 [PW] [Clase] HTML Semántico

Uso de tablas y formularios con diferentes elementos de entrada

  • 218