How To Make Simple Changes To Your Web Site

 Web Design %tags

Get to know a wonderful little program that sits inside Firefox Browser. It’s called Firebug, and it will help you find all those glaring design changes you want to make.

You can find it here: https://addons.mozilla.org/en-US/firefox/addon/firebug/?src=hp-dl-mostpopular

Click the + Add to Firefox button and follow the instructions. It pretty much just installs, and you may have to restart your browser.

(Here’s another tip if you want to restart without losing all your tabs: Click on the Firefox button at the top of your browser, then click Options/Options. An Options window will pop up. Under General/Startup there’s a drop down box called When Firefox starts. Choose “Show my windows and tabs from last time”)

Now that you have firebug installed open up your web site in a tab. Then right click on the element you’d like to change or investigate. You will see an item in the menu popup called “Inspect Element with Firebug”. Choose it. A sort of half window will take over the bottom of your screen. These are the guts of your page. The HTML is on the left, while the CSS is on the right. If you click on and highlight any element from HTML in that window, you will see the CSS assigned to that element.

You can experiment with changes in the CSS and see the results in real time on your page in the browser. However, you’re not making permanent changes. You will need to download the CSS files, make the changes then upload the changed files (don’t forget to backup!).

Not sure which files? Firebug will tell you that too. Next to the CSS markup you will see a filename link. Hover over this name and get the full path to the file.

Leave a Reply

%d bloggers like this: