1

Como organizar títulos em um documento html? Ex: eu tenho 2 section, 3 div's, um nav, 1 aside e 3 article. Então devo fazer a ordem de títulos e subtitulos em relação à cada elemento ou em relação à página toda? Ou seja cada elemento ou secção vai ter um h1 ou minha orientação deve ser em relação à página geral?

<h1>PRINCIPAL</h1>
<h2>ASSUNTO 1</h2>
<h3>SUBTITULO DO H2</h3>
<h2>ASSUNTO 2</h2>
<h3>SUBTITULO DO H2</h3>
<h2>ASSUNTO 3</h2>
<h3>SUBTITULO DO H2</h3>
</section>
<section class="lado esquerdo"> <nav></nav> <aside>outros elementos e assuntos <article>outros elementos e assuntos </section>
</section>
6
  • 4
    Poderia por favor colocar o conteúdo do seu HTML aqui? Commented 11/11/2015 às 15:42
  • em geral o foco é o conteúdo... Commented 11/11/2015 às 15:56
  • <section class="tudo"> <section class="lado direito"> <h1>PRINCIPAL</h1> <H2>ASSUNTO 1</H2> <H3>SUBTITULO DO H2</H3> <H2>ASSUNTO 2</H2> <H3>SUBTITULO DO H2</H3> <H2>ASSUNTO 3</H2> <H3>SUBTITULO DO H2</H3> </section> <section class="lado esquerdo"> <nav></nav> <aside>outros elementos e assuntos <article>outros elementos e assuntos </section> </section> seria algo assim.
    – Alexandra
    Commented 11/11/2015 às 15:56
  • Até aonde eu sei, só pode ter 1 elemento H1 por página. maujor.com/w3ctuto/qatips/useh1.html Commented 11/11/2015 às 16:01
  • Valeu, era isso que eu queria saber. Ajudou muito.
    – Alexandra
    Commented 11/11/2015 às 16:04

2 Respostas 2

3

Não entendi muito bem sua pergunta, mas vou tentar responder o que entendi.

A ordem dos cabeçalhos h1, h2, h3,... "não interfere" na página. Isso vai de acordo de seu layout e como preferir. Veja esse exemplo com vários <h1> na página:

<h1>PRINCIPAL</h1>
<h2>ASSUNTO 1</h2>
<h3>SUBTITULO DO H2</h3>
<h1>PRINCIPAL 2</h1>
<h2>ASSUNTO 2</h2>
<h3>SUBTITULO DO H2</h3>
<h1>PRINCIPAL 2</h1>
<h2>ASSUNTO 3</h2>
<h3>SUBTITULO DO H2</h3>
</section>
<section class="lado esquerdo"> <nav></nav> <aside>outros elementos e assuntos <article>outros elementos e assuntos </section>
</section>

Agora, note que se sua preocupação for SEO, a abordagem muda. Para isso, vários fatores são levados em conta, inclusive o <h1>. Para isso, deve-se levar em conta alguns fatores, como:

1 – H1 com a palavra-chave da ideia principal

2 – H2 com as palavras-chave dos elementos da ideia principal

3 – H3 para dividir os elementos ainda mais e facilitado o entendimento e visualização das pessoas e dos robôs.

Note um exemplo prático da utilização das mesmas:

Suponha que você deseja fazer um site de vendas de carros chamado de carros.com.

<h1>

A maior lista de carros novos, semi-novos e usados da internet

Observe no exemplo de H1 acima que foram utilizados algumas possíveis keywords do site e o texto está escrito de forma que o usuário consiga entender.

<h2>

Venda de Carros da Marca FIAT

Já no texto do H2 temos algo mais especifico, ou seja é uma subseção do H1, e novamente colocamos algumas keywords do site no H2, isso ajuda e muito os motores de busca e o usuário a acharem o que eles precisam no site

<h3>

Venda de Carros Fiat Punto

Assim como no H2, o H3 tem que ser um complemento do H# superior. E essa regra deve ser seguida até a tag H6.

Nota: Você encontrará mais sobre o assunto se utilizar a palavra chave Heading Elements ou Heading Tags.

Fontes:

0

Segue o que diz o W3C.

Fonte W3C => http://www.maujor.com/w3ctuto/qatips/useh1.html

Use h1 para cabeçalhos de primeiro nível

H1 é o elemento HTML usado para cabeçalhos de primeiro nível em uma página:

Se o documento for único em seu assunto, por exemplo: Coisas para se ver e para se fazer em Genebra, o cabeçalho de primeiro nível provavelmente será igual ao título do documento. Se o documento for um de uma coletânea sobre um assunto, por exemplo: uma página sobre cães fazendo parte de uma coletânea de páginas sobre animais de estimação, o cabeçalho de primeiro nível pode ser um texto específico referente ao assunto; apenas

Cães

enquanto o título pode ser qualquer texto genérico referente ao assunto: Cães - Guia para animais de estimação. Ao contrário do título, este elemento, os , podem conter links, enfâse ou outro HTML phrase elements (elemento HTML para frases).

O tamanho de fonte padrão ("default") adotado por alguns browsers para , infelizmente tem levado alguns projetistas a adotar o . Para ferramentas que se utilizam da estrutura da página para seu desempenho, como por exemplo Amaya's table of contents view (NT:ferramenta Amaya que relaciona os conteúdos de uma página) esta prática (usar no lugar de ) é prejudicial. Considere o uso das Folhas de estilos em cascata , que foram desenvolvidas para expressar os tamanhos de fontes preferidos pelos projetistas para elementos como os H1 e H2.

6
  • 1
    Você não está confundindo <h1> com <title> não?
    – Randrade
    Commented 11/11/2015 às 16:14
  • 1
    Reclama com o W3C @Randrade Commented 11/11/2015 às 16:15
  • Não estou falando isso. Só estou dizendo que H1 é para cabeçalhos, como o próprio texto diz. Agora 1 por página?
    – Randrade
    Commented 11/11/2015 às 16:17
  • Melhorô? @Randrade Commented 11/11/2015 às 16:19
  • 1
    @Randrade Entendi, obrigado. Commented 11/11/2015 às 16:23

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .