My FeedDiscussionsHeadless CMS
New
Sign in
Log inSign up
Learn more about Hashnode Headless CMSHashnode Headless CMS
Collaborate seamlessly with Hashnode Headless CMS for Enterprise.
Upgrade ✨Learn more

Add an outline for more straightforward navigation when writing (maybe when reading too).

Denny Trebbin's photo
Denny Trebbin
·Sep 25, 2020·

1 min read

Clickable Outline while writing

Writing long articles needs a bit of tweaking. A clickable outline to quickly navigate through the page — scrolling up and down only to scan for how I named things is a bit cumbersome.

I can imagine finding the Outline right next to the navigation bar on the left side of the screen and making it hidable not to let the Outline take away screen estate on smaller screens of smaller resolutions.

Fill the Outline with all the Markdown headers found in the article and make each of them clickable. You already assign unique CSS ids to each of them.

Clickable Outline while reading

The Outline could also be visible when reading articles.

Give TL;DR; headers a special meaning

One future idea could also be to give meaning to a special header. If one header is named TL;DR; place it above the article (hide/show option or let users decide in there preferences if they wanna see such a teaser.

My idea visualized (improve)

image.png