H1

Rolul elementului H1

Elementele HTML <h1>–<h6> reprezintă nivelurile titlurilor dintr-un document. H1 are nivelul cel mai înalt, iar H6 are nivelul cel mai jos. H1 ar trebui să descrie clar conținutul paginii, într-un mod asemănător cu elementul HTML <title>.

O pagină ar trebui, în general, să conțină un singur H1. Folosirea mai multor elemente H1 pe aceeași pagină este permisă de standardul HTML atât timp cât acestea nu sunt imbricate, dar nu este considerată o bună practică. Structura recomandată începe cu H1 și continuă cu H2, H3 și celelalte niveluri, fără sărirea nivelurilor atunci când se deschide o subsecțiune.

H1 este un element semantic

H1 nu reprezintă doar text mare. Elementul comunică rolul titlului în structura documentului. Dimensiunea și aspectul vizual trebuie controlate prin CSS, nu prin alegerea unui nivel de heading nepotrivit.

Marcajul semantic ajută browserele, motoarele de căutare și tehnologiile asistive să înțeleagă organizarea paginii. Agenții utilizator pot folosi informațiile din heading-uri pentru a construi automat un cuprins al documentului.

H1 și accesibilitatea

Utilizatorii cititoarelor de ecran pot naviga rapid de la un heading la altul. Multe cititoare de ecran pot genera și o listă ordonată a heading-urilor. Un H1 clar, urmat de niveluri corect imbricate, îi ajută să determine tema și ierarhia conținutului.

Sărirea nejustificată de la H1 la H3 poate crea confuzie. La închiderea unei subsecțiuni se poate reveni la un nivel superior fără ca aceasta să reprezinte o eroare de structură.

În SEO, H1 contribuie la structura semantică a documentului. Motoarele de căutare pot înțelege organizarea paginii atunci când elementele HTML sunt alese conform rolului conținutului. H1 ar trebui să descrie subiectul principal, iar H2–H6 să organizeze secțiunile și subsecțiunile.

H1 nu trebuie folosit doar pentru a mări textul. Un <div> stilizat ca titlu poate arăta identic, dar nu oferă aceeași semnificație semantică. Aspectul vizual se controlează prin CSS, în timp ce elementul H1 indică rolul conținutului.

AEO și GEO sunt termeni de industrie, nu funcții Google. Extrasele disponibile nu susțin existența unor cerințe speciale privind H1 pentru AI Overviews, AI Mode sau alte sisteme bazate pe inteligență artificială și nici concluzia că folosirea unui H1 produce direct includerea, citarea sau o poziționare mai bună în aceste sisteme.

Din perspectiva organizării conținutului, H1 trebuie tratat ca parte a unei structuri coerente, nu ca mecanism izolat de optimizare. Un titlu precis și o ierarhie logică ajută utilizatorii, motoarele de căutare și tehnologiile asistive să înțeleagă organizarea documentului.

Pentru pagina unui cabinet stomatologic din Cluj-Napoca, structura poate fi:

<main>
  <h1>Implant dentar în Cluj-Napoca</h1>

  <h2>Când este recomandat implantul dentar</h2>
  <p>Conținutul secțiunii.</p>

  <h2>Etapele procedurii</h2>
  <p>Conținutul secțiunii.</p>

  <h3>Consultația inițială</h3>
  <p>Conținutul subsecțiunii.</p>
</main>

H1 descrie tema principală. Elementele H2 marchează secțiunile, iar H3 introduce o subsecțiune a secțiunii despre etape. Dimensiunile vizuale pot fi stabilite separat prin CSS.

1. Deschide pagina într-un browser și accesează instrumentele pentru dezvoltatori.
2. Caută elementul <h1> în structura HTML, nu doar textul care arată vizual ca un titlu.
3. Verifică dacă H1 descrie conținutul principal al paginii.
4. Verifică dacă pagina are, în general, un singur element H1.
5. Examinează ordinea heading-urilor și identifică eventualele treceri nejustificate de la H1 la H3 sau la un nivel inferior.
6. Folosește panoul de accesibilitate al browserului, dacă este disponibil, pentru a verifica rolul de heading și nivelul asociat.
7. Repetă verificarea pe șabloanele importante ale site-ului, deoarece structura poate varia între tipurile de pagini.

• Folosește, în general, un singur H1 care descrie clar conținutul principal al paginii.
• Plasează secțiunile principale sub H2 și subsecțiunile sub nivelurile următoare.
• Păstrează o ierarhie logică și evită sărirea nivelurilor când deschizi o subsecțiune.
• Controlează dimensiunea, spațierea și aspectul heading-urilor prin CSS.
• Verifică HTML-ul efectiv, nu doar prezentarea vizuală a paginii.
• Corelează tema H1 cu subiectul real al documentului, fără să transformi heading-ul într-o listă artificială de termeni.