35 Absolutely Useful Firefox Plugins For Web Designers And Developers

From “Kumar’s Blog” – August 2009:

Firefox is a very popular browser especially among web designers. There are more than 70% of WDB’s readers are using Firefox. There are few reasons which make Firefox so popular compare to others and obviously its plugins had contributed a lot for that. [Read more]

Book Erata

Thanks to classmate Ron Wilson for pointing out that the screen shots of the Memories site, which I created from files supplied by the book publisher, inaccurately depict the site’s font-family as it would have been after Unit E.

Firstly, the site in the screen shot for Unit E is showing a sans-serif font-family has been applied –specifically, “Arial, Helvetica, sans-serif“.  However, the book does not instruct you to assign a font-family to the site until Unit F so, to be accurate as of Unit E, the body font should be the default of “Times New Roman“.

Also, note that in Unit F, when you are instructed to add a font-family, it is left up to you which font-family to add so, if you choose not to use the abovementioned family, your site will not match the screen shots exactly –which is perfectly OK.

Watch for Unit F screen shots coming soon.

Browser Add-ons/Extensions

 The following are my recommended add-ons for your Firefox browser:

• HTML VALIDATOR (based on Tidy and OpenSP)
  HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of  an icon in the status bar when browsing. The details of the errors are seen when looking the HTML source of the page.
  The extension is based on Tidy and OpenSP. Both algorithms were originally developed by the Web Consortium W3C. And now extended and improved by a lot of persons. Both algorithms are embedded inside Mozilla/Firefox and makes the validation locally on your machine, without sending  HTML to a third party server.
• The Web Developer Toolbar extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock, Mozilla and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux.
• Firebug – Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.  Firebug 1.5 requires Firefox 3.5 or higher.

Please note: As of 2/19/10, Firefox 3.6 is the latest verion of that browser. [download now]

Supplement your CSS knowledge

Save a lot of work with CSS!

With W3schools.com’s CSS tutorial you will learn how to use CSS to control the style and layout of multiple Web pages all at once.

Start learning CSS now!

More on Photo Albums

Styling a Tableless Gallery – Part I

~From The CSS Anthology, 2nd Edition, Rachel Andrew

If you need to display a collection of images –perhaps for a photo album– a table may seem like the easiest way to go. However, it is possible to acheive this without using a table –(by using CSS); it provides some significant benefits that tabled versions lack.  [see how to do it]

Also see: Tableless web design

Helpful links

Here are some helpful links to web development resources.  Most of these can be found on my web site so, I’ll link to that first:

• http://faculty.ccri.edu/jkirby/
• Styling a Structural List as a Navigation Menu – This is another way to use an unordered list <ul> as the basis of your navigation. 
  • Download HTML (open with IE7, select, "File > Edit with Expression Web".  With IE8, select, "Page > Edit with Expression Web")
• Publishing your site to a server
• Converting Word Files (or any text) Into HTML – We made this for SharePoint Designer but it applies to EW as well.