Questions tagged [html-heading]

In HTML, the

,

,...

tags define headings of different levels,

being the highest. Browsers typically apply preset top and bottom margins as well as different font sizes and weights to headings.

The headings elements from <h1> to <h6> represent six levels of element headings, where <h1> is the highest s level and <h6> is the lowest level.

Usage notes

  • Heading information can be used by user agents to construct a table of contents for a document automatically.
  • Avoid using heading elements to resize text. Instead, use the CSS font-size property.
  • Avoid skipping heading levels: always start from <h1>, followed by <h2> and so on.
  • Use only one <h1> per page or view. It should concisely describe the overall purpose of the content.
  • Using more than one <h1> will not result in an error, but is not considered a best practice. It is beneficial for screen reader users, and SEO.
  • While HTML5 allows a <h1> per sectioning element, it is not considered best practice, and may subvert the expectations of how screen reader users navigate.
250 questions
5
votes
1 answer

Style is not being applied to H1 element in CSS

I'm facing a strange problem, the style is not being applied to the H1 element. Code: p h1 { color: red; }

This is a header

M.Taki_Eddine
  • 160
  • 2
  • 11
5
votes
6 answers

Showing

text inline using css
I want to show "Sentiment analysis" such that S should be much larger then h5 text. What's wrong with follwing code: HTML:

S

entiment Analysis
CSS: h1 { margin-left: 36%; color:#C0C0C0; font-family: "calibri"; …
user3121782
  • 159
  • 2
  • 11

5
votes
4 answers

Get the value of an

tag with JavaScript

I am trying to generate an MD5 check-sum of every element on a page that has the

tag, then display the values as a popup. The code I have already should get each

element, I just need to get the actual value of each one. var ghead =…

JamEngulfer
  • 747
  • 4
  • 11
  • 33

4
votes
2 answers

Proper semantic representation for addendum to, or description of a header

Say I have content in the form

George Epworth

Director

Content Content Content

There I've represented the descriptive part of the h2 as an h3, but it's really more part of the h2 isn't it? the h3 here doesn't exist on its…
Damon
  • 10,493
  • 16
  • 86
  • 144
4
votes
3 answers

Best practice for HTML headings when section nesting is 7 deep

My application creates HTML, and it genuinely leads to semantically correct nesting of section and article elements that might be 7 or more deep. For example, leaving out the clutter, nested like: html body section section …
alex.jordan
  • 296
  • 2
  • 11
4
votes
3 answers

Should I use

in a dialog?

HTML heading tags should be used in a way that maintains semantic structure (for both SEO and accessibility). Generally this means a single

for the current page heading, with lesser headings nested from there. However dialogs are often created…

4
votes
1 answer

H1 and H2 headings not recognized in SEO check. Angular

Im having troubles with a website made in Angular 5. Even though i have H1 and H2 headings, in every SEO checker appears this error: Your page does not contain any H1 headings
4
votes
3 answers

Keep heading (h1, h2...) from going full width on line break

I have headings that have display:inline-block set, but one of them is really long and takes two lines. The issue is that when it breaks to the second line, it automatically makes it take the whole width of the parent container (even though it has…
cVergel
  • 181
  • 1
  • 3
  • 11
4
votes
2 answers

Accessibility: h1 on the main page?

In terms of accessibility and document structure, what should be h1 or main heading on the home page? On other pages it's mostly simple: title of the page is good candidate for h1. But on the home page there is most likely no title? What would you…
Runnick
  • 613
  • 2
  • 12
  • 30
4
votes
2 answers

How to use h1 to h6 within header, section, article, etc.. in html5?

In xhtml 1.0 hn (h1 to h6) must represent document structure, like chapters in a book, and they all descend from the body. In html5 there are section, article, header, hgroup, and it seems that hn tags descend from one of these tags, and then are…
John
  • 119
  • 5
4
votes
2 answers

Nesting heading tags within li tags

Is it ever acceptable to nest heading tags within list item tags within the HTML5 nav element in an effort to have the navigation list items show up in outlines? This validates but is it semantically correct to have a heading on a navigation list…
user3863320
  • 49
  • 1
  • 1
  • 2
4
votes
1 answer

HTML 5 Document Outlining Algorithm

I am building a new site and I have recently started looking at the Document Outlining Algorithm. It states that all sections should have a header, sections include section, nav, article and body (There are probably some more too). So, I have a…
r3plica
  • 13,017
  • 23
  • 128
  • 290
4
votes
6 answers

How Do I Replace/Change The Heading Text Inside

, Using Javascript?

How do I change/replace the text: "Hello" using javascript to say "Goodbye" instead?

Hello

noobprogrammer
  • 1,140
  • 7
  • 22
  • 35
3
votes
1 answer

How to extract headings of a page using PHP (specifically WordPress)

Is it possible, using PHP, to extract the headings (h1, h2, etc.) from a page using PHP, and list them on the same page in an unordered list? A WordPress-specific solution is fine, but a general PHP solution is welcome as well. EDIT: What I want is…
Kevin Ji
  • 10,479
  • 4
  • 40
  • 63
3
votes
1 answer

Add product title heading tag for WooCommerce category archive pages

I'm looking to change heading tag for products displaying on product category page (from no heading tag to H2) but only on product category page. I found 2 solutions, which work, however they also change heading tag for products displayed on other…
Tilter69
  • 53
  • 4
1 2
3
16 17