44
45
46
47
48
49
50
51
52
53
54
55
56
|
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
|
* A *plural noun* which applies to all its member articles as a group (e.g. “Speculations”)
* A *singular noun* with an indefinite article “a” or ”an”, which applies to each of its member articles individually (e.g. “a speculation”).
* A *document body* which appears on the series’s main page, and whose markup also dictates whether/how the listing of its member articles will be presented.
## Visual Design
The stuff described above gets translated into web and print designs.
## HTML markup
**“Listing” context: complete articles/notes:**
<!-- Article with a title -->
<article>
<h1 class="entry-title hentry">ARTICLE TITLE</h1>
<p class="time">
<a href="#here" class="rel-bookmark">
<time datetime="2017-11-08" class="published">November 8, 2017</time>
</a>
</p>
<section class="entry-content">ARTICLE BODY
</section>
<footer class="article-info">
<span class="x">(</span>
This is ARTICLE-NOUN, part of <a href="#">‘Series Name’</a>.
<span class="x">)</span>
</footer>
</article>
<!-- Article without a title -->
<article>
<h1 class="no-title hentry">
<a href="#here" class="rel-bookmark">
<time datetime="2017-11-08" class="entry-title published">November 8, 2017</time>
</a>
</h1>
<section class="entry-content">ARTICLE BODY
</section>
<footer class="article-info">
<span class="x">(</span>
This is ARTICLE-NOUN, part of <a href="#">‘Series Name’</a>.
<span class="x">)</span>
</footer>
</article>
<!-- Notes -->
<article class="with-title hentry">
<h1 class="entry-title">A note from AUTHOR, re: <a class="cross-reference" href="#">PARENT-TITLE</a></h1>
<p class="time"><a href="#here" class="rel-bookmark note-permlink">
<time datetime="2004-04-24">April 24, 2004</time>
</a></p>
<section class="entry-content">
NOTE CONTENTS
<p class="signoff"><i>— <a href="AUTHOR-URL">AUTHOR</a></i></p>
</section>
</article>
Coming at some point:
* Typographic conventions
* Web design notes (HTML markup structure, etc)
* Print design notes
|