Tricking Out Firefox in Java

Paint PDF 417 in Java Tricking Out Firefox

The HTML Validator tool will revolutionize your Web development experience It really helps you create standards-compliant sites easily, and it has the added benefit of helping you rapidly discover the level of compliance of any page you visit (It s fun to feel superior)

The Web Developer toolbar by Chris Pederick provides all kinds of useful tools for Web developers The program installs as a new toolbar in Firefox, as shown in Figure 3-5 Figure 3-5 shows the Wiley home page with some of the Web Developer toolbar features active The Edit CSS frame on the left allows me to modify the look of the page in real time, and the thick outlines were added by the toolbar to help visualize the page organization (I describe these ideas in detail in Books III and IV) When you have the Web Developer toolbar activated (use the View Toolbars menu command to hide or show it), you can use it to do the following: Edit your page on the fly The Edit HTML Entry option on the Miscellaneous menu opens a small text editor on the side of the screen You can make changes to your HTML here and immediately see the results in the main screen The changes aren t permanent, but you can save them

Validate your pages There s a menu command (CSS Edit CSS) to validate your page, but the Web Developer toolbar also adds some hotkeys to Firefox so you can instantly send your page to the W3 Validator Ctrl+Shift+A contacts the W3 Validator and then sends your page directly to it It s much easier than memorizing the Validator address This feature alone is worth the download time You can also do other kinds of validation, check your CSS, or see how well your page conforms to various guidelines for people with disabilities Manipulate CSS code After you define your page with XHTML, use CSS to dress it up The CSS menu has a number of great tools for seeing how CSS is set up and experimenting with it on the fly I explain how to use the CSS tools in Books II and III, where I describe CSS View your page in different sizes Not everybody has a huge flat-panel display It s important to see how your page looks in a number of standard screen resolutions Get a speed report Your Web page may load great on your broadband connection, but how does it work on Aunt Judy s dialup Web Developer has a tool that analyzes all the components of the page, reports how long each component takes to download over various connections, and suggests ways to improve the speed of your page s download

The Web Developer toolbar can do a lot more, but those are some of the highlights The toolbar is a small and fast download, and it makes Web development a lot easier There s really no good reason to not use it

The Firebug extension is another vital tool for Web developers Firebug concentrates more on JavaScript development rather than pure XHTML development, but it s also useful for XHTML beginners Figure 3-6 shows the Firebug extension opened as a panel in Firefox The Inspect mode allows you to compare the HTML code to the output When you move your mouse over a part of the rendered page, Firebug highlights the relevant part of the code in the other panel Likewise, you can move the mouse over a code fragment and see the affected code segment This can be extremely handy when things aren t working out like you expect You can view the HTML code as an outline, which helps you see the overall structure of the code You can also edit the code in the panel and see the results immediately, as you can with the Web Developer toolbar, which I discuss in the previous section Changes you make in Firebug aren t permanent, but you can copy them to your text editor