Styling

Headings

The p tag is automatically added and a new paragraph is created every time you hit Enter in the editor. Nobody likes to read large blocks of text, so it’s good practice to split your content into easy to read sections.

You can then use the h1 to h6 tags to create headings for these sections. Every heading is styled by the theme, but Heading 2 and Heading 3 are probably the ones you’ll be using most.

Why Use Headings?

Think of headings as subtitles for your article. Not only do they create a good user experience from a visual stand point, but they also help you be more coherent in your writing. I see a lot of articles where subtitles are shown in bold. Making a text bold is a good way to emphasize part of a paragraph, but don’t use bold for headings!

Notice how I properly used both a heading and bold text to make my point? 😉


Quotes

The q tag is used for short quotations inline within a paragraph. Here is an example of nested quotations:

He said, My favorite Steve Jobs quote is Your time is limited, so don’t waste it living someone else’s life.

You can highlight a quote even better by using the blockquote tag to create a blockquote:

Don’t be trapped by dogma — which is living with the results of other people’s thinking. Don’t let the noise of others’ opinions drown out your own inner voice. And most important, have the courage to follow your heart and intuition. They somehow already know what you truly want to become.Steve Jobs


Lists

There are several ways for specifying lists of information. All lists must contain one or more list elements. Lists may contain unordered information, ordered information or definitions. Lists can also be nested (lists inside lists).

Here’s an example that uses lists to explain lists. It’s kind of meta, I know! 😉

Unordered lists
created using the ul and li tags, they consist of information where order is not important.
  • This is an unordered list.
  • It has three items.
  • The list items are usually marked with bullets.
Ordered lists
created using the ol and li tags, they consist of information where order should be emphasized.
  1. This is an ordered list.
  2. Below is an unordered list, nested within the second element of the ordered list.
    • It has two items.
    • The second doesn’t say much.
  3. The list items are usually marked with numbers or letters.
Definition lists
created using the dl, dt and dd tags, they consist of a series of term / definition pairs, useful when explaining certain terms.