Firefox Add-on: Firebug 1.3.0
If you use Firefox (which you should be) and you’re a web designer, then you need to install this free tool. I just recently started using Firebug when my layouts became more advanced and included more css.
“Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.”
After installation is complete, you should see a little bug icon at the bottom of the Firefox window (see image below). With the desired page in your browser, click on that bug icon to bring up the Firebug workspace. You can also press F12 to get the workspace up. To open it up in a new window press Ctrl + F12.
Once the workspace is up, you can navigate your HTML/CSS in the left section and then see the style properties in the right section. Something that I just learned is that you can click on “Layout” tab on the right and it will show you a picture of the various divisions/blocks. That comes in handy when making pixel-perfect layouts.
While you navigate the code in the left window, you can hover on different tags and it will highlight the corresponding item on the page. If you click that tag, it will show you the properties on the right. You can also click “Inspect” on the top left hand side and that will let you hover over an object on the page and it will highlight the corresponding code. As you can see from the image below, I’ve hovered my mouse over the “
For me this feature has proved to be a tremendous help when dealing with many nested divisions on a page. I’m sure that there are many features that I haven’t discovered yet, but so far this tool gets an A+ in my book.
For more information, or to download the add-on, please visit Firebug’s home page.
http://getfirebug.com
CoffeeCup Google SiteMapper
Today we’re going to take a look at the Google SiteMapper by CoffeeCup.
By placing a sitemap file on your Website, you enable Google and other search engines to find out what pages are present, which have recently changed and have them spider your Website accordingly. Using Sitemaps allow you to inform and direct Google and other search engines what content you have available on your Website.
Google Sitemaps are an easy way for you to help improve your coverage in Google search results. It’s a system that enables you to communicate directly with Google to keep them informed of all your web pages, and when you make changes to these pages. CoffeeCup Google Sitemapper takes all the work out of creating a Google Sitemap. Just enter your Website Address and click go… Presto! The Sitemap is made and ready to upload.
When you first open the program, you will see the screen below.
For this example, I’m going to create a sitemap for one of my other sites. In the “Website Address:” field, I just type in the address. If you wanted to create a sitemap based off of local files on your computer, you would click the top radio button that says “Create SiteMap based on my Local Files”.
By clicking the “Options…” button in the middle, you are given the opportunity to ignore folders/files, change page colors, set different output options or ignore certain queries. On the example site, I always set it to ignore the blog directory, because my blog on that site uses a different sitemap tool that is designed for Wordpress.
Once you’re satisfied with your configuration options, press “OK” and then “Next”. After that, the CoffeeCup super-spiders will crawl your website and start collecting page data. Once that’s complete, you’ll see a list of all your pages that it found. It will only find pages that are interlinked together. If you have a page that isn’t connected by linking, it will not appear on your sitemap by default. Here is what mine looks like:
If you’re satisfied with the results, choose the desired output location and hit “Save”. You will then be given the option to upload your sitemap or submit it to Google. Normally, I just close the window and upload it myself. The program also creates a .csm file that doesn’t need to be uploaded. That’s a saved program file that stores your sitemap info for later.
Overall, I think CoffeeCup is correct when they say “Just enter your Website Address and click go… Presto!” It really is that easy. You can see a live sitemap created with CoffeeCup Google SiteMapper here.
If you would like to try the software out for yourself, you can download it here.
Compare text files with ExamDiff
Have you ever needed to find the differences between two text files? You may not need to everyday, but if/when you ever do, ExamDiff really makes it easy. ExamDiff is a freeware Windows tool for visual file comparison. It has a number of simple and convenient features that many users have been asking for a long time from a file comparison tool.
As soon as you run the program, you will see the following window:
For my first example I’ve used a php file that is used on this site. I copied the file and then made a minor change to the second one. I replaced a semicolon for a colon at the end of line #45 and it picked it up right away.
My second example uses a normal text file. Unfortunatly, the free version doesn’t support wordwrap so it only shows you the line in which the difference takes place.
Once you scroll to the right (both sides simultaneously), you can see the difference.
In all my examples, the highlighted text is a bright green color. That’s not the default color. To change the color of the highlighted lines go to options > display.
Get Notified When We Post Updates
