Using Firebug with Fonts.com Web Fonts
In a recent blog post I mentioned a handy Firefox® plug-in, the Firebug® Web development tool. It's a well-known utility for examining Web pages without have to "view source" for the whole page. In case you are new to Web development, here's a brief introduction for you.
OK, navigate to http://getfirebug.com and click on Install Firebug. Before you click, you might want to watch the "Introduction to Firebug" video. You'll find that Firebug does way more than allowing you to inspect the page's CSS and HTML.
Once you've got Firebug installed, launch Firefox and navigate to the Web page you want to explore. You can launch Firebug by clicking on the little bug icon at the bottom right or you can hit F12. The controls on the upper right side of the Firebug window allow you to minimize it, view it in its own window vs. attached to the browser window, and exit. On the top left is the Bug Icon Menu which provides access to many Firebug options and features. The Inspect Button is next to the Bug Icon, and it brings up the Inspector. When you click on it and select a field, you'll see something like this:
Not only can you inspect the CSS but you can also see what the computed values are for the selectors – in this case h2's font-family is 'Farfel W01 Felt Tip'. Cruise around your page and you'll be comfortable using the Inspector in no time. BTW, you can also simply right-click a selection and 'Inspect Element' is one of the menu items. It will bring up the Inspector without having to launch Firebug first.
- ·Amazon Releases Ember Bold Font for the Kindle
- ·Japanese Typography Writing System
- ·"Die Alpen – Vielfalt in Europa" stamp
- ·Iconic Transport for London logo undergoes subtle redesign
- ·The Future of Sex poster
- ·Food Not Bombs hypothetical redesign
- ·Jim Nutt: Coming Into Character at Museum of Contemporary Art Chicago
- ·MC5 – Back in the USA album cover
- ·London Underground's iconic Johnston Sans typeface
- ·Why Apple Abandoned the World's Most Beloved Typeface?