Solution 1 :

Practically, the answer to both questions is ‘yes’. There won’t be any error thrown and the headings will be rendered just fine on DOM. However, neither approach should be taken.

The headings in your web page should always begin with an <h1> tag because it describes the overall content of your page. Also, you should avoid skipping the heading tags. The <h1><h6> tags are not meant to be used for their sizes but for the hierarchical context they provide to your document.

According to MDN Docs:

Avoid skipping heading levels: always start from <h1>, followed by <h2> and so on.

A common navigation technique for users of screen reading software is jumping from heading to heading to quickly determine the content of the page. Because of this, it is important to not skip one or more heading levels. Doing so may create confusion, as the person navigating this way may be left wondering where the missing heading is.

Remember that you can always use CSS properties to make your headings look just the way you want.

Problem :

Can you have an <h2> element without having an <h1> element in your HTML document?
Similarly, can you have an <h2> element and then directly jump to the <h4> element, skipping having an <h3> element, as opposed to the hierarchical order?