There are many ways in which writing on the web is no different than writing for other mediums. Paragraphs and sentences and storytelling are, more or less, unchanged from paper to screen. A good story read on your phone is no less thrilling than when read on hardcover (assuming, of course, that a minimum attention to typography has been paid).
But there are some key differences, and even advantages, to writing on the web. Notably, web writing is readable by both people and machines. This makes it more portable and accessible: search engines can find it; readers can time-shift it, or translate it, or access it using assistive technology, such as a speaking browser. By definition, writing on the web can reach more and varied people than writing on other mediums.
Understanding how it does that means understanding the web’s lingua franca, HTML. In this post, and subsequent ones, we’ll talk a bit about certain HTML elements, and how you can make use of them in Editorially. To start off, let’s talk about headings.
Headings
HTML includes six levels of headings, each noted with an h
and a number, 1
through 6
:
<h1>First-level heading</h1>
<h2>Second-level heading</h2>
<h3>Third-level heading</h3>
<h4>Fourth-level heading</h4>
<h5>You know what this is, right?</h5>
<h6>Ok!</h6>
These levels should be used in order, meaning, you should not have an h4
in your document if you do not also have an h3
. You can, however, happily have many of each kind of heading, depending on the structure of your document. Together, the headings (along with some other elements) describe the document’s hierarchy. Search engines and assistive tools can use the outline that emerges from that hierarchy to help people find and access your writing.
Headings, like many elements in HTML, require both an opening and a closing tag. That’s fine for publication, but as a writing method it’s a lot to work with. Markdown lets you use one or more hashes instead:
# First-level heading
## Second-level heading
### Third-level heading
#### Fourth-level heading
##### You know what this is, right?
###### Ok!
In Editorially, we add some lightweight styles to display the headings in a way that’s easier to scan — hanging the hashes and setting the text in bold:
Editorially adds some visual styles to the Markdown syntax to make them easier to scan.
The point of Markdown isn’t to simplify the HTML — HTML is simple enough on its own — but to provide a writer-friendly way of working with it. It serves as a convenient shorthand, letting you write and edit quickly and efficiently, without obscuring what’s going on underneath. And rather than fussing with knobs and widgets or worrying about how something looks, it lets you focus on what matters most: the words.