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>
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>
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)