For The Good Of The Web Developer

I’ll be honest, most of the posting I’ve done so far has been for my own good (cough cough RayBans). But this, this is different. Twice in the past two working days, coworkers have asked me a question, different questions both times, but the answer has been the same. I think. Maybe the first question was more that we were trying to solve something, but that one still had an answer, the same answer as the question today, and the answer is inside the Firefox Web Developer add-on.

The question today was “What was that tool you had, to find out what font this is?” . I forget what the first question was (sorry, Aimee), but what I do remember is what both were asking for …

… the Display Element Information feature of the add-on.

This one tool, shortcut’d by Ctrl-Shift-F, is one I find myself using all the time. If you have any interest in this whole thing called Web Development (and if you are reading this far in, chances are you do?), perhaps you have stumbled onto questions like this before:

What font is that? What are the dimensions on that image? What is the DOM path (whatever “html > body > div#rap > div#main > div#content > div#left > div#post-322.post > h2 > a” is called) that specify that object? How many pixels is this thing off from the left side of the page? From the top?

All those questions, and more, are answered in the one little Ctrl-Shift-F press. So if you are now even more lost than before, I’m sorry, i just ate some birthday cake (not mine, that was on Friday), so I’m a bit sugar sugar’d. But if you ever wonder what font something is (this is Arial), or any of those other questions, now you know? And Knowledge is Power? Knowing is half the battle? Don’t forget to bring a towel?

Join the discussion One Comment

  • Amanda says:

    Nice, I never knew about those shortcuts! In fact, I’m going to open Firefox right now and check them…

    Thanks for sharing!

Leave a Reply