Quick Links
- Powerpoint Presentation(Be sure to view the notes under each slide)
Contact History Librarian
Introduction to Timeline JS
TimelineJS allows you to create a visually attractive timeline that may incorporate a variety of media. Created by the Knight Lab at Northwestern University, the tool is primarily intended for journalists but can be used in many disciplines and is particularly useful for digital humanities projects. (quoted from here)
Key Features
|
 |
In-Class Example
Let's develop a timeline showcasing the history of outer-space exploration. Use the examples below to start filling out a timeline. The last 3 examples listed are ideas for you to find the rest of the details for and then enter into the timeline.
|
Title: History of Space Exploration --Note: Make sure in the "Type" column, you select "title" so Timeline JS knows this entry is the title for the entire timeline. Date(s): (leave this blank since this is the title entry) Text: This is a quick demo showcasing the capabilities of TimelineJS. This is an example timeline that covers a few examples from the history of travel into outer space. Media: https://www.nasa.gov/sites/default/files/thumbnails/image/iss068e044225.jpg Media Credit: From NASA.gov Media Caption: Earth's horizon from space. |
|
Event: Sputnik Launched Date(s): October 4, 1957 - October, 26, 1957 Text: Sputnik, the first artificial satellite, was launched into space on October 4, 1957. It was built and launched by the Union of Soviet Socialist Republics (USSR). Sputnik weighed 185 pounds (84 kilograms). It sent a radio signal back to Earth for three weeks until its batteries ran out, and continued in orbit for three months until aerodynamic drag caused it to fall back into the atmosphere on January 4, 1958. The satellite's unanticipated success precipitated the American Sputnik crisis and triggered the Space Race, part of the Cold War. Media: https://www.nasa.gov/sites/default/files/thumbnails/image/sputnik_asm.jpg Media Credit: From NASA.gov Media Caption: Sputnik I |
|
Event: First Human Enters Space Date(s): April 12, 1961 Text: Yuri Gagarin from the Soviet Union was the first human in space. His vehicle, Vostok 1 circled Earth at a speed of 27,400 kilometers per hour with the flight lasting 108 minutes. Vostok's reentry was controlled by a computer. Unlike the early U.S. human spaceflight programs, Gagarin did not land inside of capsule. Instead, he ejected from the spacecraft and landed by parachute. Media: https://www.nasa.gov/sites/default/files/1961_april_yuri_gagarin.jpg Media Credit: From NASA.gov Media Caption: Yuri Gagarin preparing for his launch into space. |
|
Event: Mariner 5 Launched Dates: June 14, 1967 - |
|
Event: Apollo 4: Un-Crewed Test Flight is Launched Dates: November 9, 1967 - |
|
Event: Apollo 11: Man Lands on the Moon Dates: July 16, 1969 - July 24, 1969 |
- Link to Example Timeline
- Link to the Google Sheet (shared, public)
-
Go to this link to find content to add to the demo timeline: NASA History Image Gallery
Important Reminders / Common Mishaps
- Make sure the image/media URL is pointing to an actual image/video.
- Be sure to right-click on the image you find online and select "Open image in a new tab," and then copy the URL from that new tab. This URL should only contain the image/media.
- A good way to check if an image can be used, open a new browser tab and paste the image URL to verify it is indeed an actual image before pasting into the Google Sheet. It should end with the image extension (.jpg, .jpeg, .gif, .png)
- Do not modify the template headers in the spreadsheet.
- If timeline headers are modified in the spreadsheet, the template will be unusable. Even if the headers are restored, the template may not work and may generate an error in the timeline. The solution is to launch a new template from the Timeline JS site and copy/paste all of the records, without the header, into a fresh template.
- Careful using the Era feature.
- An Era is specifically a method to color-code a span of years on the timeline itself. It does nothing else.
- An Era should not used to add timeline elements. It should not to be used either as a single event in time nor as an event that covers multiple years.
