Curious about how I made this? Check out timeline.js
One of the most interesting things about archives is the temporal nature of the collections. There’s a cardinality to the story that we tell with artifacts and resources in individual collections. The timeline project really brought home the process of putting items in context, to document the progression from an archivists’ perspective.
For this task, I pulled together some basic information about the history of fonts and their use in publications. Some of this information came from the History of Books course at San Jose State University. Other pieces of information came from my personal interest and web searches. This timeline shows the progression of fonts, and how quickly the field has really grown. If you look at the beginning of the timeline, there is limited information, and only a few fonts being created. Once you hit the 1700s (the transition period) and later, the number of fonts really increases. The stories of the creators begin to get more interesting, and the “plot thickens.” For example, until you start to dig a little, you would never know that Times New Roman was designed by a critic who complained about the font used in a Newspaper. Add to that the fact that the “Times Roman” font was basically created by licensing wars, and you have quite a story!
I found myself exploring various features of the timeline.js tool. I wanted to know how to change colors, adjust the order, and do things like change the colors on the year bar at the top of the page. I explored what “Groups” meant, and how to incorporate HTML into things like descriptions and titles. The tool is quite powerful – with just some basic configuration within a Google Sheet, I could develop a fully featured timeline!
It is always a challenge to boil down a significant collection of information into a relatively short timeline. That tends to be one of the most difficult tasks. I found myself discovering all kinds of information that I wanted to include. I did look for more of a mechanism to incorporate formal citations within the timeline. I instead utilized links out to source content where possible.
There were a variety of resources that I used for the project. The references listing below includes a full listing of the formal resources. In addition, I used a standard HTML code chart (https://html-color-codes.info/ to select the background colors for each of the entries in the timeline.
Overall, this was a very interesting assignment! I explored a variety of features of timeline.js, and can really see how this would be useful! I’m even thinking of ways I can use this in my professional work.
P. (n.d.). [Helvetica Font Poster]. Retrieved April 15, 2018, from https://pre00.deviantart.net/39ce/th/pre/f/2008/275/c/2/helvetica_font_poster_by_phillyfresh.jpg
A Brief History of Times New Roman. (n.d.). Retrieved April 15, 2018, from https://practicaltypography.com/times-new-roman.html
A Brief History of Type. (2015, June 13). Retrieved April 16, 2018, from https://ilovetypography.com/2008/05/30/a-brief-history-of-type-part-4/
Adobe Caslon™ Font Family Typeface Story. (n.d.). Retrieved April 16, 2018, from https://www.fonts.com/font/adobe/adobe-caslon/story
Boone, A. R. (n.d.). TYPE BY GOUDY – Popular Science (Apr, 1942). Retrieved April 16, 2018, from http://blog.modernmechanix.com/type-by-goudy/
Britannica, T. E. (2014, December 16). William Caslon. Retrieved April 16, 2018, from https://www.britannica.com/biography/William-Caslon
Creative, A. (2014, July 03). A Brief History of Typography. Retrieved April 16, 2018, from http://www.ashworthcreative.com/blog/2014/07/brief-typography-typefaces/
Crum, M. (2014, March 13). The Incredible Histories Of Your Favorite Fonts. Retrieved April 16, 2018, from https://www.huffingtonpost.com/2014/03/13/font-history_n_4942922.html
Crum, M. (2017, April 10). The Wild History Of One Of Our Most Popular Fonts. Retrieved April 16, 2018, from https://www.huffingtonpost.com/entry/baskerville-font-history_us_58e7fe09e4b058f0a02f4e30
Family Classifications of Type: Transitional. (n.d.). Retrieved April 16, 2018, from http://graphicdesign.spokanefalls.edu/tutorials/process/type_basics/transitional.htm
Google Fonts. (n.d.). Retrieved April 16, 2018, from https://fonts.google.com/
Harding, M. (2017, August 21). What Are Grotesque Fonts? History, Inspiration and Examples. Retrieved April 16, 2018, from https://creativemarket.com/blog/grotesque-fonts
Heidelbach, W. (2014, May 19). [Moveable Type]. Retrieved April 15, 2018, from https://upload.wikimedia.org/wikipedia/commons/thumb/a/ae/Metal_movable_type.jpg/800px-Metal_movable_type.jpg
Hustwit, G. (Director). (2007). Helvetica [Motion picture]. United States: NewVideo.
Helvetica (2007). (n.d.). Retrieved April 16, 2018, from http://www.imdb.com/title/tt0847817/
Hustwit, G. (n.d.). [The Helvetica Film Poster]. Retrieved April 15, 2018, from https://upload.wikimedia.org/wikipedia/en/d/d4/Helvetica-film.JPG
Italic vs. Cursive. (n.d.). Retrieved April 16, 2018, from http://www.typeworkshop.com/index.php?id1=type-basics&idpic=07
Italics. (n.d.). Retrieved April 16, 2018, from https://typedecon.com/blogs/type-glossary/italics/
Nealon, T. (2014, September 17). How a Frenchman Who Lived Nearly 600 Years Ago Created One of the World’s Great Typefaces. Retrieved April 16, 2018, from http://www.slate.com/blogs/browbeat/2014/09/17/jenson_s_roman_how_nicolas_jenson_created_a_perfect_typeface_600_years_ago.html
Olson, K. (2013, May 9). Typeface Comparison. Retrieved April 16, 2018, from https://www.behance.net/gallery/8607999/Typeface-Comparison
S. (2009). Periodic Table of Typefaces. Retrieved April 15, 2018, from http://www.squidspot.com/Periodic_Table_of_Typefaces.html
Prisco, J. (2017, August 15). The game-changing design made to go unnoticed. Retrieved April 16, 2018, from https://www.cnn.com/style/article/helvetica-60-years/index.html
Yau, C. (2009, June 17). Know your type: Futura. Retrieved April 16, 2018, from http://idsgn.org/posts/know-your-type-futura/
Yau, C. (2010, October 26). Know your type: Baskerville. Retrieved April 16, 2018, from http://idsgn.org/posts/know-your-type-baskerville/