August 15th, 2024

Markdown Is Meant to Be Shown: Stop Hiding the Syntax (2021)

Jason Snell critiques Markdown editors on the App Store, advocating for visible syntax and clear distinctions between WYSIWYG and Markdown editing, praising "Hey World" for its effective approach.

Read original articleLink Icon
FrustrationConfusionPreference
Markdown Is Meant to Be Shown: Stop Hiding the Syntax (2021)

Jason Snell discusses the varying quality of Markdown editors available on the App Store, emphasizing that not all implementations meet user expectations. He argues that a good Markdown editor should display every keystroke, including hyperlinks, rather than hiding them. Snell appreciates syntax coloring and styling that enhances readability without obscuring the underlying Markdown syntax. He believes the essence of Markdown is to allow writers to see the punctuation characters that correspond to HTML tags, ensuring they know what the final output will look like. Snell expresses confusion over apps that use Markdown for storage but only display styled text, advocating for a clear distinction between WYSIWYG editing and Markdown editing. He cites "Hey World" as an example of an app that successfully balances these elements by allowing users to edit links in a popup while maintaining visible Markdown syntax.

- Jason Snell critiques the quality of Markdown editors on the App Store.

- He insists that Markdown syntax should always be visible to users.

- Syntax coloring and styling are appreciated but should not hide the Markdown code.

- Snell prefers traditional Markdown editing without hidden formatting.

- He highlights "Hey World" as a successful example of effective Markdown editing.

AI: What people are saying
The discussion around Markdown editors reveals diverse opinions on their usability and design choices.
  • Many users prefer visible syntax in Markdown editing, arguing it enhances clarity and reduces errors.
  • Some commenters express frustration with WYSIWYG editors, feeling they obscure the underlying markup and complicate the writing process.
  • There is a call for more flexible editing options, such as toggling between Markdown and rendered views.
  • Several users advocate for the use of more expressive markup languages in applications where Markdown may not be the best fit.
  • Concerns are raised about the readability of Markdown when autoformatters alter whitespace and formatting, impacting the author's intent.
Link Icon 37 comments
By @voidhorse - 4 months
I think the bigger problem is that apps that don't need/shouldn't use markdown reach for it as a default and build upon it when they would have been served better investing in richer markup.

Take ulysses (mentioned in the article) for example. It has grown into a full-fledged writing and word processing application, but its being based on markdown originally has only hampered that. They've had to implement all of these clunky extensions and features in terms of markdown, and as the post states, try to hide the fact that it's all markdown to make it feel more like a classic word processor. At this point it just makes the whole experience clunky. People that just want to write markdown deal with weird extensions and frustrating syntax hiding, people that don't need to learn some minimal markdown just to use a word processor...

It's 2024. I hope companies start to realize that markdown is a fantastic solution for certain cases but it is not the only solution. Some applications really are better served by more complex, but much more expressive markup languages, especially if they are going to shield the user from it all anyways.

By @j1elo - 4 months
Before I learned the existence of Markdown, the intuitive most logical markup for me was (and after 10+ years of writing Markdown, still is):

* *Asterisks* should be bold. Like WhatsApp and Slack do. Because they bring attention to the eye, marking a strong emphasis, and also because for italics there seem to be a much better alternative.

* /Slash/ should be italics. Young me thought this was so obvious! Because italic text is leaning to the right, just like the slash bar. (Note that with time I ended up realizing that this would be a bad idea because slashes are too commonly used in plain written language. The parser would need to be too clever. But still, seemed nice for a while :-)

* _Underscore_ should be underline. I mean, the name says it all. This is so obvious to me that I never understood how it's not the case. I had been writing _this_ to visualize an underlined word for so much time before learning Markdown, that having it for italics just feels strange.

Anyway. If someone knows some resource about the thought process, discussions, or decisions that were made to adopt the current syntax (especially to decide that _underscore_ should italicize, which feels so strange) please let me know, I love reading about that kind of thing :)

By @gkoberger - 4 months
One thing I love about being able to see the syntax when editing is that you know what's about to happen. A backspace will always delete the previous key; you won't end up in a situation where you're deleting a whole block of content. And when you type, you know if the cursor is on the left or right side of the "*", whereas in WYSIWYG it could be on either side of the invisible change from bold to regular.

It's much more relaxing for me to write in Markdown, because I don't have to think about the mode I'm in or how to get out of a small pickle. Everything is just a character.

I don't think Markdown is for everything. Microsoft Word is not a Markdown editor, and most people are better served by a WYSIWYG editor. But for writing content, I always prefer personally to write in markdown (and to see the syntax), since it's easier to focus more on writing and less on the editor.

By @fenomas - 4 months
Related: given that markdown is meant to be read, it kind of drives me up the wall that some people nowadays run autoformatters like Prettier on it. Super-aggressive formatters like prettier remove various whitespace, and mangle other things that human authors do for readability. Which is fine if the file is something that's only ever meant to be parsed by scripts, but the whole point of markdown is that people read it!

(edited to add: It wouldn't really be an issue if prettier had some config options for not mangling whitespace, but that ship seems to have sailed for some reason.)

By @msf1024 - 4 months
The reason I write in markdown is because it is fast and keyboard-driven. I don't want to see it when I'm looking at my notes or editing them. The idea that it is meant to be seen is no more than a personal preference.
By @thomascgalvin - 4 months
I generally don't even like syntax highlighting for Markdown. I find having the text jump around because it became bold or italicized distracting, and it's even worse when a header is suddenly a larger size and everything below it is pushed down the screen.

Markdown is simple, and I like working with it simply.

I suppose there is some value in having the more complicated aspects, like images and tables, checked for syntax so you can see if you've made a mistake, but I run a macro to generate those anyway, so I'm fairly confident in the result.

By @red_admiral - 4 months
Trello, once made for developers by developers, has announced that some time this August they will disable the markdown editor on desktop and force you to use the WYSIWYG one. The markdown one will remain on mobile, so there's clearly no compelling reason to do this. There won't even be an opt-out anymore.

(Could someone please find out which resources we all have to add to ublock to work around this?)

By @taeric - 4 months
Oh wow. From headline, I first thought this meant that viewing a markdown document should show me the markup. Which falls on its face with images and links, of course.

No, this is about editing the document. And... I confess I'm confused on why folks would want the opposite? WYSIWYG is, of course, a thing and popular for many reasons. So, I can see having the option to operate in that way. But a huge benefit of markup languages of any kind is that I can see the markup. Fully agreed that I should be able to see it.

By @Doctor_Fegg - 4 months
> I have no idea why there are now apps that use Markdown as their back end storage format but only show styled text without the Markdown source code visible.

Because backend storage of rich text is not a solved problem?

RTF is a horrid, over-complex serialisation. Some platforms have their own internal format for rich text (e.g. NSAttributedString) but serialisation is either lacking or platform-specific.

Writing as WYSIWYG but storing in the backend as Markdown is not an insane idea, and I say that as someone whose muscle memory has been cmd-B/cmd-I since 1992 and would never choose to actually compose in Markdown unless I had to.

By @tjoff - 4 months
Though only show the markdown if one is expected to edit it (which would be the case in an editor).

Otherwise, if the usecase is consumption you are better to show the generated output.

By @bfung - 4 months
> Maybe I don’t know much about Markdown…

Says the inventor of it, 20yrs ago. https://daringfireball.net/projects/markdown/

By @ericyd - 4 months
> Trust me, it’s meant to be shown.

Maybe it's time to accept that this thing you created is bigger than yourself and it's future is not in your hands.

By @gsinclair - 4 months
Grover thinks the purpose of Markdown is that the author knows what HTML tags will be generated. That was his purpose, but it’s long outgrown that!
By @iambateman - 4 months
Ahh, yes. I, as a developer, think Markdown is wonderful – simple even – so I use it all the time. It finds it's way into my applications and interfaces. The pure elegance is the stuff of dreams.

Then I bring a client into their app for an onboarding meeting. When they see a bit of Markdown, they start to fidget, then sweat. "Will I be asked to perform these magic incantations?" they wonder. They feel a bit of queasiness but try to hold it back. Perhaps this will be ok. But, after about 10 minutes, I show them that `# Header` is how you make a header.

Their disdain is now total...How dare I imply that a hashtag implies a header. This is hard.

Then, I show them a link. "It's just like this", I say: `(https://example.com)[example link]`. "You'll get used to it."

Finally, the client pounds his fists on the table. "That's CODING DAMMIT. WE PAID YOU TO DO THE CODING YOU *$$HOLE. I want it to be like...well...Microsoft Word."

---

You see, my friends...the real problem here is that Microsoft Word is a nightmare but it is _the_ nightmare to which all other dreams are compared. And thus, sheepishly, I awaken, and install TinyMCE.

By @rubymamis - 4 months
> I have no idea why there are now apps that use Markdown as their back end storage format but only show styled text without the Markdown source code visible.

The reason why we do in Plume[1] is simple - we want a WYSIWYG editor for our non-technical users, yet also the reassuring longevity of a plain text format such as Markdown. Simple as that. In my opinion, it's a combo that's hard to beat.

[1] https://www.get-plume.com/

By @ides_dev - 4 months
This is precisely why I use Bear [0] (although Bear does hide the link URLs) and just cannot get on with Notion. The worse thing about editing in Notion (and other editors where the syntax is hidden) is trying to adjust `mono-space text`. It always seems to get confused about whether I'm inside the mono-space area or outside it and I end up making stuff mono-space that shouldn't be or vice versa.

[0] https://bear.app/

By @teo_zero - 4 months
When I edit a C program, comments are highlighted in a specific way, but the // characters are not removed. Why should editing a markdown text be different?
By @bastawhiz - 4 months
If you only care to expose limited formatting to the user, whether the file is stored in Markdown or not is immaterial. It could be stored in Word 2003 DOC format and export to Markdown, and if the serialization and deserialization are faithful, it doesn't matter at all.

Markdown is portable, fast, safe, and simple. Being able to dump your data as Markdown (which you know works, because the Markdown version is the literal source of truth) means you're guaranteed to be able to extract your data and move it wherever you want with perfect fidelity. That's a huge bonus.

The argument here is pointless if your concern isn't the syntax: Markdown _as a serialization format_ versus Markdown _as a typeable syntax_ are two separate concerns. The UX of a tool meant for editing Markdown is going to be extremely different than a tool to edit simple rich text.

In my own app, I default to WYSIWYG with an option to edit the raw markdown (for podcast show notes, which have very limited formatting options). Why? Because the alternative is HTML and that sucks to write by hand (especially if you can't use most tags).

By @Vaslo - 4 months
I’ve run into this exact same issue with many of the self hosted wikis/tools. Some of the ones I had interest in like Trilium don’t have native support and you have to use a plug-in hack to see both the code and the preview, or you have to click back and forth between rendering and redoing.

I just wouldn’t have markdown in my software if I wasn’t going to support a preview.

By @Y-bar - 4 months
I am currently trying to fit Obsidian into my workflow as a note taking app, and this is one of my main gripes about the app. Another being that it does not integrate well with the operating system spell checking, so adding a word elsewhere to the system dictionary does not reflect in Obsidian, and the other way around.
By @throwmeawaysire - 4 months
People say that Markdown is isomorphic to HTML but HTML has <b>, <i>, <em>, and <strong>, while Markdown bold and italic almost always get transformed into <em> and <strong>, right? According to MDN the HTML standard defines clearly very different semantics for the elements, although IIRC there was once a drive to move away from <b> and <i> as presentational, which is why people started using <em> and <strong> instead but in a way as if they were presentational, kinda defeating the point. IDK, what do you think?

"<b>: The Bring Attention To element" "<i>: The Idiomatic Text element" "<em>: The Emphasis element" "<strong>: The Strong Importance element"

By @dogsledsleddog - 4 months
I think the don't do it if you are mixing, purist thinking cycles through for each UI and is generally pointless and doesn't serve people who take it up.

All the rat poison oriented window managers also have a great point and the ones with no mouse support at all might be perfect for many but it is silly and counter productive not to provide the mouse support because it is an anti pattern and pretend that all the users who need to see the benefits of avoiding the anti pattern, and practice [not] using it, are going to somehow magically end up trying the purist UIs.

By @hoosieree - 4 months
Probably easier to get people to change the name from README.md to RENDERME.md.
By @paradox460 - 4 months
I'd prefer if we stopped using markdown all together, and moved to something like djot: https://github.com/jgm/djot
By @chrismorgan - 4 months
> If you want WYSIWYG, do WYSIWYG. If you want Markdown, show the Markdown. Trust me, it’s meant to be shown.

One valuable thing about using Markdown as an data storage/exchange format is that it's often easier to manipulate; for example, diffs are normally going to be better, and content edits often easier. Mind you, a proper encoding of a WYSIWYG format, and corresponding tooling, will be better... but for quick-and-dirty that normally works well, Markdown is ultimately pretty good (unfortunately, in my opinion).

By @voltaireodactyl - 4 months
There’s a screenwriting markdown variant called fountain that has underlining and basically works perfectly for nearly any writing. Wish it were more widespread.
By @slightwinder - 4 months
But syntax is ugly, especially the more complex parts we have now. And I think some of them, like tables, code blocks or modern link-style, weren't even part of the original markdown.

And the reason I prefer Markdown, is because it's not proprietary, and Obsidian, my preferred Markdown-Tool, has a different workflow than the usual WYSIWYG-Tools. If Obsidian would use json or yaml for everything, I would still use it. It's just a tool for me, not the goal.

By @verdverm - 4 months
There are some editors, like TipTap, that output a json object, even though they look like they could be markdown editors.

This is my goto React Markdown editor, very solid out of the box and customizable in all sorts of ways

https://uiwjs.github.io/react-md-editor/

By @jareklupinski - 4 months
put a "Show Markdown / Show Result" toggle button at the top of the textbox that contains the editable field

save the current setting to a cookie

some people who stay on the rendered side sometimes forget the syntax, and use the Show Markdown button to check how something was created

By @preommr - 4 months
90% sure the reason is that new users, not familiar with the app, want to see that the change is actually taking place. Without it, the user may expect the post would literally be '*text*' instead of being bolded.
By @zeveb - 4 months
I think that this is correct. Also, we really shouldn’t forget that Markdown is meant to generate HTML, and that HTML blocks are valid Markdown: a system which does not permit it isn’t really using Markdown.
By @bitwize - 4 months
Maybe it's time we brought back the "Reveal Codes" command?
By @eslaught - 4 months
I guess I'll defend the minority opinion.

For context, I write over 100k words a year. That's something like 150 pages depending on how you format it. This includes both technical documents (which I mainly do in Latex) and more traditional long-form writing (which I do in Markdown).

For technical documents, formatting is very much a key part of the presentation, so I want to see the markup. I mainly use Emacs and I render the PDF from the terminal when I want to see it. Fidelity to the final result is essential, so I don't bother with Latex IDEs (unless I'm doing collaborative editing on Overleaf).

For my long-form writing, I want the markup to get out of the way. I use Markdown because it's simple and portable and generates a large number of formats (via Pandoc); that does NOT mean that I want the asterisks and hash signs and so on staring me in the face. Also, frankly, it's just easier to write when the text looks pretty. For most of this writing I write in Typora (with a nice variable-width font), and then edit in Emacs with the generated PDF side-by-side.

Why bother with Markdown at all? Because Word ultimately gets in the way of me producing nice documents. The fact that I can move my cursor to see exactly what the markup is, and that this markup is simple and straightforward and maps well into what I'm trying to generate, helps me focus on content and avoid distractions. Word has far too many knobs, far too many ways to do something that looks visually correct but generates the wrong markup (especially when you're going to do post-processing in some other tool), and really hinders refactoring (when you need to make global style changes). So I use Markdown, but again, that doesn't mean I want markup staring me in the face.

I'm not sure why people are so incredulous that this is a desirable goal? I mean it should be pretty obvious that the apps would not exist if there wasn't a market for it, so clearly I'm not the only one who feels this way.

By @timetraveller26 - 4 months
It should be optional, hide by default (maybe like Obsidian where is only visible on the cursor's line) but add an option to make it always visible
By @kragen - 4 months
maybe as a compromise the markdown metacharacters should be displayed in a lighter-weight font, a smaller font, or a reduced-contrast color? then you can see them, so it isn't a mystery how to type them, but the visual noise they add to the text you're editing is minimal
By @deafpolygon - 4 months
I prefer not to see the markdown, and only the styling. We used to have a smattering of RTF-styled notetakong apps until they all became markdown-backed ones. It’s telling that they’re hiding the Markdown. People don’t want to see it.
By @phone8675309 - 4 months
> Maybe I don’t know much about Markdown, but my understanding is that the whole point of it is to provide a syntax where the most common HTML tags for prose can be replaced by simple punctuation characters that are meant to be visible to the writer.

Cracking up at this quote