Professor X Extension for Firefox
Posted by Stuart Robertson | Web Design Software
My second Firefox extension is ready for download today! Professor X let’s you see inside a page’s head without viewing the sourcecode. This is the companion extension to X-Ray which reveals the underlying code within a page’s body, although either extension can be installed and used on its own.
Once installed the Professor X command is available by right-clicking as well as in the Tools menu. When applied to a page it will display the contents of the page’s head element, including Meta, Script and Style content. This can help you see how a website was constructed without having to go back and forth between the sourcecode and the page in your browser.
Professor X was created with a little bit of JavaScript, and a lot of CSS 3, to display and style elements in the head of the document. CSS 3 selectors and CSS generated content helped make this a more visually pleasing tool than I had originally planned (If people are interested I’ll post some more details about how the code works). Special thanks to Mark James for his outstanding Silk Icons!
Just like the X-Ray extension (which will be updated very soon), Professor X was developed to help my students learn how web pages are constructed. However, since developing the first test-version I’ve found it helped me quickly spot errors between the head tags on pages I’d looked at dozens of times before. I hope other web designers will find it a useful extension to add to their toolbox as well.
If you find either of these extensions useful, please consider making a small donation to support future development work. Thanks! 
Preview
You might also like
|
|
|
|
|
Stuart Robertson is a Freelance Web Designer and Consultant, the Web Manager for the University of Guelph, and Faculty in the Department of Media Studies at the University of Guelph-Humber.
August 9, 2006 at 6:08 pm
Look inside the head element with Professor X A Firefox extension that lets you see the contents of an HTML document’s head element without viewing source. Look inside the head element with Professor X [IMG permanent link] 03 aug at 15:15 by Roger
November 8, 2007 at 11:37 pm
– Iphone, Ruby on Rails development IDE , It is Eclipse plugin, CEO former JRun creator web development tools professor-x x-ray: view CSS, HTML source on same page: – both tools together are great if you have 2 screens side by side -http://www.designmeme.com/2006/06/19/professor-x-extension-for-firefox/Selenium is a test tool for web applications. Selenium tests run directly in a browser, just as real users do. And they run in Internet Explorer, Mozilla and Firefox on Windows, Linux, and Macintosh. No other test tool covers such a wide array of
June 19, 2006 at 10:54 am
Very nice extension, good job !
June 20, 2006 at 9:31 am
Thanks.
Professor X will now work with the Flock Browser as well.
June 21, 2006 at 12:01 am
[...] Ever wanted to look into the <head> section of a web page without having to constantly view the source? Well, good news folks – Stuart Robertson has released a new Firefox extension named Professor X because it gets into your head! [...]
June 21, 2006 at 8:13 am
[...] The new version of X-Ray adds support for displaying tags for table, tr, script and a few other elements! The update also improves compatibility with the new Professor X Extension—also available for both Firefox and Flock. [...]
July 30, 2006 at 8:26 am
On sites with a lot of meta tags and so forth, it fills more than one screen’s worth but there are no scrollbars… Might need a tweak there. Otherwise, very handy.
August 3, 2006 at 5:11 am
Good Job!
I love this Tool already, but there is one thing missing, it’s the http response code that would be nice to have in this extension.
August 3, 2006 at 12:17 pm
Look inside the head element with Professor X…
A Firefox extension that lets you see the contents of an HTML document’s head element without viewing source….
August 3, 2006 at 12:50 pm
I’d like to put in a second request for the http response header. I mean it’s available in the web dev toolbar, but the format you made here is so much nicer.
August 28, 2006 at 6:22 pm
Whould be nice if the .js Files are clickable…
Thats the main reason for me to stealth into other ppl header´s.
Thx for the next update
September 11, 2006 at 7:14 pm
[...] I’m gonna tell you what I really think I like about Mondays. I have one class. It’s at 1:30pm. And it’s Web Design. Oh man. We were talking about Technorati today. Technorati! There are only like 4 friends of mine who know what Technorati is, none of whom go to Gumber. The guy teaching the course, Stuart Robertson, is the U of G webmaster, writes Firefox extensions and has had an article posted to the front-page of Digg. Pretty cool. [...]
September 30, 2006 at 5:39 am
I´d like to have the opinion of another background-color or just have a lighter grey for the text to get a better contrast.
The rest is fine !
Yours Forchheim
October 31, 2006 at 9:32 am
All in all great extension. Good looking and useful.
One bug: can’t select the headers and copy them
February 24, 2007 at 3:12 pm
My Favorite Firefox Extensions…
One of my friends recently asked me what I’m using for extensions in Firefox 2, then suggested I share my list with the world. So, that’s exactly what I’m doing here. I’ll split them up by category so you can……
April 14, 2007 at 2:18 am
[...] Professor X and X-Ray, both commonsensical web development plugins that let you see either head or body tag information/structure without leaving the page. [...]
October 28, 2007 at 10:42 am
[...] Your page is on StumbleUpon [...]
January 8, 2008 at 6:48 pm
What a fabulous!! tool for web developers, designers & educators …
thank you sooo much !