Headings in Markdown

Headings helps to organize your content into a easy to read format. Heading shows importance in your content specifying headings on a webpage. HTML has different heading tags to tell a web browser how to render content.

Markdown also have different levels of headings to structure your documents. Start lines with a # to create headings followed by word or phrase.

Always keep an empty single space between # and your content(word or phrase)

Level 1 Heading with Markdown

Above is an example for level 1 heading written with # Level 1 Heading which will be rendered by browser as <h1>Level 1 Heading</h1>.

# Level 1 Heading

<h1>Level 1 Heading</h1>

Multiple ## in a row denotes smaller heading sizes.

Level 2 Heading with Markdown

Above is an example for level 2 heading written with ## Level 2 Heading which will be rendered by browser as <h2>Level 2 Heading</h2>.

## Level 2 Heading

<h2>Level 2 Heading</h2>

In addition to heading helps improving accessibility for people who can’t easily read screens and also improves general structure and readability.

Heading for visually impaired readers

Visually impaired readers uses a screen reader to read the text on a screen aloud for them. Headings rendered as HTML heading tags. So by reading or listening to the headings in a content, visually impaired readers can get the gist of an article and decide if they’d like to continue reading it.

Screen readers also allow you to navigate through articles by traversing to the headings. So when your content have good descriptive headings, the readability and navigation for visually impaired readers are improved.

This is a level 2 heading improving SEO

The heading also improves SEO for your content as search engine examines & indexes search results based on keywords usage in headings.

MarkdownHTML
# Heading level 1<h1>Heading level 1</h1>
## Heading level 2<h2>Heading level 2</h2>
### Heading level 3<h3>Heading level 3</h3>
#### Heading level 4<h4>Heading level 4</h4>
##### Heading level 5<h5>Heading level 5</h5>
###### Heading level 6<h6>Heading level 6</h6>

You can use one # all the way up to ###### six for different heading levels.


Heading level 1

Heading level 2

Heading level 3

Heading level 4

Heading level 5
Heading level 6

Conclusion

Six different levels of heading styles supported by Markdown, improving accessibility & SEO.

Hope you like this!

Keep helping and happy 😄 coding

Avatar

A web geek, an industry experienced web developer & tutor/instructor residing in India 🇮🇳

Next
Previous

Related