Markdown & HTML - [EN/DE] a discussion

in #steem3 years ago

A topic that has been burning under my nails for quite some time is the use of Markdown and HTML. Before I give my opinion on this, I will elaborate on both markup languages.


Ein Thema, welches mir schon länger unter den Nägeln brennt ist die Verwendung von Markdown und HTML. Bevor ich meine Meinung darüber äußere werde ich aber etwas weiter ausholen und auf beide Auszeichnungssprachen eingehen.

Der deutsche Text ist unter dem englischen zu lesen.

that's me

Hypertext Markup Language

The short form HTML:

"HTML describes the structure of a web page semantically..." - Wikipedia

In other words: HTML describes the elements contained in a document.

The L stands for Language. HTML is therefore a language and, like any language, it has a grammar defined by committees. Over time the rules have changed but each version is extensively specified.

Markdown

Markdown is like HTML a markup language. It was developed to offer authors a simplified alternative to HTML. The conversion of Mardown into HTML was always intended. (Source)

"Markdown is a lightweight markup language [...] to create rich text using a plain text editor." - Wikipedia

Compared to HTML, Markdown fits much more comfortably into the writing flow due to its simplicity, since you don't have to put complicated constructs around your text passages. It is also easier for humans to perceive.

Markdown is a language as well, which is therefore subject to fixed rules. Especially when it can be assumed that it is used to generate HTML from it. Then all rules of HTML apply to their respective equivalents in Markdown.

the practice

This article is on the Steem Blockchain and I will only focus on this. So as the author of my own little Steem blog I write my contributions on steemit. The HTML editor there doesn't look like much and I use Markdown.

Of course, I would like my contributions to look the way I would like them to. Unfortunately Markdown is very restrictive, so I'll spice it up with some HTML. I can arrange different text parts with <div class="pull-left|center|right">, align them with <center> and add different other gimmicks.

the problem

As described above, Markdown and HTML are languages with grammar or specifications. Again:

"HTML describes the structure of a web page semantically..." - Wikipedia

It is not the purpose of Markdown or HTML to style your texts. A markup language is used for semantic structuring; a link must be marked as a link, a quotation as a quote, code as code.

Headings are a very special topic. These follow a clear hierarchical order:

  • Do not use lower levels to decrease heading font size: use the CSS font-size property instead.
  • Avoid skipping heading levels: always start from <h1>, next use <h2> and so on.
  • You should consider avoiding using <h1> more than once on a page.

- Mozilla

So semantic meaning applies for headings too. h1 says: This is the main heading of the entire page. h2 means nothing else than: This is a subsection of this heading etc.

understood, but what's the problem

First of all, you are acting against the specifications of the language.

But the post looks great on steemit anyway. I'm sure some of you would say that now. And exactly that is the wrong approach.

First of all, the design on steemit can change from one day to the next, then the headlines may look completely different again.

Especially with our steem Blockchain, it doesn't matter what content looks like on a single platform. There are so many different portals that display your content differently. A quotation can be used in very different ways. Each portal has its own design concept and tries to capture content structures in as pleasant or functional a way as possible.

It would also be possible, for example, for a platform to create a small table of contents from your headings. A feature that I eagerly wish for steemit by the way. If the selected headings are not used in the correct context, this may not work.

regarding mixing of Markdown and HTML

Markdown is very rudimentary and HTML much more powerful. One would like to use the possibilities and mix both. I wouldn't advise it, though.

The reason for the development of Markdown is the simplification of the language. Enriching them with HTML again makes the whole thing ad absurdum. If you want HTML you should also write entirely in HTML.

That there is a lot of crap happening on steemit does not abort this statement. I am talking about the Markdown editor, alowing more HTML than the HTML editor. Removing HTML elements is quite useful to increase the security of a page (more: XSS), but here it is silly. Find a page where this works properly if you want to work with HTML.

Questions such as: "Why is my article not displayed correctly in the discord" are usually based on a mixture of languages. Get out of his way and just don't do it.

my conclusion

I decided to get along with Markdown. It offers everything I need to structure my posts. Certainly everything is kept very simple, but simple doesn't always have to be bad. If it is semantically appropriate I also include an HTML command every now and then and since I am not completely free of errors I will certainly also do exactly that, which I have advised against here just in such big tones.

So far, see you on steem.


Hypertext Markup Language

Die Kurzform HTML bezeichnet...

"...eine textbasierte Auszeichnungssprache zur Strukturierung digitaler Dokumente wie Texte mit Hyperlinks, Bildern und anderen Inhalten." - Wikipedia

In anderen Worten: Mit HTML werden die Inhalte eines Dokumentes beschrieben.

Das L steht für Language. HTML ist also eine Sprache und wie jede Sprache hat sie eine Grammatik, die von Gremien festgelegt wurden. Über die Zeit haben sich die Regeln zwar geändert aber jede Version ist ausgiebig spezifiziert.

Markdown

Markdown ist wie HTML eine Auszeichnungssprache. Sie ist entwickelt worden um Autoren eine vereinfachte Alternative zu HTML zu bieten. Die Überführung von Mardown in HTML war dabei immer angedacht. (Quelle - EN)

"Ein Ziel von Markdown ist, dass schon die Ausgangsform ohne weitere Konvertierung leicht lesbar ist." - Wikipedia

Markdown fügt sich im Vergleich zu HTML durch seine Simplizität viel angenehmer in den Schreibfluss ein, da man keine umständlichen Konstrukte um seine Textpassagen setzen muss. Außerdem ist es für den Menschen einfacher zu erfassen.

Auch Markdown ist eine Sprache, die damit festen Regeln unterlegen ist. Erst recht, wenn davon auszugehen ist, dass sie verwendet wird um daraus HTML zu erzeugen. Dann gelten nämlich auch alle Regeln von HTML auf deren jeweiligen Äquivalente in Markdown.

die Praxis

Dieser Beitrag befindet sich auf der Steem Blockchain und ich werde mich thematisch auch nur darauf Beschränken. Als Autor meines eigenen kleinen Steem Blogs schreibe ich also meine Beiträge auf steemit. Der HTML-Editor da macht nicht viel her und ich benutze Markdown.

Ich möchte natürlich, dass meine Beiträge so aussehen, wie ich mir das vorstelle. Leider ist Markdown da sehr einschränkend, weshalb ich das ganze noch mit etwas HTML aufpeppe. Verschiedene Textteile kann ich mit <div class="pull-left|center|right"> anordnen, mit <center> ausrichten und verschiedene andere Spielereien veranstalten.

Auch Markdown-Auszeichnungen benutze ich so, dass alles nach meinen Wünschen aussieht.

das Problem daran

Wie oben bereits beschrieben handelt es sich bei Markdown und HTML um Sprachen mit einer Grammatik bzw. Spezifikationen. Weiterhin gilt:

HTML dient als Auszeichnungssprache dazu, einen Text semantisch zu strukturieren, nicht aber zu formatieren. Die visuelle Darstellung ist nicht Teil der HTML-Spezifikationen und wird durch den Webbrowser und Gestaltungsvorlagen wie CSS bestimmt. - Wikipedia

Es ist nicht Sinn und Zweck von Markdown oder HTML seine Texte zu gestelten. Eine Auszeichnungssprache dient zur semantischen Strukturierung; Ein Link ist als Link zu kennzeichnen, ein Zitat als Zitat, code als code.

Überschriften sind ein ganz eigenes Thema. Diese folgen einer klaren Hierarchischen Ordnung:

"Es sollte kein tieferes Überschriftenlevel verwendet werden, um die Schriftgröße zu vermindern. Stattdessen sollte die Größe über die CSS font-size Eigenschaft festgelegt werden.

Es sollte vermieden werden Überschriftenlevel zu überspringen. Es sollte immer von <h1> ausgegangen werden, danach <h2> und so weiter. Außerdem sollte versucht werden nur eine Überschrift des ersten Levels in einem Dokument zu benutzen." - Mozilla

Wieder gilt die semantische Bedeutung der Überschriften. h1 sagt aus: Das ist die Hauptüberschrift der gesamten Seite. h2 bedeutet nichts anderes als: Hier kommt ein Unterpunkt dieser Überschrift usw.

ja, aber was ist daran das Problem

Zuerst einmal handelt man gegen die festgelegten Spezifikationen der Sprache.

Aber der Beitrag sieht auf steemit ja trotzdem spitze aus. Würden jetzt einige sicher sagen. Und genau das ist der falsche Ansatz.

Erstmal kann sich das Design auf steemit von einem Tag auf den anderen ändern, dann sehen vielleicht die Überschriften wieder ganz anders aus.

Und gerade bei unserer steem Blockchain spielt es doch überhaupt keine Rolle wie ein Inhalt auf einer Einzelnen Plattform aussieht. Es gibt so viele unterschiedliche Portale, die eure Inhalte anders anzeigen. Ein Zitat kann ganz unterschiedlich zur Geltung gebracht werden. Jedes Portal hat sein eigenes Designkonzept und versucht uns inhaltliche Strukturen auf eine möglichst angenehme oder zweckmäßige Art und Weise zu erfassen.

Auch wäre es zum Beispiel möglich, dass eine Plattform aus euren Überschriften ein kleines Inhaltsverzeichnis erstellt. Ein Feature, dass ich mir für steemit im übrigen sehnlichst erwünsche. Wenn die gewählten Überschriften dann nicht im richtigen Kontext verwendet werden klappt das unter Umständen nicht.

achja, zum Thema mischen von Markdown und HTML

Da hätte ich es fast vergessen. Markdown ist wirklich sehr rudimentär und HTML deutlich mächtiger. Man möchte gerne die Möglichkeiten nutzen und beides durchmischen. Ich würde davon allerdings abraten.

Der Grund für die Entstehung von Markdown ist die Vereinfachung der Sprache. Diese wieder mit HTML zu bereichern führt das ganze ad absurdum. Wenn ihr HTML wollt solltet ihr auch gleich komplett in HTML schreiben.

Das meiner Meinung da auf steemit gerade ziemlicher Bockmist passiert tut dieser Aussage keinen Abbruch. Gemeint ist, dass der Editor dort im Markdown html zulässt, dass er im HTML-Editor verwirft. Das entfernen von HTML-Elementen ist durchaus sinnvoll um die Sicherheit einer Seite zu erhöhen (mehr: XSS), hier ist es aber albern. Sucht eine Seite, bei der das vernünftig funktioniert, wenn ihr mit HTML arbeiten wollt.

Fragen wie: "Warum wird mein Artikel nicht richtig im Discord angezeigt" gründen meistens auf einer Durchmischung der Sprachen. Geht dem aus dem Weg und macht es einfach nicht.

mein Fazit

Ich habe mir vorgenommen mit mit Markdown auszukommen. Es bietet alles, was ich benötige um meine Beiträge zu strukturieren. Sicherlich ist alles sehr einfach gehalten, aber einfach muss nicht immer schlecht sein. Wenn es semantisch angebracht ist streue ich auch mal einen HTML befehl mit ein und da ich nicht ganz frei von Fehlern bin werde ich sicherlich auch mal genau das machen, von dem ich hier gerade in so großen Tönen abgeraten habe.

Bis denn, see you on steem.

Sort:  

Eine klitzekleines Frage hätte ich jetzt aber noch: Weißt du wie man in der Markdown/HTML Mischung die Größe einer Überschrift ändert?
(<h1 [was kommt hier hin?]>Text< /h1 >)
Oder geht das vielleicht sogar in Markdown?

In reinem Markdown ist mir keine Möglichkeit bekannt.

Die korrekteste aller Antworten hat weder mit Markdown noch mit HTML zu tun. Denn der Grundsatz lautet: HTML ist für die semantische Strukturierung zuständig; Styling wird mit CSS gemacht.

<h2 style="font-size:18px;">Eine Überschrift<h2>

Eine weiterführende Anleitung gibt es hier.

Möglichkeiten in HTML sollten daher vermieden werden, Existieren aber:

<h2><font size="3">Eine Überschrift</font><h2>
<h2><small>Eine Überschrift</small><h2>
<h2><big>Eine Überschrift</big><h2>

Dabei handelt es sich mehr um Relikte aus web1.0 Zeiten.

Okay, vielen Dank, dann probier ich da mal ein bisschen rum :D