Aptana is a free programming text editor. It is far more powerful than you will need in this class, but I recommend it for two very useful features:

• color coding of HTML text: as explained on the last page, this program will automatically change the color of tags, attributes, value, and text so that it is easy for you to see the structure of the code;
• indent control: this app will help you by automatically raising and lowering indents, also helpful in seeing the page's structure;
• tag buttons: buttons along a toolbar at top will type in some of the commands you want;
• tag/attribute autofill: as you type html tags and attribute, long lists of possible tags, attributes, and values appear for you to choose from.

First, go to Aptana's Download Page. Click on the link that looks like this:

Choose the "Standalone" type for your OS (Windows or Mac), and get the "Full Installer."

On the Mac, it's easy--just download it and then drop the folder into the "Applications" folder. That's all. For Windows, as usual, the install process is longer and more involved:

On a Windows PC, after you choose to download, save the installer. You must remember where you saved it (e.g., "My Documents") so you can open it when it downloads.

After it has downloaded, open the setup app from the location where you saved it.

You will probably see the following windows. Simply run the program and allow all security questions.

You will then see the install wizard. Note the "Next" button at the bottom. You will have to click the button that appears there several times. The sequence is: Next, I agree, Next, Next, Next, and Install.

Aptana will install on your computer. After it has completed, you may have to click a few more buttons, i.e. "Next" and "Close."

OK! Now it should be installed on your computer. You can now open the program. On the Mac, go to your Applications folder, open the "Aptana Studio 2.0" folder, and open the "Aptana Studio" app. In Windows, there should be an icon on your Desktop, just open that.

On the Mac, it may ask you if you're sure you want to run the new app; just agree. In Windows, the security dialog may come up asking the same thing; click "Unblock."

Now you're running the program!

Aptana will open as a full-window, multi-frame app. Try to ignore most of what you see (it's for advanced users). Instead, go to the File menu, choose the top command New, and choose "Untitled HTML File." You should get the working window:

Note the following window features:

1. Window selection tab: use these to select which web page you want to work on.
2. Quick HTML toolbar: click on buttons to get quick HTML tags.
3. Main editing area: note the color coding of the HTML. Also note that it begins by giving you the html, head, and body tags with other common code that a web page might need.
4. Code / Preview switcher: click on "IE" or "Safari" (whatever the tab is named) to see a preview of your web page as it would appear in a browser.

REMEMBER THE THREE STEPS!!

1. Did you create a folder for your project? If not, do so now!

2. Did you save images in the project folder? If you will need images, remember to put them in the same folder.

3. Now, in Aptana, save the blank web page before you put anything in it.

Now you should be ready!

When you use Aptana to write HTML text, you may notice that the program helps you type commands. Let's say that you want to make a "font" command. As you type "<font", you will see a menu appear by your typing:

As soon as the tag you want becomes selected in the list, just hit the "Enter" key, and it will appear in full, including the end tag! Note the little browser icons to the right of each tag; this tells you if IE or Firefox recognizes the tag or attribute.

Note that the cursor is at the end of the starting command. If you continue typing a space, possible attributes will appear:

You could just click on the attribute you want from the list. You can also use the arrow keys to navigate the list. However, you can just keep typing if you prefer. As you continue to type the first letter, the selection narrows to the attribute that fits your typing:

Again, hit the "Enter" key and it will type the rest for you:

Keep typing the quotes and the value. If the values are a limited set (e.g., "left," "center," "right"), then these may be also presented to you. Finally, your tag will be complete:

This feature not only speeds up your typing, but it also reminds you of what tags and attributes you are able to use. Most of them will be ones you have not studied; just ignore them (or study & experiment!).

Aptana lets you create a table very quickly. In the Quick HTML toolbar, the leftmost button is to create a new table. Place your cursor in the page's code where you want the table to appear, and then click on the table button. This dialog will appear:

Type in how many rows & columns you want; the border, cellpadding, & cellspacing you want; how wide the table should be; and, if you wish, a table caption. Then click "OK" or hit "Enter," and Aptana will write all the table's complex code for you!

This is just a basic introduction to the Aptana software, but it should be enough for you to get used to the program, and make a very nice web page!