Posted by wrttnwrd
Content creation is hard enough without adding bad HTML into the mix. Echoing his recent talk at MozCon, we’re excited to welcome Ian Lurie from Portent, Inc. on this episode of Whiteboard Friday. Learn how to cut out the cruddy code produced from writing in word processors by adopting Markup and text editors as your go-to writing solution.
Hey, Moz fans. My name’s Ian Lurie. I am the CEO and founder of Portent Inc. I am also the Chief Content Badger there. I’m here today to talk to you about Markdown and how you can use Markdown to avoid all sorts of content and HTML tragedies.
So first thing you’ve got to understand: The one great tragedy of content creation is HTML. If you’re a writer or producer or someone like that and you’re creating content, you always run into the problem of trying to get that blog post live or trying to get that page live or whatever else, and you end up with one of four possibilities.
So the problem is: How do you create HTML as a writer, without having it interfere with your writing process, right? You don’t want to be typing stuff in and all of a sudden you have to stop to write in tags. Without slowing things down because you don’t want to have to go back and edit all the HTML either. How do you do that?
Well, yay for us, there’s this thing called Markdown, and Markdown was created by a developer who runs a blog called Daring Fireball, and I will link to the Markdown Syntax Guide on that site so you can very easily look at it and see it. It is designed to be a really simple way to write in plain text and, with a few simple characters, tag it so that it will turn into really clean, really good HTML.
So you’ve got all these big advantages. You’ve still got the problem of how are you going to turn it into what you want it to be?
How do you do it? Well, the first thing is you need certain tools to fit a process. Like almost any writing process, you write, you preview, and then you convert. If you do that in Microsoft Word, you use Microsoft Word to do your writing, you use Word to do your preview, and then you convert by either saving the file and giving it to someone else, or converting it to PDF or, and please don’t do this, converting it to HTML.
If you’re doing Markdown…
I should point out just five to seven days ago, I talked about using a tool called Sublime Text. Sublime Text is excellent for this. I hadn’t fully tested Atom.io yet. I have now, and I’m actually switching. I’ve been using Sublime Text for probably five years now. I’m very sorry Sublime folks, but I’m actually switching to Atom.io, because as a primarily Markdown writer and a very basic text writer, it’s very good for me.
So now it’s time to actually get to work, right? So you need to go and download Atom.io. Install it. It’s free, by the way. It costs nothing. Did I mention free? Like zero dollars.
Syntax is really simple. Again, I’m going to link to the syntax. I’m not going to give you the complete course on the syntax. The truth is this is 50% of what you’ll probably need right here.
But just as an example, if you want to do a level one heading, you do a single pound sign or a hash, a space, and then whatever your text is. When you convert it to HTML, it will automatically become H1, heading one, closing H1. Same thing with H2. You just do two hashes. You can imagine what you do for H3. It’s three hashes.
Paragraphs are created automatically. So if you write some text and you hit Enter or return twice, you’ll get a clean paragraph. If you want, by the way, for this to be a hard break instead, then you just do two spaces and then return, and it’ll put a BR there instead of a paragraph.
Lists become lists, and this is one of the toughest things for writers. It was always the thing that slows me down the most is lists are pretty complicated in HTML. Well, here, you just go one, two, three, just normally your text, and when you save it and convert it, it’s going to become order list, list item, list item, list item, closing order list. It’s that easy. If you want to do a bulleted list, you just use asterisks instead. It’ll do the same thing.
Links, I got really excited so I had to add this up here. Links are also really simple and in fact, again, super simplified in Markdown. What you’ve got here is you put your text in brackets, then in parentheses you put your web address. It will convert to a full link with the text as your proper link text. You can do the same thing with images. All you do is add an exclamation mark at the start.
So Markdown really lets you take your skills as a writer, focus on those skills, write really well, and convert it to equally good HTML. Then you’ve got HTML that’s ready to be pasted into WordPress or whatever other system you want, or just to be used as a separate page.
That’s it. I hope you have fun working with Markdown, and please leave any questions you have in the comments and I will get to them and answer them as quickly as I can. Thanks.
Sign up for The Moz Top 10, a semimonthly mailer updating you on the top ten hottest pieces of SEO news, tips, and rad links uncovered by the Moz team. Think of it as your exclusive digest of stuff you don’t have time to hunt down but want to read!
Reblogged 2 days ago from feedproxy.google.com