DEV Community

Cover image for Headings in Markdown
Vishnu Damwala
Vishnu Damwala

Posted on • Updated on • Originally published at

Headings in Markdown

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

Markdown also has 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 the browser as <h1>Level 1 Heading</h1>.

# Level 1 Heading

<h1>Level 1 Heading</h1>
Enter fullscreen mode Exit fullscreen mode

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 the browser as <h2>Level 2 Heading</h2>.

## Level 2 Heading

<h2>Level 2 Heading</h2>
Enter fullscreen mode Exit fullscreen mode

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 use 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 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 has 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 the search engine examines & indexes search results based on keywords usage in headings.

Markdown HTML
# 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.

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

Read the complete post on our site Headings in Markdown

Read others post on our site MeshWorld

Happy 😄 coding

With ❤️ from 🇮🇳

Top comments (0)