Use different font weight on Heading HTML

Question

I wonder if it is semantically correct to use a different font weight on headings. For example, I have a h1 for a main title, I'm using h1, because I want search engines to know that this is my main title, but I don't want to use a heavy weight, I want to use a custom weight (100). Is it semantically correct to do this? Is there any other more semantically correct way to do it?

Answer 1

It's fine to do it. Semantics is what you interpret out of it. HTML tags are provided for the usability of code. If the output is what you like it to be, then it's fine.

That's just how your H1 happens to be styled!

Answer 2

There are two types of semantics that you should be concerned about.

The first are the semantics expressed explicitly by the markup. From this perspective, an H1 is an H1 no matter what it looks like. These are the semantics that are processed by user agents for various purposes (such as giving a default presentation in a browser, weighting the relative importance of different sections of text in a search engine indexer or generating a table of contents by an outliner).

The second are the semantics that the end user infers from the rendering of the content. If you were to style a heading so it looked exactly the same as a short paragraph, would the reader still be able to understand it to be a heading? Headings don't need to be bold, but they should be styled so they can be understood to be headings by someone looking at the page.