Part 3 – Creating Headlines and Lists
HeadlinesIf you’ve been writing blog posts for a while, you’re probably familiar with the advantages of using headlines to break up text and help readers browse through longer articles to find the information they want.
HTML formatting helps this by allowing for six different levels of headlines, usually abbreviated H1 for the largest, top level headline (automatically catalogued by Google and other search engines), down to H6 for the smallest category.
This is the easiest thing to format in Markdown. Just precede the headline with a matching number of hash (or crosshatch, or pound) symbols:
# Gives you an H1, top level headline.
SEO tip: It’s best to only have one H1 headline per post to avoid confusing Google and other search engines. (You never want to confuse Google.) Most blog software will automatically assign a H1 heading if there’s a separate title box or window.
## Designates a H2 headline
### For an H3 level headline
#### for H4
##### for H5
###### for H6
Normally the #’s don’t show in the headline; I added them to show how they work. All the other headlines in this series were formatted the same way. Note that the actual display of the different headlines is often controlled not by the HTML code but by your blog’s Cascading Style Sheets (CSS), which is a whole ’nuther topic.
That’s all you really need to know to write headlines. Yes, if you really need a better sense of balance, you can repeat the hash tags at the end of the headline, but it’s not necessary.
Yes, also you can use equal signs underneath a headline as an alternate way to format a H1 headline:
This also gives you H1 headline formatting===================================
And “underlining” with a hyphen will, similarly, give you a H2 headline, like so:
This also gives you an H2 headline—————————
No, there’s no way to get H3 to H6 headlines with underlining. It’s more difficult to type using the equal signs and hyphens, but some writers might find it easier to read. I prefer the hash marks.
Markdown allows two types of standardized lists: ordered lists and unordered lists (also called bulleted lists).
Ordered lists are simple. Just start numbering. (Make certain you have a blank line before the list.) Simply type:
1. Heat oven to 450 degrees2. Put the ingredients into a casserole
3. Place the casserole in the oven
4. Burn until brown and crispy.
and you will get an nicely indented and numbered list:
- Heat oven to 450 degrees
- Put the ingredients into a casserole
- Place the casserole in the oven
- Burn until brown and crispy.
You don’t even have to number the list properly. Markdown and HTML both automatically start from one and renumber the list. So you could just as easily type:
1. Heat oven to 450 degrees1. Put the ingredients into a casserole 1. Place the casserole in the oven 4. Burn until brown and crispy.
or make up numbers:
4788. Heat oven to 450 degrees14. Put the ingredients into a casserole 42. Place the casserole in the oven 7. Burn until brown and crispy.
They all end up the same, steps 1-4 as in the first example. This is handy if you are rearranging the numbered list by cutting and pasting (perhaps to alphabetize). You don’t need to renumber the list.
(Even if you are a math major, though, I’d avoid typing negative or irrational numbers, though.)
In HTML, the same list will look like:
<ol> <li>Heat oven to 450 degrees</li> <li>Put the ingredients into a casserole </li> <li>Place the casserole in the oven </li> <li>Burn until brown and crispy.</li> </ol>
HTML doesn’t give a hoot about my numbering or the quality of my cooking.
The disadvantage of automatic numbering is that you always have to start from one. If you want to break the list and then continue, you will need to format it manually. (Some other non-basic forms of Markdown may allow you to number literally.)
One trick I’ve resorted to, when the list is broken with descriptions, is to use H4, H5, or H6 headlines and number each one manually instead of using an ordered list. This way you can comment on each number entry to your heart’s content.
If you need more flexibility in how your lists look, some blog themes and plugins offer added formatting and numbering features.
Unordered / Bulleted Lists
So you can type:
or, if you hate consistency:
You will always get
In HTML, it looks similar to an ordered list. You can see that the three symbols make no difference. (Use the one that feels best.)
<ul> <li>Beer</li> <li>Pizza</li> <li>Chips</li> <li>Football</li> </ul>
You can nest or indent your unordered lists, outline style, with groups of 4 spaces, too.
This allows you to get outline-like lists:
- Open the oven door
- Check for the smell of gas
- If gassy, call the fire department
- Check for the smell of gas
- Preheat oven to 450 degrees
- Warm ovens cook better
- Put stuff into casserole dish, etc.
I find that nesting an ordered list, or using a tab instead of 4 spaces, sometimes gives unpredictable results, depending on the Markdown editor you use. Go ahead and experiment.
We’ll have more on indentations, code blocks, and the like in Part 5.
For now, though, you probably should move on to our next tutorial, Part 4, for The Wonderful World of Web Links. The other parts of our series:
Markdown for Bloggers – Why Use Markdown? (part one)
Markdown for Bloggers – Basic Formatting (part two)
Markdown for Bloggers – Web Links (part four)
Markdown for Bloggers – Quoting Text and Code (part five)
The Monster List of Markdown Tools (part six)