F07: Common List Selectors

Overview

IGP:FoundationXHTML (FX) uses the term named lists to signify any list content that is characterized by a defined semantic name and has symmetrical internal patterns on the list items.

Named lists can be reference lists such as a chronology or glossary, or processor generated lists such as table of contents, list of equations and similar.

Reference lists items are tagged as paragraphs and in some cases optionally as HTML definition lists. Processor generated lists contain HTML ordered lists. Eg: <ol></li>. In both cases the lists are created and maintained in the presentation or document sequence.

Some named lists have corresponding named sections which isolate the list items to those sections. Typically Table of Contents, End Notes and Index falls into this pattern. This means the sections can be used as a processing target. In some situations a number of different named lists may need to be used on a section page that is not a parent container. In this event FX provides a set of selectors called list isolation containers. These exist to provide an alternative processing target to a section list container.

Named List Selector Expression

Named lists have a reverse naming strategy to avoid confusion between isolation containers and named lists.

Named list sections follow the standard semantic section naming in camel case. Eg. frontmatter-rw TableOfContents-rw, backmatter-rw References-rw.

List isolation containers use the list name first followed by the plural suffix -lists-rw. Eg: index-lists-rw.

Named lists, the actual processing target, use the prefix list-followed by the list name and -rw. Eg: list-index-rw.

The full list of named list sections (F0), isolation containers and target lists (F6) are described in their relevant selector pages in this document.

Using Named List Sections

If you are going to use named-lists in their own sections, you do not need to use isolation containers. You must use the correct type of named list exclusively inside a named-list section.

<div class="frontmatter-rw ListOfFigures-rw">
    <div class="title-block-rw">
        <h1>List of Figures</h1>
    </div>
    <div class="list-figures-rw">
        <ol>
           <li><span class="num-figure-rw">1.1 </span>Figure 1.1. caption</li>
           <li><span class="num-figure-rw">1.2 </span>Figure 1.2. caption</li>
           <li><span class="num-figure-rw">3.1 </span>Figure 3.1. caption</li>
        </ol>
    </div>
</div>

A reason you may use isolation containers in a named-list section is because there may be commentary on the lists and lists may have alphabetic headings (glossary) or may be organized by section (notes).

Isolation container can be used in Sections if there is an extraction requirement for a complete list with supporting content such as alphabet headers or other commentary.

Using Named List Isolation Containers

In this example three named lists are placed on the same frontmatter section. Two are reference named lists and the last one maps is a generated list.

<div class="frontmatter-rw General-rw">
    <div class="title-block-rw">
        <h1>Other Contents</h1>
    </div>
    <div class="abbreviation-lists-rw">
       <h2>Abbreviations Used In This Book</h2>
       <div class="list-abbreviations-rw">
           <p><span class="term">DP </span>IGP:Digital Publisher</p>
           <p><span class="term">FX </span>IGP:FoundationXHTML</p>
           <p><span class="term">IGP </span>Infogrid Pacific</p>
       </div>
    </div>
    <div class="glossary-lists-rw">
       <h2>Glossary</h2>
       <div class="list-glossary-rw">
           <p><span class="term">DP </span>IGP:Digital Publisher</p>
           <p><span class="term">FX </span>IGP:FoundationXHTML</p>
           <p><span class="term">IGP </span>Infogrid Pacific</p>
       </div>
    </div>
    <div class="map-lists-rw">
       <h2>Maps</h2>
       <div class="list-maps-rw">
         <ol>
           <li><span class="num-map-rw">1</span>Map of the World</li>
           <li><span class="num-map-rw">2</span>Map of the Solar System</li>
           <li><span class="num-map-rw">3</span>Map of the Universe</li>
         </ol>
       </div>
    </div>
</div>

Generated named lists commonly have a separate frontmatter or backmatter section. But this is not mandatory in FX. Notes and References in particular can be found associated with any section type including parts, chapters, and appendices. They are usually located at the end of the section.

Generated Lists

Table of Contents

Tables of Content in FX are a single styled ordered list. This approach was taken because they are generated components and generally have similar styling. list-toc-rw is the only place in FX where list items get class statements. This shows alternative title text. If alternative titles are present they will be used in running header, and TOC generation.

<div class="body-rw Chapter-rw">
    <div class="title-block-rw">
        <p class="title-num-rw">Chapter One</p>
        <h1>Chapter Title</h1>
        <p class="title-sub-rw">Sub-title</p>
        <p class="title-author-rw">Author Name</p>
        <p class="title-contributor-rw">Contributor Name</p>
        <p class="title-other-rw">Other text not a block</p>
        <p class="alt-title-num-rw">1.</p>
        <p class="alt-title-rw">Alternative Chapter Title</h1>
        <p class="alt-title-sub-rw">Alternative Sub-title</p>
        <p class="alt-title-author-rw">Alternative Author Name</p>
        <p class="alt-title-contributor-rw">Alternative Contributor Name</p>
        <p class="alt-title-other-rw">Alternative Other text not a block</p>
    </div>
</div>

Generated tables of content use the selectors and elements in standard title blocks. In FX the first child title-block-rw after an opening section element is the processor target.

<div class="frontmatter-rw TableOfContents-rw">
    <div class="title-block-rw">
        <h1>Contents</h1>
    </div>
    <div class="list-toc-rw">
        <ol>
           <li class="toc-frontmatter-rw">Foreword</li>
           <li class="toc-frontmatter-rw">Introduction</li>
           <li class="toc-part-rw"><span class="toc-title-num-rw">Part 1</span>Part title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">1</span>Chapter title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">2</span>Chapter title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">3</span>Chapter title</li>
           <li class="toc-part-rw"><span class="toc-title-num-rw">Part 2</span>Part title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">4</span>Chapter title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">5</span>Chapter title</li>
           <li class="toc-chapter-rw"><span class="toc-title-num-rw">6</span>Chapter title</li>
           <li class="toc-backmatter-rw">Notes</li>
           <li class="toc-backmatter-rw">References</li>
           <li class="toc-backmatter-rw">Index</li>
        </ol>
    </div>
</div>

Each TOC list item can contain any combination of the content processed from title-block-rw selectors and elements. This next pattern shows how it is constructed. Line-breaks are for clarity. Only one list item is shown. : 

<div class="frontmatter-rw TableOfContents-rw">
    <div class="title-block-rw">
        <h1>Contents</h1>
    </div>
    <div class="list-toc-rw">
        <ol>
           <li class="toc-chapter-rw">
             <a href="chapter1.xhtml">
                <span class="toc-title-num-rw">1</span>
                Chapter title
                <span class="toc-title-sub-rw">Sub title</span>
                <span class="toc-title-author-rw">Author name</span>
                <span class="toc-title-contributor-rw">Contributor name</span>
                <span class="toc-title-other-rw">Other text</span>
             </a>
           </li>
        </ol>
    </div>
</div>

For presentation purposes these spans can be changed to blocks and fall naturally beneath each other.

In all cases the link is processed around all items within an TOC <li> item as shown and linked to the section page.

Heading in TOC

Some books require section headings to be present in the TOC. This example shows a simple extension for a single Chapter.

<div class="frontmatter-rw TableOfContents-rw">
    <div class="title-block-rw">
        <h1>Contents</h1>
    </div>
    <div class="list-toc-rw">
        <ol>
           <li> ....
           <li class="toc-chapter-rw">Chapter title</li>
           <li class="toc-heading2-rw">Heading 2 text</li>
           <li class="toc-heading3-rw">Heading 3 text</li>
           <li class="toc-heading4-rw">Heading 4 text</li>
           <li class="toc-heading5-rw">Heading 5 text</li>
           <li class="toc-heading6-rw">Heading 6 text</li>   
           <li> ....      
        </ol>
    </div>
</div>

 If a toc-heading?-rw has numbers these are tagged as toc-ref-heading-rw. These do not have any semantic or processing value and are provided for styling.

<li><a href="chapter1.html#h11"><span class="toc-num-heading-rw">1.1</span>Heading Text</a></li>

List of Figures (LOF)

List of figures is generated by extracting the generated number and caption from each figure block. The generated list is a simple ordered list with the figure number tagged in a span. The extracted caption is inserted into the itme.

<div class="frontmatter-rw ListOfFigures-rw">
    <div class="title-block-rw">
        <h1>List of Figures</h1>
    </div>
    <div class="list-figures-rw">
        <ol>
           <li><span class="ref-figure-rw">1.1</span>Figure caption</li>
           <li><span class="ref-figure-rw">1.2</span>Figure caption</li>
           <li><span class="ref-figure-rw">3.1</span>Figure caption</li>
           <li><span class="ref-figure-rw">3.2</span>Figure caption</li>
           <li><span class="ref-figure-rw">3.3</span>Figure caption</li>
        </ol>
    </div>
</div>

 When this is processed for interactive content the link from the LOF to is processed to its block ID automatically. Links should always be made to the parent figure block and not the caption to ensure they are presented complete. The full LOF term is linked. Numbers and caption are not linked separately.

<li><a href="chapter1.html#figure1"><span class="ref-figure-rw">1.1</span>Figure caption</a></li>

List of Maps

Index

Indexes are tagged as a nested (if required) ordered list. This can be segmented alphabetically. This example shows items with two levels of nesting.

    <div class="backmatter-rw Index-rw">
        <div class="title-block-rw">
            <h1>Index</h1>
        </div>
            <div class="list-index-rw">
               <ol>
                   <li>list term</li>
                   <li>list term
                       <li>list term
                           <li>list term</li>
                       </li>
                   </li>
              </ol>
            </div>
            <div class="list-index-rw">
                <ol>
                   <li>list term</li>
                   <li>list term
                       <li>list term
                           <li>list term</li>
                       </li>
                   </li>
              </ol>
           </div>
  </div>

Page numbering and linking

    
<li>list term <span class="ref-pnum-rw"></li>
<li>list term
<li>list term
<li>list term</li>
  </div>

Reference Lists

Chronology

Chronology can be tagged as a definition list or as simple paragraphs.

An HTML definition list should only be used if there is considerable complexity in a reference list.

Never tag chronology as a table, although the presentation is generally table-like. Use CSS block and display properties, or standard CSS layout techniques.

<div class="frontmatter-rw Introduction-rw">
    <div class="title-block-rw">
        <h1>Introduction</h1>
    </div>
    <p>... section text ...</p>
    <div class="chronology-lists-rw">
        <h2>Chronology</h2>
        <div class="list-chronology-rw">
            <p><span class="date-rw">1066</span> Big things happened</p>
            <p><span class="date-rw">1900</span> The century ended</p>
            <p><span class="date-rw">1951</span> The greatest thing happened.</p>
        </div>
    </div>
    <p>... section text ...</p>
</div>

Chronologies may be text referenced from the bodytext but are generally constructed in a manner that doesn't let them be used interactively (although they can be linked). 

Glossary

Glossary lists must be targets for processing and interactivity. Generally a glossary list is built, or added to during the authoring process. Glossary terms can be tagged in the body content and can be phrases.

The FX rule is the highlighted bodytext term reference must contain the exact letter sequence of the glossary term but does not have to case match. Eg: the reference item glossary term  will match the glossary list titled item Glossary Term by the processor rules.

Generally bodytext cannot be auto glossary tagged with a processor (at least in English) because of the synonyms and other gramatical constructions. Also it is often a good practice to only tag the first occurence of a glossary term in either a section, or a full book. However there are times when comprehensive tagging is valuable such as language learning. 

<div class="frontmatter-rw Introduction-rw">
    <div class="title-block-rw">
        <h1>Glossary</h1>
    </div>
    <p>... section text ...</p>
    <div class="glossary-lists-rw">
        <h2>Chronology</h2>
        <div class="list-glossary-rw">
            <p><span class="term-rw">Term</span> Definition</p>
            <p><span class="term-rw">Term</span> Definition</p>
            <p><span class="term-rw">Term</span> Definition</p>
        </div>
    </div>
</div>

In text tagging of glossary terms can be applied anywhere to text in headings, bodytext and common lists.  The ref-glossary-rw inline selector is used. It should NOT be used in conjuction with inline styles such as <i>, <b>, <em> and <strong>. The styling should be carried through the CSS selector only.

<h?>.... <span class="ref-glossary-rw">term</span> ....</h?>
<p>.... <span class="ref-glossary-rw">term</span> ....</p>
<li>.... <span class="ref-glossary-rw">term</span> ....</li>

A processor should be able to turn list-glossary-rw p items into HTML5 aside blocks with appropriate IDs for interactive processing.  The nature of a glossary is that each term is only used once within a document. The ID generated is ideally pattern based to make the reference and term ID relationship automatic.

References

Reference lists can be at the end of a section or assembled into one place at the end of a book. If at the end of a book they may be organized by section or as a single list. References are linking and interactive candidates.

Reference lists can be style tagged or semantically tagged. FX uses the same bibliographic elements as NLM which makes it easy to process from or too NLM if required.

<div class="frontmatter-rw ListOfFigures-rw">
    <div class="title-block-rw">
        <h1>List of Figures</h1>
    </div>
    <div class="reference-lists-rw">
        <div class="list-references-rw">
           <p>A-Author, date, <i>work</i>, edition, Publisher</p>
           <p>A-Author, date, <i>work</i>, edition, Publisher</p>
           <p>A-Author, date, <i>work</i>, edition, Publisher</p>
        </div>
        <div class="list-references-rw">
           <p>B-Author, date, <i>work</i>, edition, Publisher</p>
           <p>B-Author, date, <i>work</i>, edition, Publisher</p>
           <p>B-Author, date, <i>work</i>, edition, Publisher</p>
        </div>
    </div>
</div>

Reference lists can be a single list-reference-rw, but are preferrably alpha-segmented for better processing value, especially with large reference lists in academic works. This allows the remixing of sections to be carried out more easily.

Named Lists

FX Reference Named Lists include:

1. list-abbreviations-rw A list of abbreviations used in the work.
2. list-acknowledgements-rw General acknowledgements where there is a large list.
3. list-cast-rw  The cast and supporting staff in a dramatic work
4. list-characters-rw The characters in a dramatic work.
5. list-chronology-rw Chronology list date and statement.
6. list-glossary-rw  Glossary terms and definitions. Glossary term references can be tagged anywhere in the body for link processing.
7. .list-references-rw. Reference (bibliographic) terms and definitions.

FX Generated Named Lists include:

1. .list-equations-rw Frontmatter List of Equations (LOE). Equation lists can be processed automatically if there are num-equation-rw elements in equation blocks.
2. .list-figures-rw List of Figures | Illustrations | Plates (LOF). Figure lists can be processed automatically if there are num-figure-rw elements in figure blocks.
3. .list-tables-rw Frontmatter List of Tables (LOT). Table lists can be processed automatically if there are num-table-rw elements in table blocks.
4. .list-toc-rw Frontmatter Table of Contents list. TOC is generated from any combination of section title, subtitle, author, contributor and other text. In addition it can include section headings.
5. .list-maps-rw Frontmatter List of Maps (LOM)
6. .list-footnotes-rw Section end Footnote List. Used for footnotes when generated as an end of section reference in an e-content book only.
7. .list-illustrations-rw Frontmatter List of Illustrations (LOI) used in a book.
8. .list-index-rw Backmatter alphabetic index.
9. list-notes-rw  Backmatter Endnotes, or Section Endnotes.