Create an infographic using illustration, web technologies, motion graphics, or other techniques that will illustrate the change in browser market share over time.
I decided to use modern browser technologies to show the path leading to said technologies. To illustrate the changes, I chose to use the browser logos, map the market share to the browser’s viewport, and scale the logos appropriately over time. Using their existing logos meant the data points were easily recognizable, and readily-available SVG icons meant they would scale infinitely without any loss of quality.
For additional context I added a short intro, as well as a few significant milestones (in my opinion) in the browser wars. I felt this would make the project more informative and useful. For clarity, I also thought it was important to make the tabular data driving the graph available through the legend.
Lastly, I explored some newer typographic CSS features to apply some of the techniques I had learned in college. For example, old style figures, proper dashes and drop caps.
Be sure to check out the live link – https://jessedyck.me/browserstats/.
I feel my choice to use the entire viewport as my canvas, and scaling each logo respectively of it’s market share, works as an effective visualization of the massive changes in the web.
This project let me push my abilities with SASS functions and mixins, and further explore what’s possible using only CSS animations.