Leslie Franke

This one page cheat sheet is intended for web developers who are new to HTML and want to have a quick look up guide to basic HTML tags and syntax.

• PDF format
• HTML format

Note: See my original post for more on this subject.

This one page cheat sheet is intended for programmers who are new to Java and want to have a quick look up guide to basic Java syntax.

• PDF format
• HTML format

Typetester is a web based application which allows you to compare different font colors, sizes and typefaces side by side on a web page. Very useful.

(via Joshuaink)

In the same fashion as the Firefox Web Developer Toolbar, the IE development team has just released the IE Developer Toolbar. I have just downloaded it and played around with it a little. Some intial thoughts.

• I really like two things. You can pin the DOM Explorer toolbar to the bottom of the browser window (or let it float if you want). Among the things you can outline are positioned objects such as those that float. This outlining is something that would be nice in the Firefox Web Developer Toolbar.
• I do not like several things. When viewing class and id information the tooltips are often laid one on top of the other and in the same color. Almost impossible to read. Secondly, maybe it will take awhile to get used to, but the ruler seems very akward and not user friendly. Finally, for whatever reason it appears to save your toolbar selections when you exit and re-enter the browser and navigate to the page you were working on. I do not use IE as my everyday browser but this would seem to be very annonying if I did.
• It needs to be more consistent, it appears to be able to disable CSS background images from the ‘disable’ menu, but does not show the image path from the ‘image’ menu.
• It appears to be slower that the Firefox Web Developer Toolbar for many options. This is just a first impression, though, and my have to do with my setup.

Overall a good first start to making IE more developer friendly. Beware, though, it is beta software and is quite buggy in some places, shutting my browser down several times. It looks like a decent tool to use, along with the Web Accessibility Toolbar when testing pages in IE. The toolbar still has a long way to go to become as useful and developer friendly as the Firefox Web Developer extension.

Disclaimer: I tested the IE Developer Toolbar on a Windows XP SP1 machine running Internet Explorer 6.

Note: For more about developing with Firefox see my Rapid Web Development and Testing with Mozilla Firefox S5 presentation.

I need to be able to run the new beta version of Firefox to do some testing but at the same time want to be able to keep the current Firefox release on my computer for general browsing purposes, thereby allowing the extension and theme developers to catch up with the beta release. There is not much to it, but here are the steps I took to run Firefox 1.06 and Firefox 1.5 beta on the same PC.

1. Download and install the beta version of Firefox to a different directory than the normal Firefox directory on your computer. By default Firefox installs to C:\Program Files\Mozilla Firefox\. I left the stable version there and when given the chance by the installer installed the Firefox beta release to C:\Program Files\Mozilla Firefox Beta\.
2. Change the paths for the Firefox shortcuts. When the beta version installed on my PC, it wrote over the shortcuts of the stable Firefox version. To access the stable Firefox version, switch these shortcuts back and create a new shortcut for the beta version. For example on the desktop, do the following.
   • Right-click on the desktop Firefox shortcut and choose ‘Properties’ from the menu.
     In the ‘Target’ text box change the value from [”C:\Program Files\Mozilla Firefox Beta\firefox.exe”] (type in what is between the braces) to [”C:\Program Files\Mozilla Firefox\firefox.exe”].
   • Create a new icon for the beta release, in the C:\Program Files\Mozilla Firefox Beta\ folder by right-clicking on the Firefox.exe file and chosing ‘Create Shortcut’ from the menu renaming it to something like ‘Firefox Beta’.
   • Copy and paste the new shortcut to the desktop.
3. Create a new beta profile for Firefox in the Firefox profile manager. This will allow you to run a clean beta version of Firefox without worrying about any extensions and such. To do this:
   • Make sure all copies of Firefox are closed.
   • Select Start > Run… from the Windows Start menu.
   • In the ‘Run’ textbox type [firefox.exe -profilemanager] and press enter.
   • The Firefox profile manager will pop up. From there create a new profile, using the wizard, calling it “beta” and close the profile manager.
4. Finally you need to prevent Firefox from opening the profile manager everytime Firefox is ran. In the ‘Target’ text box of the stable Firefox shortcut, change the path to read [”C:\Program Files\Mozilla Firefox\firefox.exe” -p default] and in the beta version to read [”C:\Program Files\Mozilla Firefox Beta\firefox.exe” -p beta]. This will run each version of Firefox using the profile that was created for it.

The only catch, I see, is that both versions cannot be ran at the same time.

The last thing the world needs is another HTML or XHTML cheat sheet. That being said, here is another HTML cheat sheet, a simple and quick one page guide to HTML (For a good collection of other cheat sheets see The Cheat Sheet Roundup or HTML, CSS, PHP, and More Cheat Sheets). Inspired by the basic look and design of Dave Child’s cheat sheets I hope you will find it useful.

I am also currently working on a CSS cheatsheet. While not as comprehensive as Dave’s if it every gets in a form that is useful to the outside world I will post it here also.

Note: This is still a work in progress and was designed to fit a specific need. Thus, it is not a complete HTML reference, just a quick guide to HTML.

As a follow up to my posts about “Rapid Web Development and Testing with Mozilla Firefox” there is also a nice free toolbar for use when developing with IE. The Web Accessibility Toolbar (developed by the Accessible Information Solutions team at the National Information and Library Service) in many ways works like the “Web Developer Extension” by Chris Pederick. The toolbar provides the developer with all kinds of information about the structure and styles of a site. When testing and working with IE, it is a nice tool to have at your disposal.