Presidential Timeline

Web Design | Web Development | Research | Historical Data | Interactive

What I did

Conceptualized and designed a website showcasing all previous United States presidents with bulleted bio facts.


I wanted to design a timeline of all U.S. presidents as a historical standalone page for the Fox News website. I researched and compiled interesting statistics about the presidents such as their net worth, height, age at inauguration and their previous employment if applicable.

presidents info When you click on each president their information is revealed. These statistics include their political party, their home state and the population of the United States at the time of their presidency.

Design & Development

The presidents are displayed from left to right in chronological order. Each thumbnail is a composite of that president's presidential portrait and a captured event of note during their presidency. For example, President Nixon’s famous image from his 1968 campaign was the backdrop for his thumbnail.

The most interesting thing about this page visually is how presidential portraits changed over time starting as paintings, then to black and white photographs and eventually to the high resolution images. Only the last three presidents in our history have high resolution presidential portraits.

presidents The information of the presidents is displayed in a staticial manner.

I knew I wanted the page to consist of squares that sat edge to edge like a grid. I developed the prototype using PHP and CSS and added some JavaScript for the desired functionality. Once I had a working prototype, I presented the site to my superiors who agreed that it would be a fun addition to the editorial content on the site.

During a recent content migration the page was archived from the Fox News site. However, my prototype can be seen here.