◊(Local Yarn Code "Changes To Design and Layout")

Changes to "Design and Layout" between 2018-08-26 15:11:57 and 2018-09-16 17:42:46

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>&mdash; <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