Here are a few hints for getting started with Adobe Go Live 4. First, start the program, and let's get acquainted with how the program is set up.
When you start Go Live, it will default to having a new blank page open on your screen. If yours doesn't do this, go to File, and New. This will open a new blank page.
The most important thing in Go Live is to learn the palettes and how they can help you with whatever you're doing. Let's pull up the palettes one by one and go over them.
1. Go to View and make sure there is a check mark next to Toolbar. This will place the tool bar across the top of your screen.
Most people always have this visable. The first box in the toolbar is for styles that you want applied to your text. If you click the drop down arrow, you will see different Heading options there. These can be used for making your headings differnt sizes. The next three items on the toolbar are your alignment buttons for right alignment, center alignment, and left alignment. The next three buttons are the Bold, Italics, and Teletype options for changing the look of your text. The box next to the Teletype button is where you designate the point size of your type. The next three buttons are for using lists... numbered lists, bulletted lists and increasing list levels. The next two buttons are the blue chain buttons that you use when adding hyperlinks. More on those later.
2. Go to View and click on "Inspector". You will notice next to each palette under View there is a keyboard shortcut. These will come in handy once you learn the palettes. Your Inspector palette should now show up in a medium sized box on your screen.
This is the most important of the palettes, because this one controls everything you are working with. When you're working on type, this box will become the Text Inspector. When working on an image, it will become the Image Inspector. This box also controls your hyperlinks, alt tags, image properties, image maps, and actions. Each time you select something, this box changes with your selection.
3. Now go to View, and click on Palette. A small box will pop up on your screen. This is your palette that controls things you can place on your page.
Notice that this box has little tabs across the top with different areas of objects in it.
4. Go to View and click on Color Palette. A small box will pop up.
This box controls all the color on your page. The tabs across the top control different color aspects, but probably the one tab to get used to using is the one with the Roman numeral I on it. These are your browser-safe colors. Anything you assign one of these colors should look the same on any browser and (hopefully) on any computer.
*Managing your palettes: If you're on a PC, then managing your boxes will require a little practice. You can take hold of any palette by clicking and dragging the upper blue part of the palette. If you drag and drop your palette to the far left, or the far right of your screen, it will "dock" itself to the side of your page. This will decrease the working space you have on your page. Some people like this, and some don't. I've found that the best way to control my palettes is to always keep them closed, and just use the keyboard shortcuts when I need something from one of them. If your palette docks to the side of your screen and you don't want it there, simply double click on the double line at the top of the palette and it will come away from the side of the page.
Mac users have it a bit easier, instead of docking to the side of thier screens, the palette collapses down to a small icon on the screen that can be double clicked to expand it again.
Try closing down all your palettes, and then do the keyboard shortcuts to open each one.
Inspector = Alt+1
Palette = Alt+2
Color Palette = Alt+3
You can pull up the palette or close it down simply by hitting the keyboard shortcut.
Creating A New Page
Now let's get started with a new page. You have a blank page in front of you, so let's assign your page with colors for the background, text, and links.
1. Make sure you have your Inspector box and your Color Palette both on screen (Alt+1 and Alt+3).
2. Look at the top of your page, where there is a small white arrow, a blue page, and the words "welcome to adobe go live 4".
Highlight the words with your mouse, then delete them. Now type in whatever you want the title of your page to say, for example, "Welcome to My Home Page!". You've just changed your title!
3. Click on the little blue page icon next to your new title. If you noticed, your Inspector palette has now changed to the Page Inspector.
4. The first thing in the Page Inspector box is the title.
This is a second place that you can change your title, in addition to doing it the way we discussed earlier. If you choose to change your title here, make sure you hit the little black arrow at the right of the box, or hit enter, after typing what you want. Almost all the entry boxes are like this, and if you don't hit the little arrow, or hit enter, then your change will not be applied.
5. Beneath the title box, there are four boxes for the Text, Link, Active Link, and Visited Link. The boxes already have the standard default colors there, and in order to use those colors, simply click the little box that places a check next to the color. Now, let's say you don't want your text black, let's choose a new color. Make sure you have your Color Palette box showing (Alt+3). Now choose a color in the color box so that it shows in the large space across the top of the color palette. Once you have the color you want, click in the large area of the color palette, drag and drop that color over onto the Page Inspector, into the color box next to where you want it applied. It's that easy!
6. Under the Text Colors section is the Background Color section of the Page Inspector. You can choose a color for your page by dragging a color over from the color box, or you can choose an image to use for your background. You can also have both. In order to select an image for your background, click the box next to Image, and then use the browse button to navigate to the image on your hard drive. You should now have an image as your background!
7. Now, if you look at the top of your page, above where the little blue page icon is, there are tabs going across. Let's discuss those tabs now.
The first one, that you should currently have open already, is the Layout tab. This is when you're working on your page and making adjustments. The second tab is the frames tab. This is for when you are creating a frames page, you will be in this mode. The third tab is the Source tab, where it shows your HTML code. Besides the Layout tab, this tab can also be used for making changes to your page if you know and are comfortable with HTML. The fourth tab is the Outline tab. This outlines the source of your HTML so you can see the items easier. The final tab is the Preview tab. This allows you to view your page in whichever browser you designate, so that you can see how your page will look once it's published. In order to use this tab, you'll need to follow the instructions on setting up a browser to be used with this option. The first time you click the Preview tab, the program should prompt you for the set up procedures.
Now, let's add some items to your new page. Make sure you have your Palette (Alt+2) and your Inspector (Alt+1) showing. In your palette, click the basic tab on the top. Click on the box with the question mark (image icon) and drag that icon over to your page. It will drop onto your page, and now your Inspector changes to the Image Inspector. You have told the program that you want an image on your page, now you need to tell it what image you want.
In the Image Inspector box, under the basic tab, click on the box that says Browse. This allows you to navigate to the image on your hard drive. Once you have selected the image, you should see the image on your page. In order to adjust the size of your image, you can place different size numbers in the width and heigth boxes in the Image Inspector. (Keep in mind that your images should already be the size you want them before you place them on your page. Resizing them once they're on your page can result in an extremely long load time. While you have the option of resizing your image here, it's not recommended).
Aligning objects or text:
Once you have the image placed that you want, then you can use your align buttons on the toolbar to move it to the left, center, or to the right.
Circled above in black are your alignment buttons; left align, center align, and right align. Simply select the object you want moved by clicking on it, then click one of your align buttons. This works the same way for text, also. Highlight the text that you want moved, then select one of the alignment buttons.
Using the Layout Grid:
Many people just starting out with web pages find the layout grid to be a useful tool in helping them place objects where they want them. In your palette (Alt+2), make sure you are on the basic tab, then select the layout grid icon.
Grab the layout grid icon and drag it over onto your blank new page. You will see a grid pattern now covering the area of your page, with blue handles on the edges.
These blue handled edges can be grabbed and dragged to extend the grid to whatever size you want your page to be. Keep in mind that if you make the layout grid huge, your page will be the same size, or resolution, resulting in someone having to scroll alot to view your page. Try and keep this grid to what you can see.
Once you have the grid up and sized to what you want, then you can place objects on top of the grid, such as pictures. Once the pictures are placed on the grid, you can click and drag them to anyplace on the grid and they will stay where you want them. Use your preview button to see how the finished page will look once it's published; the grid will not be seen.