Showing Typographic work

As explained in the colophon sev­er­al deci­sions have gone into the typog­ra­phy of this site. As some of it is fair­ly sub­tle, this arti­cle will show it off some more.

Headers

There are six full lev­els of head­ers avail­able, though nor­mal­ly only three lev­els are used. First three are cross-heads, which means that they’re cen­tered. The first two lev­els are dec­o­rat­ed with a sym­bol on either side, though the third lev­el isn’t.

The head­ers are all fol­low­ing the typo­graph­ic scale sug­gest­ed in [Type­plate], with the excep­tion of the sixth lev­el which is the same font-size as the para­graphs. They also all are small­caps.

The fourth and fifth lev­els are indent­ed side­heads, mean­ing they are left-aligned, with an indent equal to the para­graphs. To dis­tin­guish the fifth lev­el fur­ther it is ital­ic.

Final­ly the sixth lev­el is a run-in side­head which means that it is the same size as the para­graph, the same colour as the para­graph, but still keep­ing the small­caps to make it clear­ly dis­tin­guish­able from the para­graph.

Paragraphs

The first para­graph is dec­o­rat­ed with a sin­gle sym­bol before it, and there is no indent out­side of that. The one excep­tion is a para­graph fol­low­ing a run-in side­head head­er, as the effect of the run-in side­head would be spoiled.

Para­graphs fol­low­ing a para­graph, like this one, has an indent match­ing the indent­ed side­heads.

Demo: Header 2

This is a para­graph fol­low­ing a sec­ond-lev­el head­er, much like most of the para­graphs in this expla­na­tion, but made more explic­it.

Demo: Header 3

This is a para­graph fol­low­ing a third-lev­el head­er. The third lev­el head­ers are judi­cious­ly spread through­out the pages of the site, so it is also like­ly noticed.

Demo: Header 4

This is a para­graph fol­low­ing a fourth lev­el head­er. Notice how the dec­o­ra­tion and the head­er match each oth­er quite nice­ly.

Demo: Header 5

This is a para­graph fol­low­ing a fifth lev­el head­er. It is in much like the fourth lev­el head­er, but small­er and uses an attrac­tive ital­ic.

Demo: Header 6

This is a para­graph fol­low­ing a sixth lev­el head­er. This will very rarely be used, but it is declared to give more vari­ety, if it s need­ed. Note how there is no dec­o­ra­tion on this para­graph, and that the head­er appears to be part of it.

This is the sec­ond para­graph fol­low­ing a sixth lev­el head­er, notice the dif­fer­ent in text-indents com­pared to the oth­ers.