FireFox Rocks

The buzz about FireFox (FX) is all over the net; people are discovering that it is a great browser to go surfing with. Yet besides web surfing, FireFox offers a bunch of features for web designers that can only be described as cool!

VIEWING WEB PAGE SOURCE CODE

Any web designer knows that being able to view the web page source code is very important during the development phase. This is especially true when you are building dynamic websites with say PHP, ASP, JSP, et cetera.

I've put together 5 things about Firefox source-code-view that put a smile on my face:

PAGE SOURCE ALWAYS WORKS – IE DOESN’T!

One thing that would tick me off with IE is, when (for reasons unknown) it would just refuse to display the source code when I wanted to see it! No warning, no message, nothing … very frustrating.

After digging around the web, I discovered that IE has connected the viewing of the source code with its own cache. When the cache becomes full, IE will simply not display the source code! To fix this, you have to go into the IE’s menus and clear the cache.

Needless to say, FireFox doesn't seem to have that problem.

HOT-KEY ACCESS TO SOURCE CODE VIEW

You have two ways to view the page source in FireFox:

1. Got to the ‘View’ menu and then select ‘Page Source’.
2. Or better yet, just use the hot key combo: Ctrl+U. This hot key combination is especially useful for lazy web designers like me …

FIND FUNCTIONALITY

There are 3 nice features in the FIND functionality:

• You have the option to have FireFox highlight all the occurrences of the search term at the same time - this allows for a quick scan of the page.
• FIND also has a ‘Match Case’ option.
• The FIND dialogue box appears as a tool bar at the bottom of the page- much more convenient than the floating box you get with IE … that floating box always seems to get in the way!

Hot-key combo: Ctrl+F

GOTO LINE FEATURE

This handy little feature can be useful to track down a JavaScript error in your web page. Often the error message will tell you the line number where the error occurred – sometimes not easy to find without a handy GOTO line feature.

You'll find this function under the ‘edit’ menu or simply using the hot-key combo of Ctrl+L.

PAGE SOURCE COLOR CODING

When you pop open the web pages source code (Ctrl+U,) you will find that the HTML tags, their attributes, comments and raw text each have there own color, this makes the source much easier to read.

This may seem like a minor issue at first. But when you compare this colorful view against IE’s monotone display of the source code – you’ll change your mind.

IE uses notepad.exe to display the source code; this simple text editor is simply not equipped for the job.

MORE WAYS TO VIEW THE PAGE

1. Under View > Page Style > No Style

This option allows you to see the web page without CSS affecting it. This is interesting to view because it can give you an idea of how the page might look on machines that can’t work with CSS – things like a cell phone.

2. Under Tool > Page Info

This pops open a handy little window that presents a nice summary of what’s on the page. You get a list of all the links, forms and their properties, what types of media elements you have on the page – things like images and Flash movies et cetera.

Overall I think the Page Info feature provides a nice view of a web page that can help you during development and upkeep of your websites.

3. Under Tools > Extensions

One of the most ingenious things the FireFox team came up with is its extensions functionality. Ok, creating a plug in framework for a program is nothing new but in FireFox, it has become the source of some great functionality that you can add to FireFox very easily.

Several plug in programs have been created for web developers, you can check them out here:

FireFox plugins

Until next time,

Stefan Mischook

Top

© 1996 -
Fatal error: Uncaught Error: Undefined constant "Y" in /home/killersi/public_html/articles_2005/techniques/firefox-rocks.php:133 Stack trace: #0 {main} thrown in /home/killersi/public_html/articles_2005/techniques/firefox-rocks.php on line 133