Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • HTML Semântico e Estrutura de Site

    Enviado por

    JUNIOR DORNELAS
    121 visualizações7 páginas

    Título original

    5. HTML SEMÂNTICO E SITE FINAL

    Direitos autorais

    © © All Rights Reserved

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    121 visualizações7 páginas

    HTML Semântico e Estrutura de Site

    Enviado por

    JUNIOR DORNELAS

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 7

    HTML: HTML SEMÂNTICO E SITE FINAL

    HTML semântico: É uma forma de deixar a estrutura do site com uma melhor organização, ajudando até
    mesmo na busca do google e facilitando a acessibilidade.

    • Tag semântica: É um elemento que possui significado e finalidade dentro da estrutura de um layout.

    • Para estruturar os elementos de um site, não se deve utilizar divs, pois é uma tag que não possui valor
    semântico e todas as partes do site serão interpretadas igualmente. Ex: Header com a mesma
    importância de um footer.

    <Header>: Parte superior do site, geralmente possui = (Título principal, logo, banner).

    Obs: <header>não pode ser colocado dentro de um <footer>ou <address>.

    <Nav>: Parte do site que possui os elementos de navegação (Menu de links).

    <Main>: O elemento <main> define o conteúdo principal dentro do <body>. Entende-se como conteúdo
    principal que se relaciona diretamente com o tópico central da página, o main deve ser único na página.

    Obs: <main> não pode ser filho dos elementos: <article>, <aside>, <footer>, <header>, ou <nav>.
    <Article>: O <article> é um elemento que possui um conteúdo independente e autocontido.

    • Postagens em blog ou fórum/ Artigos de jornal/Textos externos.


    • Comentários do usuário.
    • Cartões de produtos.

    _________________________________________________________________________________________________________________________________

    <Section>: O elemento HTML <section> representa uma seção genérica de conteúdo, geralmente com um
    título, quando não existir um elemento semântico mais específico para representá-lo.

    <Aside>: A tag define um conteúdo indiretamente relacionado ao conteúdo principal, Ex: glossário; conteúdo
    vagamente relacionado, como avisos; a biografia do autor.

    Obs: O conteúdo geralmente é colocado como uma barra lateral em um documento, porem todo conteúdo lateral
    é considerado um aside.

    <Footer>: É o rodapé da página, localizada na parte inferior. Ex: Normalmente um rodapé contém informações
    sobre o autor da seção de dados, direitos autorais ou links para documentos relacionados.

    <Address>: Tag que define as informações de contato do autor/proprietário de um documento ou artigo. As


    informações de contato podem ser um endereço de e-mail, URL, endereço físico, número de telefone,
    identificador de mídia social, etc.
    Atividade site: Criar uma página com os elementos do módulo e linkar elas através do nav.
    Página 1:

    ________________________________________________________________________________________________________________________

    Página 2:
    Página 3:

    As imagens e páginas utilizadas no site, precisam estar na mesma pasta.


    Página 1:
    Página 2:

    Página 3:

    ________________________________________________________________________________________________________________________

    Você também pode gostar