TIP: je teksten sneller online met Markdown

MarkdownVerreweg de meeste webteksten worden nog steeds geschreven in Word of een andere tekstverwerker. Dat levert echter bij het online zetten veel extra werk op. Direct in het CMS of in HTML werken heeft ook zo zijn problemen. Daarom werk ik tegenwoordig in Markdown, de perfecte tussenoplossing.

Als je ooit een tekst vanuit Word op een website hebt moeten zetten weet je wat een gedoe dat is. Alle returns veranderen ineens in een witregel en bij het copy-pasten komen allerlei opmaakcodes mee die je website behoorlijk in de war kunnen gooien. WordPress heeft wel een ‘plak vanuit Word’-functie, maar ook die werkt niet zonder problemen.

Direct in het CMS

Ideaal zou zijn om je tekst direct in het CMS te schrijven. Zo weet je tijdens het schrijven precies hoe het er straks online uit gaat zien en voeg je geen onnodige code toe die later problemen kan opleveren. Maar ook deze aanpak heeft nadelen: je hebt geen offline kopie van je tekst, je kunt alleen aan je tekst werken als je een internetverbinding hebt, je kunt je tekst niet naar je collega’s/opdrachtgever mailen en je kunt niet werken in je favoriete teksteditor. Zelfs in een gebruiksvriendelijk systeem als WordPress worden teksten dus meestal geplaatst door te copy-pasten.

Direct in HTML

Wie een beetje HTML kent, kan zijn teksten in een teksteditor als Notepad meteen voorzien van de juiste tags. Yeah, right. Allereerst kun je van de meeste schrijvers niet verwachten dat ze dit voor elkaar krijgen, ten tweede krijg je er volkomen onleesbare teksten van en ten derde is het, ook al ken je HTML goed, gewoon rotwerk.

Maar wat dan wel?

Samenvattend zou je kunnen zeggen dat je een manier van teksten schrijven nodig hebt die enerzijds leesbare teksten oplevert en anderzijds direct en op een voorspelbare manier omgezet kan worden naar HTML. Gelukkig waren er meer mensen die met dit vraagstuk zaten en bedachten de heren John Gruber en Aaron Swartz in 2004 Markdown.

Markdown: de oplossing

Markdown geeft je voor alle HTML-codes die je als tekstschrijver nodig hebt een makkelijke shortcut die de leesbaarheid van je tekst niet schaadt. Zo worden tussenkopjes voorafgegaan door een ‘#’ en geef je vette en schuine tekst aan door ze respectievelijk tussen dubbele of enkele ‘*’ te zetten. Wat ik zelf enorm handig vind is de mogelijkheid om links in te voegen met een referentie. Dat wil zeggen dat je niet de hele URL midden in je tekst hoeft te plakken. Zie de afbeelding hieronder voor hoe het werkt.

Markdown reference links

Typen in Markdown, plakken in HTML

Is je tekst klaar, dan geef je de editor opdracht om er HTML-code van te maken en plak je die code bijvoorbeeld in de ‘text’ tab van WordPress. Als het goed is ziet je webpagina of blogpost er dan meteen uit zoals het hoort. Geen witregels deleten, niet op jacht naar vreemde lettertypes. Heerlijk.

Foto’s invoegen

Het invoegen van foto’s kan uiteraard ook in Markdown. Ik vind het handiger om dat achteraf in WordPress te doen, omdat het invoegen vaak tegelijk met het uploaden gebeurt en je dus niet van tevoren de URL van je afbeelding weet.

Syntax

Markdown is makkelijk te leren. Al na een paar minuten heb je de belangrijkste codes onder de knie. Voor de rest plak ik hieronder een handige ‘cheat sheet’ voor de meest voorkomende Markdown-syntax, gevonden op ThemeSpectre:

ThemeSpectre_Markdown_CheatSheet

Markdown in de workflow

Markdown-documenten maken kan inmiddels in een enorme hoeveelheid editors. Zelf gebruik ik online StackEdit en op Linux ReText. Voor de WordPress backend zijn er ook plugins die Markdown ondersteunen, zodat je je Markdown-tekst niet eens eerst naar HTML hoeft te laten omzetten. Recentelijk werd ook de bekende JetPack-plugin uitgebreid met Markdown-ondersteuning. Je baas of opdrachtgever zal misschien nog wel even vreemd opkijken als je een Markdown-document opstuurt, dus misschien moet je je werk voor niet-ingewijden voorlopig eerst omzetten naar HTML.

Maandelijks de beste artikelen in je mailbox?