A browser (Firebug for Firefox, currently) extension that counts all the fonts on a page and orders them by color and size before happily outputting some json. It currently outputs the following type information:
- count
- font-family
- font-size
- font-weight
- font-variant
- font-style
- color
- text-transform
- text-decoration
- text-shadow
- letter-spacing
- word-spacing
- sample-text
Type-o-matic is an extension for Firebug. To install it, you'll need to install Firebug first.
- Add Firebug to Firefox
- Download the Typo-o-matic Extension
- Go to Tools > Add-ons in the menu bar
- Click on the cog icon and Install Add-on from file
- Navigate to the Type-o-matic extension folder you downloaded and select the file inside it ending in .xpi
- Visit the site you’d like to test
- Right click on anything in the page and choose Inspect element with Firebug
- Now click on the Typography tab
- Click Generate Report
You'll see a list of different font properties and how many times they were used on the pages you've analyzed.
- Choose which pages to analyze (we’ve found that ten is a good number to get the big picture, but you can analyze as many as you’d like — it will even work on just one page!)
- Click Persist
- Now navigate to other pages, and on each subsequent page, click Generate Report
You'll see the list of values and the count grow with each page. The table of results can be a bit difficult to interact with, so you can always click Copy to clipboard, and copy the results (JSON).
- port extension to Chrome