Building the Frames
Building the Frames
Let’s take a look at some of the other views in the Document Window. I want to see how this page will look on the Web, so I hit the Preview tab. The Inspector becomes the Document Layout Controller where I can toggle between various versions of the Big Two browsers to see guesstimations of what the page will look like on them. This is a nice feature, but it’s always good to test everything on an actual browser, and GoLive makes that easy too. On the right-hand side of the toolbar is the Browser Preview button, which will load the current page into your browser(s) of choice.
I can also use the Outline View, which presents the HTML code as a visual outline, sort of like a folder filled with files and subfolders on your desktop.
So the <HEAD> tag, for instance, can be opened to reveal its contents (a <META> tag, a <TITLE> tag) and closed to tidy up the screen. You can also edit the code in this mode, by dragging Palette icons onto it or by pressing the New HTML Tag button in the Outline Toolbar and typing in new code. Although this method of dealing with HTML is unique and could be useful in troubleshooting missing tags and the like, I don’t find myself using it too much.
I am curious to see what kind of HTML this thing is generating, though, so I click on the Source tab and get the good, old-fashioned raw code. And what do you know? It looks pretty much how I would’ve written it, plus it’s nicely organized with the various sections clearly separated and the tags colored (how the source code is presented, and the coloring, are all customizable). There’s even a syntax checker, and it’s fully AppleScript-able too. Not too shabby! Although GoLive’s source editor isn’t as fully-featured as something like BBEdit, it holds its own and is pleasant enough to work with when the time comes to get intimate with the code.
There are cases when GoLive’s code isn’t always so pleasant, however. My splash page is basically just a centered image, so there aren’t too many ways to screw that up. But when things start getting more complex, the code can become pretty hair-raising – as you’ll see in a sec.
Now I need to build the main page of my site. I typically avoid frames like the plague, but I figure I’ll let GoLive deal with the <HEAD>aches. And indeed, creating frames is a breeze with this puppy.
First, I open the second page of my site, called orifex.html. I can’t do any frame work in the default Layout View, so I click the Frame Editor tab to bring up that view. Then I go over to the Palette and hit the Frames tab. This calls up a bunch of pre-designed frame structures, and sure enough, there’s the format I want: one smaller frame running horizontally along the top, with two frames below it. I drag that icon to the Frame Editor and it immediately creates that structure for me. The top frame is a little too big for my taste, so I grab the border line between the two frames and drag it upward. If I wanted to, I could also get a little more precise using the Frame Inspector: I would type in exactly how big I want each frame to be, whether or not they should scroll, and what they should be named, etc.
Next,I need to tell GoLive which documents will be pulled into each frame, like I did when I pulled the splash image onto the splash page. Again, I use the point-and-shoot gizmo to locate the necessary files in the Site Window and add them to the frames. I put my blank file head.html in the top frame, left.html in the left frame, and news.html in the right.
I use the Frameset Inspector to turn off the borders between each frame, but when I finally get around to testing my site, those borders still appear in certain browsers. I have to go back into the code and add frameborder="no" so that both IE and Netscape will display it properly. I soon learn that doing these kinds of minor tweaks ex post facto is something you have to get used to with WYSIWYG editors.
Anyhow, the frame is done, and in record time, but I still need to create the content that’s going to go in these files.
Comments