14
respostas

conteudo principal

o conteudo principal é sempre a ultima tag de dentro?

14 respostas

Olá,

Será o conteúdo da tag chamada main.

Att,

Taina não entendi sua dúvida, a resposta do Ramon foi esclarecido sua dúvida ?

ramon e matheus! eu nao havia notado a tag main no exercício.. mas vi agora .. eu notei que ela seria o corpo do texto, no caso antes do h1(título principal) até antes do rodapé? seria isso sempre?

obrigada

Sim Taina, exatamente, repare que a tag main engloba todo seu código ficando apenas fora o aside e footer, pois são conteúdos que complementam a página mas não pertencem a tag main.

Um footer e aside são conteúdos principais para a página ? Não, são mais para complementar a mesma.

Espero ter ajudado

matheus, e se o aside viesse no meio do conteudo principal?

Ai não seria um aside Taina, pois semânticamente só utilizamos a tag aside quando queremos informar um conteúdo de navegação complementar a página onde o mesmo não tem relação com o conteúdo principal.

ah massa! tipo uma novidade num quadro separado daqueles "voce sabia que.."? ou um menu no canto do site?

O menu no canto de site sim seria um ótimo candidato a ser um aside, porém o você sabia que acredito que possa ser um div ou uma section:

Menu no canto:

<aside>
    <ul>
        <li><a href="#>Link 1</a></li>
        <li><a href="#>Link 2</a></li>
        <li><a href="#>Link 3</a></li>
    </ul>
</aside>

Você sabia que:

<section>
    <div class="">Você sabia 1</div>
    <div class="">Você sabia 2</div>
    <div class="">Você sabia 3</div>
</section>

Deixei uma sessão na página apenas para informar todos os você sabia.

entendi! massa :) o aside que foi mais complicado de entender.. voce teria mais exemplo?

ah, voce pode me ajudar no ex da etapa 4? "Podemos controlar o sublinhamento de um texto usando a propriedade text-decoration. Se usarmos o valor none, o texto aparece sem sublinhado; se usarmos o valor underline, o texto aparece sublinhado. Sabendo disso, use o inspetor para tirar o sublinhado de todos os links do menu de navegação da página bio.html.

Qual elemento você selecionou para alterar o estilo?"

no meu codigo so tem sublinhado as palavras que linkei com o site, ex da bmw, etc. nesse caso parece que nao tem como deixar sem sublinhar, correto?

Referente ao aside, imagine que temos um blog com a seguinte estrutura:

<nav>
    // categorias do blog
</nav>
<main>
    // posts
</main>
<footer>
    // footer
</footer>

Ai precisamos informar os posts recentes, veja que isso não tem impacto algum em nosso conteúdo principal que seria os posts então podemos utilizar um aside e deixamos ele do lado direito da tela:

<aside>
    // posts recentes
</aside>

Ou precisamos informar as redes sociais do blog, seria outro candidato a um aside pois novamente são informações irrelevantes ao blog:

<aside>
    // redes sociais
</aside>

Referente ao exercício você precisa tirar o underline de quais elementos ?

hum entendi! no caso seriam os links do menu de navegação.. então seria do aside, correto? :) e quanto ao article.. seria como essa tag? uma subpagina? de certa forma um aside seria um article? por ser irrelevante ao blog

Referente ao underline se você precisa pegar os links dentro do menu de navegação(aside) seria:

aside a {
    text-decoration: none;
}

Referente ao article ele não seria um aside pois quando se trata de um blog essa tag é muito importante pois cada postagem será um article.

<section class= posts">
    <article>Postagem 1</article>
    <article>Postagem 2</article>
    <article>Postagem 3</article>
</section>

Referente a semântica de tags varia muito do tipo de site que se esta fazendo, para o blog a tag article é muito importante porém para um e-commerce ja não tem importância alguma, por tanto, quais tags utilizar varia muito do site.

Entendeu ?

no e-commerce cada produto registrado com a descricao seria um article? rs

Eu não colocaria Taina, faria da seguinte forma:

<section class="produtos">
    <fieldset class="block">
        <legend class="block-header"><label class="block-title">Produto 1</label></legend>
        <section class="block-body">
            // aqui viria o preço, descrição e foto
        </section>
    </fieldset>
    // o código seria repetido para os outros produtos
</section>

Esse block seria uma espécie de um painel agrupando os dados do produto.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software