Showcase and discover digital art at yex

Follow Design Stacks

Subscribe to our free newsletter to get all our latest tutorials and articles delivered directly to your inbox!

Working with the Site Window

Working with the Site Window

I first envisioned GoLive as a magical tool that allowed beginners to create Web pages any old way they liked, while the software hummed along in the background, keeping all of that nasty code out of sight. And while it works that way to some extent, GoLive is really geared toward more experienced HTML jockeys. The wealth of choices and the 800-page manual (you heard me) are daunting to someone just starting out, and much of the terminology and capabilities are unfamiliar.

However, for monkeys that have been fiddling with Web sites for a while, GoLive can be an enormous help. It’s especially cool for someone like me who knows about old-school, plain vanilla HTML but would like to reap the benefits of JavaScript, stylesheets, and all that jazz without having to learn yet another programming language.

GoLive has many uses. You can create individual pages or simply generate chunks of code (if you wanted to hand code your site but have GoLive deal with the JavaScript, for example), but its specialty is assembling and managing entire sites. You can make a bunch of individual pages and then group them together when you’re done. But for my Orifex project, I’m going to create the site structure first so I have an idea of what the whole thing will look like before diving in.

So let’s get started. First, fire up the program, go to the File menu, and select New Site:Blank. This creates a folder for your site, which will hold a site folder for your HTML files and media, a data folder for stuff that you’ll be using while designing (but won’t need when the site is live), and the site document. The site document is what holds all of your files together, treating the various elements as One Big Entity that will allow you to search your whole site at once, make global changes, and be warned instantly about broken links.

If you already have a site that you’re working on, it’s easy enough to import it. Go to File and choose New Site:Import from Folder or Import Site from FTP. Then GoLive will snatch all the files, either from your hard drive or from the Web, and plug them into a GoLive-ized structure.

I’m making a site from scratch, though, so when I choose New Site:Blank, the resulting folder is barren except for an empty file called index.html that is kindly created for me. GoLive displays this file in the Site Window, which is your control center for dealing with site-wide stuff:

Site Window

The Site Window, and in fact the entire interface, should look familiar to Mac users, especially to Mac users who have dealt with Adobe products. As with Photoshop, you do your main work in a central window (in this case, either the Site Window for site management or the Document Window for page design), controlling the action with a toolbar and tabbed palettes that float in the outskirts. Tabs appear along the top of most of the windows, giving you quick access to a wide array of features, while conserving screen real estate.

Notice that the toolbar and the Inspector palette are both context-sensitive, so they change depending on what feature you’re using. If you were typing some text onto your page, for example, the toolbar would change to the Text Toolbar (complete with formatting buttons) and the Inspector becomes the Text Inspector (where you can set up links, JavaScript actions, stylesheet styles, etc.). Don’t worry, clean freaks, the Inspector and the palettes can all shrink down to a small icon by dragging them to the right side of your screen.

A number of windows are grouped together in the Site Window, compiling all of the tools that help maintain your site. You can reorganize the structure, add new folders, get bug warnings, save oft-used colors and fonts, and even upload your site, all right from this one window. The main section you’ll be using, though, is Files. Click on that tab and you’ll see all of the files and folders in your site. You can move stuff around and rename files just as you would in the Finder. In fact, the changes you make here will be instantly echoed in the Finder.

Right now, all I have in the Files window is the blank index.html. I could go ahead and start designing that page, but I’d like to figure out the site’s structure first. I want the big picture in focus before I concentrate on the individual pages.