Table of Contents: Creative Examples

Advertisement

Table of contents is often considered to be one of the most unspectacular design elements ever invented. Because of its simple, usual form, table of contents is often not given the attention it may deserve — after all, it is just a list of the parts of a book or document organized in the order in which the parts appear. But why not use exactly that and surprise the reader of a booklet, brochure, annual report or a book with some beautiful and original table of contents? In fact, many creative approaches are possible. And this post attempts to prove exactly that.

This post showcases creative and/or beautiful tables of contents. We have tried to include creative, visually appealing and interesting design solutions. Hopefully, everybody will find something interesting and unusual for herself or himself. Please take a look at the references section in the end of the article — there you may find further examples of interesting and unusual tables of contents.

You may want to take a look at our related posts

Please notice: some photos look not beautiful at all — here the idea matters more than the quality of the screenshot. The showcased tables of contents aren’t necessarily useful in practice as they may be hard to read; they should serve as the inspiration for your future works and show you that even in the design of table of contents some unusual approaches are possible.

Creative and beautiful examples

So how beautiful or creative can a table of contents be?

PRINT Magazine Spread: Table of contents3

Table of Contents Showcase4

Guide to grammatical errors5
“Interesting table-of-contents page in a 1940s grammar guide, found in a thrift store in Roswell.”

Table of Contents Showcase6

Table of contents7

Table of Contents Showcase8

Sonic Travel Guide9
Illustrated section heads and selected pages from the Sonic Travel Guide book. Content pages are absent as they contain internal information about the organization. Designed by Jenkin Hammond.

Table of Contents Showcase10

Be somebody11
Acknowledgements, front matter, and table of contents from Lester’s Be Somebody (2008, Effing Press).

Table of Contents Showcase12

Flavors13
“Flavors” Mason Williams. Doubleday &Company, 1970 (design: Mason Williams).

Table of Contents Showcase14

Table of contents: Содержание15

Table of Contents Showcase16

Peterson17
The inside cover of A Field Guide to the Birds (Peterson 1934).

Table of Contents Showcase18

Annual report19

Table of Contents Showcase20

indice de obras21

Table of Contents Showcase22

The Pocket Manual of Chinese Medicine23

Table of Contents Showcase24

Stage door25
All of the lettering except or Stage Door act one, is pen and ink.

Table of Contents Showcase26

Table of Contents27

Table of Contents Showcase28

Indice29

Table of Contents Showcase30

Annual report for SB bank31
Designed by Danil Kryvoruchko.

Booklets - Statistical data32

Table of progress33

Table of Contents Showcase34

Restart35
Universe/Rizzoli, 2001. Design: Christian Küsters.

Table of Contents Showcase36

“Sense, Memory” Table of Contents37
“Ink. I want to use symbols to describe each of the pages content. I think I did an adequate job. In order: Introduction, Sight, Sound, Touch, Taste, Smell. The epilogue was included after this was made, but I felt it could easily be a back cover.”

Table of Contents Showcase38

Designing Design by Kenya Hara39

Table of Contents Showcase40

Hyperborder: The Contemporary U.S. – Mexico Border and It’s Future by Fernando Romero41

Table of Contents Showcase42

Creative Time: The Book by Anne Pasternak and Lucy Lippard43

Table of Contents Showcase44

Examples with leaders

If the page numbers appear after the heading text, they might be preceded by characters called leaders, usually dots or periods, that run from the chapter or section titles on the opposite side of the page, or the page numbers might remain closer to the titles. In some cases, the page number appears before the text.

Book Paul Renner 194845
A classic.

Table of Contents Showcase46

Endsheet table of contents47
Handwriting in use. Why not?

Table of Contents Showcase48

La cuisine au fils des mois by, Suzanne LABOUREUR Table49

Table of Contents Showcase50

A List Apart 2007 Survey Results51
In April 2007, A List Apart and An Event Apart conducted a survey of people who make websites. The results represent the first data ever collected on the business of web design and development as practiced in the U.S. and worldwide.

Table of Contents Showcase52

A. W. von Schlegel53
A. W. von Schlegel: Indische Bibliothek. Bd. 1 (1823). Inhaltsverzeichnis.

Table of Contents Showcase54

The Living World55
My great-grandfather’s book, published circa 1890.

Table of Contents Showcase56

Atlas Table of Contents57
A Finnish atlas from 1958. “Isänmaan ja maailman kartasto” (Atlas of the Homeland and the World).

Table of Contents Showcase58

The Telephone Book59
“The Telephone Book: Technology, Schizophrenia, Electric Speech” Avital Ronell University of Nebraska Press, 1989 (design: Richard Eckersley).

Table of Contents Showcase60

The Next Page – Cover61

Table of Contents Showcase62

Buying In by Rob Walker63

Table of Contents Showcase64

Examples without leaders

The Mechanical Bride65
“The Mechanical Bride: Folklore of Industrial Man” Herbert Marshall McLuhan. The Vanguard Press, 1951 (design: Ernst Reichl).

Table of Contents Showcase66

Glauber_Johnson 199967
Ray Johnson: Correspondences, 1999. Barbara Glauber, Beverly Joel/Heavy Meta, designer.

Table of Contents Showcase68

El Indice69
Capitulos Half-Blood Prince

Table of Contents Showcase70

Peterson71
The table of contents is repeated at the top of every page.

Table of Contents Showcase72

Design Noir73
“Design Noir: The Secret Life of Electronic Objects” Anthony Dunne & Fiona Raby. August/Birkhauser, 2001 (Design: Alex Rich)

Table of Contents Showcase74

The Canadian Hockey Atlas75

Table of Contents Showcase76

ToC_Morphosys AR 200877

Table of Contents Showcase78

Complete book79
Each colored bar will repeat on the right hand page of the corresponding story.

Table of Contents Showcase80

Yeah, THAT Owen Wilson and THAT Wes Anderson81

Table of Contents Showcase82

Ideas matter

Macro- and Microaesthetics83
Niggli, 1998. Design: Willi Kunz.

Table of Contents Showcase84

Sewed table of contents85
What about sewing a table of content? This is exactly what Screaming Lulu did. Limited edition.

Table of Contents Showcase86

Brunetti’s Anthology Table of Contents87
This table of contents uses drawing and cartoons as metaphors for the chapters.

Table of Contents Showcase88

Last Click

Type Trumps89
“A set of Type Trumps, a play on the game Top Trumps, in which different typefaces are attributed numerical values. These figures are then used to enable the cards to be won or lost using some of the fried and tested ‘Top Trumps’ rules.

Table of Contents Showcase90

Shaz Madani’s poster91
No, it has nothing to do with tables of contents, but it somehow fits to the context. This is a response designed to promote the M25 motorway. On one side the poster gives exact directions that would have to be taken in order to travel from one side of London to the other illustrating the complexity and confusion involved in taking alternative routs through the centre of the city. The reverse side reads “wipe away the confusion take the M25″.

Table of Contents Showcase92

Table of Contents Showcase93

Sources and Resources

Footnotes

  1. 1 http://www.smashingmagazine.com/2008/06/16/beautiful-brochures-and-booklets/
  2. 2 http://www.smashingmagazine.com/2008/01/14/monday-inspiration-data-visualization-and-infographics/
  3. 3 http://saicze.deviantart.com/art/PRINT-Magazine-Spread-39456939
  4. 4 http://saicze.deviantart.com/art/PRINT-Magazine-Spread-39456939
  5. 5 http://flickr.com/photos/hypowren/412742697/
  6. 6 http://flickr.com/photos/hypowren/412742697/
  7. 7 http://flickr.com/photos/mogg/800312905/
  8. 8 http://flickr.com/photos/mogg/800312905/
  9. 9 http://www.behance.net/Gallery/Sonic-Travel-Guide/85407
  10. 10 http://www.behance.net/Gallery/Sonic-Travel-Guide/85407
  11. 11 http://flickr.com/photos/imnotjustpatrick/2400462770/
  12. 12 http://flickr.com/photos/imnotjustpatrick/2400462770/
  13. 13 http://flickr.com/photos/89973526@N00/2473872142/
  14. 14 http://flickr.com/photos/89973526@N00/2473872142/
  15. 15 http://flickr.com/photos/chatsky/315826714/
  16. 16 http://flickr.com/photos/chatsky/315826714/
  17. 17 http://www.flickr.com/photos/koreana/180788794/
  18. 18 http://www.flickr.com/photos/koreana/180788794/
  19. 19 http://flickr.com/photos/n1ke/2488476627/
  20. 20 http://flickr.com/photos/n1ke/2488476627/
  21. 21 http://flickr.com/photos/nonix/2096351408/
  22. 22 http://flickr.com/photos/nonix/2096351408/
  23. 23 http://www.swayspace.com/design/design-luckydog.html
  24. 24 http://www.swayspace.com/design/design-luckydog.html
  25. 25 http://flickr.com/photos/nicolani/2486712651/
  26. 26 http://flickr.com/photos/nicolani/2486712651/
  27. 27 http://flickr.com/photos/fullarton/63972793/
  28. 28 http://flickr.com/photos/fullarton/63972793/
  29. 29 http://flickr.com/photos/lunatical/2128328769/
  30. 30 http://flickr.com/photos/lunatical/2128328769/
  31. 31 http://www.behance.net/Gallery/Annual-report-for-SB-bank/42018
  32. 32 http://www.behance.net/Gallery/Annual-report-for-SB-bank/42018
  33. 33 http://flickr.com/photos/runcomrade/1927011285/
  34. 34 http://flickr.com/photos/runcomrade/1927011285/
  35. 35 http://flickr.com/photos/litherland/2502212939/in/pool-contents
  36. 36 http://flickr.com/photos/litherland/2502212939/in/pool-contents
  37. 37 http://flickr.com/photos/cupcakecore/2464957112/
  38. 38 http://flickr.com/photos/cupcakecore/2464957112/
  39. 39 http://flickr.com/photos/michaelsurtees/2483585259/in/pool-contents
  40. 40 http://flickr.com/photos/michaelsurtees/2483585259/in/pool-contents
  41. 41 http://flickr.com/photos/michaelsurtees/2483575837/in/pool-contents
  42. 42 http://flickr.com/photos/michaelsurtees/2483575837/in/pool-contents
  43. 43 http://flickr.com/photos/michaelsurtees/2478263410/in/pool-contents
  44. 44 http://flickr.com/photos/michaelsurtees/2478263410/in/pool-contents
  45. 45 http://flickr.com/photos/n1ke/2491841136/
  46. 46 http://flickr.com/photos/n1ke/2491841136/
  47. 47 http://flickr.com/photos/bookieabroad/2580146901/
  48. 48 http://flickr.com/photos/bookieabroad/2580146901/
  49. 49 http://flickr.com/photos/consus-france/2185380094/
  50. 50 http://flickr.com/photos/consus-france/2185380094/
  51. 51 http://www.alistapart.com/articles/2007surveyresults
  52. 52 http://www.alistapart.com/articles/2007surveyresults
  53. 53 http://flickr.com/photos/16641203@N08/2216845051/
  54. 54 http://flickr.com/photos/16641203@N08/2216845051/
  55. 55 http://flickr.com/photos/aperryz/2134241789/
  56. 56 http://flickr.com/photos/aperryz/2134241789/
  57. 57 http://www.flickr.com/photos/17343237@N00/207960523/
  58. 58 http://www.flickr.com/photos/17343237@N00/207960523/
  59. 59 http://flickr.com/photos/89973526@N00/2473875346/
  60. 60 http://flickr.com/photos/89973526@N00/2473875346/
  61. 61 http://flickr.com/photos/89973526@N00/2473266961/
  62. 62 http://flickr.com/photos/89973526@N00/2473266961/
  63. 63 http://flickr.com/photos/michaelsurtees/2507902199/in/pool-contents
  64. 64 http://flickr.com/photos/michaelsurtees/2507902199/in/pool-contents
  65. 65 http://flickr.com/photos/89973526@N00/2473872832/
  66. 66 http://flickr.com/photos/89973526@N00/2473872832/
  67. 67 http://flickr.com/photos/7571644@N08/2481455970/in/pool-contents
  68. 68 http://flickr.com/photos/7571644@N08/2481455970/in/pool-contents
  69. 69 http://flickr.com/photos/atalaya/29892745/
  70. 70 http://flickr.com/photos/atalaya/29892745/
  71. 71 http://rumors-online.com/project.php?id=31
  72. 72 http://rumors-online.com/project.php?id=31
  73. 73 http://flickr.com/photos/89973526@N00/2473053595/
  74. 74 http://flickr.com/photos/89973526@N00/2473053595/
  75. 75 http://flickr.com/photos/spiltsville/364281979/
  76. 76 http://flickr.com/photos/spiltsville/364281979/
  77. 77 http://flickr.com/photos/n1ke/2491841098/
  78. 78 http://flickr.com/photos/n1ke/2491841098/
  79. 79 http://flickr.com/photos/modestniche/2407992312/
  80. 80 http://flickr.com/photos/modestniche/2407992312/
  81. 81 http://flickr.com/photos/anole/197979354/
  82. 82 http://flickr.com/photos/anole/197979354/
  83. 83 http://flickr.com/photos/litherland/2506730303/in/pool-contents
  84. 84 http://flickr.com/photos/litherland/2506730303/in/pool-contents
  85. 85 http://flickr.com/photos/loobiloo/512740003/
  86. 86 http://flickr.com/photos/loobiloo/512740003/
  87. 87 http://flickr.com/photos/sokref1/379226998/
  88. 88 http://flickr.com/photos/sokref1/379226998/
  89. 89 http://face37.com/#/work/type-trumps/
  90. 90 http://face37.com/#/work/type-trumps/
  91. 91 http://smadani.com/M25%20page.htm
  92. 92 http://smadani.com/M25%20page.htm
  93. 93 http://smadani.com/M25%20page.htm
  94. 94 http://www.manuscripta-mediaevalia.de/hs/hs-online.htm
  95. 95 http://flickr.com/photos/89973526@N00/sets/72157604931851942/
  96. 96 http://flickr.com/groups/contents/pool/
  97. 97 http://flickr.com/photos/michaelsurtees/sets/72157604965679531/

↑ Back to top Tweet itShare on Facebook

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops, online workshops and loves solving complex performance problems in large companies. Get in touch.

Advertising
  1. 1

    The “Be Somebody” ToC doesn’t seem to say anything about the content at all. I don’t know anything about the book. On the left side the first pair of numbers indicate the indentation on that line and the second pair indicate the “section number” within that indentation level. The numbers on the right side are either page numbers or simply line numbers – it’s unclear which because the numbering starts with 9. So, at first glance, that is a really, really weird ToC – and seemingly completely useless. Looks kind of nice though :)

    0
  2. 52

    cooooooollllllll!!too bad there wasnt the one i wanted

    2
  3. 103

    kldkshfakjfhkjfhsdkjfhasejkfhdasjkfhasdkjfhaeskjfhasd

    this web sucks

    -3
  4. 154

    A good variety and collection of table of contents….good job..

    2
  5. 205
  6. 256

    I do not like any of these damn pictures..they all suck..dont bother

    -1
  7. 307

    i hate this web site it sucks balls
    fuck u all!!!

    0
  8. 358

    hello..i am carmen..

    -3
  9. 409

    Yo foos are gonna get busted

    -3
  10. 460

    haha oh man thats funny

    0
    • 511

      Yes! I’m working on that right now, altaucly. Cross your fingers, because I’m hoping for a December release date. Going the indie route, and getting my ducks in order. Stay tuned!

      0
  11. 562

    Yall don’t know who you messin with

    -1
  12. 613

    Hello my name is carmen..but i hate that name so please call me LIL ROCCO

    -3
  13. 664

    LilRocco I’ll kick yo ass

    1
  14. 715

    hahaha lil rocco thats hilarious

    -2
  15. 766

    ima sorry for the launguage
    kiefer!

    -2
  16. 817

    hahaha nattt!!!!! bring it big faget j u homo

    -3
  17. 868

    You know who you talkin to bitch

    0
  18. 919

    Hello recent posters your computers have been traced and you will be sent fines in your email that NEEDS to be paid or the police will get involved. thank you

    2
  19. 970

    Watch yo ass Albeneze, and this aint Justin

    -3
  20. 1021

    this is pure art! love it

    3
  21. 1072

    This is great! Thanks!

    1
  22. 1123

    Thank you. This was just what I needed to get quickly inspired in the remaining 14 minutes I have away from my children (whilst sitting at the local brooklyn coffee shoppe)

    0
  23. 1174

    this is great. thankssss
    boyacı

    0
  24. 1225

    Thank you for this! It was exactly what I needed!

    3
  25. 1276

    hearthom tampac

    March 10, 2010 6:48 pm

    buang ang naggawa nito no?

    3
  26. 1327

    laurenevansroberts

    April 3, 2010 8:51 pm

    love the ideass so creative! ill get to do the calendar like one :)

    2
  27. 1378

    Fantastic selection of examples

    1
  28. 1429

    Thank u very much, u helped me throgh what i wanted

    2
  29. 1480

    hahahaha…nice…..

    0
  30. 1531

    Very helpful indeed, a great bit of inspiration, and very timely

    0
  31. 1582

    Awesome work, love it :)

    0
  32. 1633

    thanx verry good job.u helped me to findding me the best table of content.

    0
  33. 1684

    Meilany Lahengko

    March 17, 2014 5:21 am

    very helpful, thank you

    0

↑ Back to top