Validate Your Web Pages / Diagnose Your Website

Use Firefox Tools (Add-Ons / Plugins / Extensions) For Your Website Needs

If you want to validate your web pages, diagnose web page problems and build better web pages in general that work in most, if not all, web browsers; you should seriously consider using Mozilla Firefox as your default, web page checker, browser. Especially if you are creating and/or testing Application Forms, E-Mail Contact Forms and so on.

Firefox is more structured for website programmers and website designers. It makes it easy for you, even if you are an absolute beginner, to install and use add-on tools that allow you to make sure your website works properly with audio/video (audio/video add-ons), that it has good keywords (seo add-ons) and that it conforms to website standards (html and css validators) for example. It also has a Colour Picker/Grabber add-on, International Clocks add-on and much much more to offer.

Assuming you have downloaded and installed Firefox, you install a Firefox ADD-ON by first visiting the website of that add-on and then download it. This is normally done by visiting the firefox website and searching for the add-on you want, if it exists and is available of course.

THE  ADOBE  FLASH  ADD-ON

In this example I am going to download the latest Adobe Flash Player add-on, by visiting the adobe.com website, using firefox. This allows Adobe to detect the web browser in use (firefox) and give the correct download for it. After that I will show you the firefox add-on web page where you can search for firefox specific add-ons. The adobe Flash Player add-on, and the adobe Shockwave Player add-on combined, allow you to view Flash Animations/Adverts, YouTube Videos and so on. Hence why you need both.

Note here that I am using ADD-ON loosely. Firefox ADD-ONs are split into three main categories. Extensions (extra codes that extend Firefox's functionality. An Anti-Virus guard and HTML Code Validator are two examples), Themes (which change the appearance (Graphical User Interface) of Firefox) and PLUG-INs (which are separate programs that interact with Firefox. Java and Adobe Flash are two examples). The word ADD-ON in general means to add/extend the functionality of a piece of software.

To download the Adobe Flash Player plug-in (ADD-ON) first go to the Adobe website and click on its GET FLASH PLAYER button to take you to the download page (Fig 4.1). On that page you need to click on the AGREE AND INSTALL NOW button in order to download and install in the Adobe Download Manager, which in turn will download and install Adobe Flash Player.....the Firefox version.

Fig 4.0  Click on the GET FLASH PLAYER button to continue




Fig 4.1  Click on the AGREE AND INSTALL NOW button to continue

After agreeing to the Terms & Conditions of the Agreement the downloading of adobe download manager will begin. As this is being done an Information Bar (message requester) will appear stating that the installation of adobe download manager cannot continue without your permission basically. So click on the information bar's ALLOW button to continue.

Fig 4.2  Click on the ALLOW button to allow the installation of the adobe download manager




Fig 4.3  Click on the INSTALL NOW button to install the adobe download manager

Once the adobe download manager has been installed, by clicking on the above INSTALL NOW button and following the necessary installation steps (not shown here), you will prompted to restart firefox by clicking on its RESTART button.

Fig 4.4  Click on the RESTART button to restart firefox and initialize the adobe download manager

Restarting firefox allows it to initialize (set up and execute) the adobe download manager whose job it is to download and install the actual flash player plug-in (add-on). Clicking on the RESTART button closes firefox and then reopens it whereby the adobe download manager is then executed (launched/run). It in turns begins to download and install, via a green progress guage (not shown here), the actual flash player plug-in.

Fig 4.5  Click on CLOSE DOWNLLOAD MANAGER - The adobe flash player plug-in has been installed

When the adobe flash player plug-in has been successfully installed (above) go back to the adobe website and click on the GET ADOBE SHOCKWAVE PLAYER button (below) to download and install adobe shockwave player.

Fig 4.6  Click on the GET ADOBE SHOCKWAVE PLAYER button to continue

As said above; You need both the flash player and the shockwave player plug-ins (add-ons) in order to view Flash Animations, YouTube Videos and other flash/adobe related codes, applications and so on.

SEARCH  FOR  FIREFOX  ADD-ONS

To get to the Firefox ADD-ONs web page simply go to https://addons.mozilla.org/en-US/firefox. From there you can either browse through the predefined categories, located on the left-side of the web page, for a view of general add-ons or you can search for a particular kind of add-on as exampled below.

Fig 5.0  Type in a search query and then select its category from the drop-down menu

In the above example I am looking for an add-on that will help me Validate each of my web pages (their HTML code), so in the SEARCH edit box I have typed the keywords (search phrase) html validator. And as this comes under Website Developement I have selected Web Developement from the CATEGORY drop-down menu. All that I have to do now is click on the GO button for the search to begin.

Fig 5.1  Click on the green GO button to begin the search




Fig 5.2  Click on the ADD TO FIREFOX (Windows) button to continue

When the search has completed there might be many results for your search phrase (keywords), spanning many results pages, in which case you could browse through them or refine your search by using the ADVANCED SEARCH button (located just underneath the GO button). In this example HTML Validator by Marc Gueury happens to be the add-on I want to download and install. If it was not I would of had to browse through these results pages for it.

Read  The  Reviews

Although though I am not normally a fan of reading through reviews I must recommend that you do in the case of looking for add-ons. This is because, as far as I can gather (and I have no reason to suspect otherwise), they are written by genuine users like me and you. Some of them are honest enough to say an add-on is not good, it crashes firefox and so on (in their experience of using that add-on). The star ratings are also worth consideration.

Install  The  Add-On

Once you have decided you want to download and install an add-on click on its ADD TO FIREFOX (Windows) button (Fig 5.2 above) to begin the installation (download and install) process. If the add-on, and more precisely its author, has not been authorized (verified as good) yet the INSTALL NOW message requester that appears (below) will display a warning message. If after reading that warning you still want to download and install the add-on click on the INSTALL NOW button to continue.

Fig 5.3  Click on the INSTALL NOW button to download and install this, unverified author, add-on.




Fig 5.4  The add-on is being downloaded and installed




Fig 5.5  Click on the RESTART FIREFOX button to continue

When the add-on has been downloaded and installed Firefox may need restarting, in order to initialize (set up) certain components of that add-on and/or to complete the installation process, which is denoted by the appearance of the RESTART FIREFOX button (above).

In this example an options window appears (not shown here), after clicking on the RESTART FIREFOX button, that asks you to set up the HTML Validator - Select the HTML TIDY option. Once that is done Firefox displays its Add-On Installation Complete window (below). Clicking on the TOOLS menu and selecting the HTML Validator menu-item will allow you to set up additional options for the validator.

Other add-ons might have a TOOLS menu option too, but this depends on the programmer and add-on features/functionality.

Fig 5.6  Options available, via the the TOOLS >> ADD-ONS menu-item, for this html validator add-on

Do not think Firefox add-ons are all about Web Development and The Internet, even though plenty are!, because some of them are just plain useful.....like the Dictionary add-ons, the Media-Player plug-ins, the Music Toolbars, Themes, Tabs and so on.

MISSING  PLUG-INS

The beauty of firefox is that it is a bare minimum web browser that can be extended through add-ons and plug-ins. It does not have "all the required add-ons and plug-ins" built-in as standard like other web browsers because it knows you may never use one of those "required add-ons and plug-ins". The Windows Media Player plug-in for example could be classed as a "required add-on and plug-in", if you require firefox to have the ability to play .wmv movie files as standard, but if you never need to play .wmv movie files through firefox the Windows Media Player plug-in could be classed as "useless".

The advantage of not having "all the required add-ons and plug-ins" built-in (installed) as standard is that firefox tends to be lighter than other web browsers as it is not using those otherwise unnecessary resources. However. The disadvantage is that when one or more of those "required add-ons and plug-ins" is needed, perhaps because someone sent you a link to a web page requiring one or more of those "required add-ons and plug-ins", you are going to have to install the "required add-on(s) and plug-in(s)" yourself because they are not built-in as standard of course.

In this next example I will show you how simple it is to install the Windows Media Player plug-in. I have already downloaded it by going to this web page: http://port25.technet.com/pages/windows-media-player-firefox-plugin-download.aspx. This is also the link given if you click on the PLUGINS category, on the firefox add-ons web page, and then click on the Windows Media Player plug-in link. Once the Windows Media Player plug-in file (wmpfirefoxplugin.exe) is in your DOWNLOADS folder (or where ever) double click on it to begin its installation process.

Fig 6.0  Click on the NEXT button to continue




Fig 6.1  Accept the License Agreement and then click on the NEXT button to continue




Fig 6.2  Click on the INSTALL button to continue




Fig 6.3  The Windows Media Player plug-in is being installed




Fig 6.4  Click on the FINISH button to complete the installation process

As you can see; Regardless of add-on or plug-in their installation procedures are roughly the same, if not the same. You simply search for an add-on or plug-in, download it and then install it.

If you need to update an add-on you do not need to uninstall it in order to install a newer one. All you need to do is click on the firefox TOOLS menu, select the ADD-ONS menu-item to bring up the Add-Ons window and then click on its FIND UPDATES button. It will then search through the installed add-ons looking for newer versions of them (not exampled here). If any are found it puts a tick next to each one, which you can untick if you wish, and gives you a newly available INSTALL UPDATES button to click on in order to install (download and update) the new updates.

Fig 6.5  Click on the FIND UPDATES button to find newer versions of the already installed add-ons

You can also use the Add-Ons window to DISABLE, ENABLE or change the OPTIONS of an add-on, if applicable. Clicking on the other tabs of the Add-Ons window (Get Add-Ons, Themes and Plug-Ins) allows you to get recommended add-ons, get new themes for firefox and modify plug-ins.

As a website developer/creator there are many firefox add-ons you can use to improve your website, and they are not all about coding. FoxClocks for example is a nice add-on that displays international clocks along the status bar. Knowing what time it is in america for example, whilst browsing with firefox, can be the difference between you missing a Google Webinar (online seminar/meeting) and posting a blog post when everyone is in bed. Timing is an important factor that is often overlooked. Dictionaries are other add-ons worth considering.

Do not have too many add-ons installed though otherwise firefox may feel sluggish. If you want to test audio/video I highly recommend that you install RealPlayer and QuickTime for testing in general as their file formats are commonly used in the audio/video arena.