[rogue_ronin]

This is what I'm thinking...

It took a while, and I'm probably still missing things and making mistakes. I first over-used the "id" attribute. I think I pruned it pretty well, and only used classes where necessary, and at the highest levels I could.

Anything in ALL CAPS is a value determined by your naming convention or content needs. Hope you're not confused by the outline: I thought it best to name what I'm working on...

   1. Cover
	<div class="Spine" id="Cover">
		<a href="#START_OF_BOOK ID">
			<img src="images/cover.png" />
		</a>
	</div>

   2. Frontispiece
	<div class="Spine" id="Frontispiece">
		<h2>TITLE/SERIES NAME</h2>
		<ul>
			<li>SERIES LIST TITLES</li>
		</ul>
		<img src="images/frontispiece.png" />
	</div>

   3. Front Matter
	<div class="Spine" id="FrontMatter">
		<h2>FRONT MATTER HEADING</h2>
		<p>FRONT MATTER CONTENT (BLURBS, JUNK, ADS, WHATEVER)</p>
	</div>

   4. Title Page
	<div class="Spine" id="TitlePage">
		<h1>TITLE</h1>
		<p id="Subtitle">SUBTITLE</p>
		<p id="Author">AUTHOR</p>
		<p id="Illustrator">ILLUSTRATOR</p>
	</div>

   5. Verso
	<div class="Spine" id="Verso">
		<h2>VERSO HEADING</h2>
		<a href="sounds/logo.wav">
			<img src="images/logo.png">
		</a>
		<p id="PublisherBlurb">PUBLISHER BLURB</p>
		<p id="VersionNumber">VERSION NUMBER</p>
		<p id="RevisionDate">REVISION DATE</p>
		<p id="OriginalSource">ORIGINAL SOURCE</p>
		<p id="Scanner">SCANNER</p>
		<p id="Proofer">PROOFER(S)</p>
	</div>

   6. Inscription
	<div class="Spine" id="Inscription">
		<h2>INSCRIPTION HEADING</h2>
		<p>INSCRIPTION CONTENT</p>
	</div>

   7. Acknowledgment
	<div class="Spine" id="Acknowledgment">
		<h2>ACKNOWLEDGMENT HEADING</h2>
		<p>ACKNOWLEDGMENT CONTENT</p>
	</div>

   8. Preface
	<div class="Spine" id="Preface">
		<h2>PREFACE HEADING</h2>
		<p>PREFACE CONTENT</p>
	</div>

   9. Table of Illustrations
	<div class="Spine" id="TableOfIllustrations">
		<h2>TABLE OF ILLUSTRATIONS HEADING</h2>
		<ul>
			<li>
				<a href="#ILLUSTRATION ID">ILLUSTRATION NAME</a>
			</li>
		</ul>
	</div>

  10. Table of Maps
	<div class="Spine" id="TableOfMaps">
		<h2>TABLE OF MAPS HEADING</h2>
		<ul>
			<li>
				<a href="#MAP ID">MAP NAME</a>
			</li>
		</ul>
	</div>

  11.  Table of Tables
	<div class="Spine" id="TableOfTables">
		<h2>TABLE OF TABLES HEADING</h2>
		<ul>
			<li>
				<a href="#TABLE ID">TABLE NAME</a>
			</li>
		</ul>
	</div>

  12. Table of Contents
	<div class="Spine" id="TableOfContents">
		<h2>TABLE OF CONTENTS HEADING</h2>
		<ul>
			<li>
				<a href="#CONTENT ID">CONTENT NAME</a>
			</li>
		</ul>
	</div>

  13. Introduction
	<div class="Spine" id="Introduction">
		<h2>INTRODUCTION HEADING</h2>
		<p>INTRODUCTION CONTENT</p>
	</div>


  14. Parts
	<div class="Spine" id="PART ID">
		<h2>PART HEADING</h2>
		<p>PART BLURB<p>
	</div>

    A. Prologue
		<div class="Body" id="Prologue">
			<h3>PROLOGUE HEADING</h3>
			<ul class="NavLinks"
				<li>
					<a href="#PREVIOUS CHAPTER ID">
						<img src="images/up.png" />
					</a>
				</li>
				<li>
					<a href="#TableOfContents">
						<img src="images/toc.png" />
					</a>
				</li>
				<li>
					<a href="#NEXT CHAPTER ID">
						<img src="images/down.png" />
					</a>
				</li>
			</ul>
			<h4>SECTION HEADING</h4>
			<h5>SUBSECTION HEADING</h5>
			<p class="Epigram">EPIGRAM</p>
			<p class="PullQuote">PULL QUOTE</p>
			<p>APPENDIX CONTENT</p>
			<p class="SceneBreak">&nbsp;</p>
			<img id="MAP ID" class="Map" src="images/MAPNAME.EXT" />
			<img id="ILLUSTRATION ID" class="Illustration" src="images/ILLUSTRATIONNAME.EXT" />
			<table id="TABLE ID">TABLE CONTENTS</table>
			<a id="LINK-TO-ENDNOTE ID" class="EndNoteLink" href="END NOTE ID">LINK-TO-ENDNOTE NAME</a>
		</div>

    B. Chapters
		<div class="Body" id="CHAPTER ID">
			<h3>CHAPTER HEADING</h3>
			<ul class="NavLinks"
				<li>
					<a href="#PREVIOUS CHAPTER ID">
						<img src="images/up.png" />
					</a>
				</li>
				<li>
					<a href="#TableOfContents">
						<img src="images/toc.png" />
					</a>
				</li>
				<li>
					<a href="#NEXT CHAPTER ID">
						<img src="images/down.png" />
					</a>
				</li>
			</ul>
			<h4>SECTION HEADING</h4>
			<h5>SUBSECTION HEADING</h5>
			<p class="Epigram">EPIGRAM</p>
			<p class="PullQuote">PULL QUOTE</p>
			<p>APPENDIX CONTENT</p>
			<p class="SceneBreak">&nbsp;</p>
			<img id="MAP ID" class="Map" src="images/MAPNAME.EXT" />
			<img id="ILLUSTRATION ID" class="Illustration" src="images/ILLUSTRATIONNAME.EXT" />
			<table id="TABLE ID">TABLE CONTENTS</table>
			<a id="LINK-TO-ENDNOTE ID" class="EndNoteLink" href="END NOTE ID">LINK-TO-ENDNOTE NAME</a>
		</div>

    C. Epilogue
		<div class="Body" id="Epilogue">
			<h3>EPILOGUE HEADING</h3>
			<ul class="NavLinks"
				<li>
					<a href="#PREVIOUS CHAPTER ID">
						<img src="images/up.png" />
					</a>
				</li>
				<li>
					<a href="#TableOfContents">
						<img src="images/toc.png" />
					</a>
				</li>
				<li>
					<a href="#NEXT CHAPTER ID">
						<img src="images/down.png" />
					</a>
				</li>
			</ul>
			<h4>SECTION HEADING</h4>
			<h5>SUBSECTION HEADING</h5>
			<p class="Epigram">EPIGRAM</p>
			<p class="PullQuote">PULL QUOTE</p>
			<p>APPENDIX CONTENT</p>
			<p class="SceneBreak">&nbsp;</p>
			<img id="MAP ID" class="Map" src="images/MAPNAME.EXT" />
			<img id="ILLUSTRATION ID" class="Illustration" src="images/ILLUSTRATIONNAME.EXT" />
			<table id="TABLE ID">TABLE CONTENTS</table>
			<a id="LINK-TO-ENDNOTE ID" class="EndNoteLink" href="END NOTE ID">LINK-TO-ENDNOTE NAME</a>
		</div>

    D. Appendices
		<div class="Body" id="APPENDIX ID">
			<h3>APPENDIX HEADING</h3>
			<ul class="NavLinks"
				<li>
					<a href="#PREVIOUS CHAPTER ID">
						<img src="images/up.png" />
					</a>
				</li>
				<li>
					<a href="#TableOfContents">
						<img src="images/toc.png" />
					</a>
				</li>
				<li>
					<a href="#NEXT CHAPTER ID">
						<img src="images/down.png" />
					</a>
				</li>
			</ul>
			<h4>SECTION HEADING</h4>
			<h5>SUBSECTION HEADING</h5>
			<p class="Epigram">EPIGRAM</p>
			<p class="PullQuote">PULL QUOTE</p>
			<p>APPENDIX CONTENT</p>
			<p class="SceneBreak">&nbsp;</p>
			<img id="MAP ID" class="Map" src="images/MAPNAME.EXT" />
			<img id="ILLUSTRATION ID" class="Illustration" src="images/ILLUSTRATIONNAME.EXT" />
			<table id="TABLE ID">TABLE CONTENTS</table>
			<a id="LINK-TO-ENDNOTE ID" class="EndNoteLink" href="END NOTE ID">LINK-TO-ENDNOTE NAME</a>
		</div>
   

  15. Afterword
	<div class="Spine" id="Afterword">
		<h2>AFTERWORD HEADING</h2>
		<p>AFTERWORD CONTENT<p>
	</div>

  16. About the Author Page
	<div class="Spine" id="AboutTheAuthor">
		<h2>ABOUT THE AUTHOR HEADING</h2>
		<p>ABOUT THE AUTHOR CONTENT<p>
		<img id="ILLUSTRATION ID" class="Illustration" src="images/author.png" />
	</div>

  17. Colophon
	<div class="Spine" id="Colophon">
		<h2>COLOPHON HEADING</h2>
		<p>COLOPHON CONTENT<p>
		<a href="Cover">
			<img src="images/colophon.png" />
		</a>
	</div>

  18. Endnotes
	<div class="Spine" id="Endnotes">
		<h2>ENDNOTES HEADING</h2>
		<p id="END NOTE ID">
			ENDNOTE CONTENT
			<a class="BackLink" href="LINK-TO-ENDNOTE ID">
				<img src="images/return.png" />
			</a>
		<p>
	</div>

  19. Glossary
	<div class="Spine" id="Glossary">
		<h2>GLOSSARY HEADING</h2>
		<p>GLOSSARY CONTENT<p>
	</div>

  20. Index
	<div class="Spine" id="Index">
		<h2>INDEX HEADING</h2>
		<p>INDEX CONTENT<p>
	</div>

  21. End Matter
	<div class="Spine" id="EndMatter">
		<h2>END MATTER HEADING</h2>
		<p>END MATTER CONTENT (BLURBS, JUNK, ADS, WHATEVER)<p>
	</div>

Nothing in this is required exactly. (For instance, I cannot think of an example of an Inscription header. So just don't use it.) And CONTENT can include anything, right? But if something needs to explicitly be moved, let me know.

I moved Appendices under Parts; I just thought that it made sense -- formatting in an Appendix would likely be similar to a Chapter, and they seem to me to be of equivalent "rank".

How'd I do?

m a r