Web Design Tools For Firefox
March 6, 2008 by designwebsite
Designing good looking websites is often a little bit hit and miss. Even with the best web development tools, getting things to line up or matching colours is hard to achieve. Forunately, Firefox has a couple of great extensions that make laying out a web page just a little bit easier.
GridFox
If you’ve recently moved from desktop publishing to web design one of the things you’re likely to miss is the ability to overlay gridlines on your website to make sure the various elements line up, much like The Gimp or Inkscape does. Designing neatly-aligned webpages demands something a little more accurate than guesswork to make sure things are in proportion. GridFox goes some way to achieving this and is intuitive and easy to use.
By default GridFox displays a set of vertical grids over your page but can be adjusted to display a set of horizontal grids as well. Go to Tools->GridFox->Options and enable the horizontal grid lines.
The colour, thickness, opacity and spacing of the grid lines can be customised in GridFox’s options menu as well. Being able to adjust the thickness of the rules is handy for making sure gutter widths are even across the site, for example.
Must admit, GridFox turns out to be quite handy. Good typographical design relies on placement, line-heights, collapsible borders etc. that are just almost impossible to figure out on-the-fly. As a visual reference this makes sense.
I’d also like to mention FireBug (http://www.getfirebug.com) as an Extremely useful add-on with a capital E. You can dynamically edit CSS selectors and properties within Firefox, switch various elements, select blocks, highlight regions. Firebug also traces the CSS hierarchy quite nicely within its browser highlighting all of those pesky problems with selectivity. A definite must.
Cool Web Designs
High quality article my friend. It’s nice to read. Thanks for spending time to write good things for us.