Why use a heading element when you can just use a <p> and change the font size?

Hi Shakran Mushtaq,

You could do that, however, say your site had 3 different styles of heading. Each paragraph will need a class added to it, which makes the code unnecessarily bloated. It also means when you (or another developer) is scanning through your code it's harder to find headings.

The heading tags are also semantic tags. This means you look at the <h1> tag and you know it's a level 1 heading. You do that to a paragraph with a class, you won't know it's a heading, unless your class is named something like 'heading-one'. But again this is bloated and unnecessary code.

Each heading, <h1> through to <h6> also carries SEO benefits. Search engine spiders look for headings and use them to 'read' the page. It knows that <h1> tags are normally your page title, and then indexes it on SERP's.

Without using headings, spiders would consider your whole page to be a paragraph, regardless of how it looks to a human. Spiders read the code, humans see the output of the code. While humans would see your headins styled different, but still as a paragraph, a search engine would simply see the entire page as a bunch of text, with no headings or subheadings.

Headings are also used for screen readers to properly interpret the page to those who use them. A screen reader would tell the user that it's a new section called 'Foo Bar'. If it was all in a paragraph tag it would read it without making the appropriate breaks in the sentences.

I hope this clears that up for you!

Kind regards, Ash