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!

Laying It Out

Laying It Out

I forge ahead and whip up four icons for the navigation bar, and now I want to arrange them into a square in the left-hand frame. My first instinct is to grab the Table icon from the Palette and make a table to hold these pictures. I consider this because being able to stretch and compress a table until it’s the exact shape you want is a welcome relief from endlessly messing around with <TD> tags. But the point of a WYSIWYG editor is to stick the images where you want them and let the program figure out the code.

So I use the Layout Grid, which is central to GoLive’s design tools, but coughs up some seriously scary tables. Dragging the Grid to your page gives you a square grid (duh) that you can adjust to any size. Then you can position pictures and text and whatnot exactly as you want them. Remember when I had to center my splash image and put some line breaks in to get it to the middle of the page? If I’d been using the Layout Grid, I could’ve just slapped it right in the middle and been done with it. But. But! The Layout Grid, in order to perfectly recreate your layout, uses big, complex tables, and a handful of unusual tags.

This can be problematic for a number of reasons. It bloats your file size, which may not be a big deal for a my little Orifex site, but if your site consists of hundreds of pages, that bloat can really add up. Also, if someone else is going to be working on the site, they may not feel like trying to decipher your weird-ass GoLive code and just might throw it back in your face. Finally, using nonstandard tags can result in browsers choking when trying to view your site, and this should be avoided whenever possible.

Nevertheless, I use the Layout Grid and then, as with the splash image, I drag a series of image icons from the palette onto the Layout Window. I then use the Image Inspector to specify which images should go where and to link the icons to their respective subpages.

Layout Grid

I preview my new navbar and it looks perfecto, so I take a deep breath and hit the Source tab to peek at what is going on behind the scenes.

GoLive made a table, all right, and it wasn’t horrifyingly complex, though it certainly had way more cells than I ever would’ve thought of using. And what’s all this: showgridx, cntrlrow, spacer (spacer! that old chestnut?), xpos? What are these things? What do they want? Now I’m starting to get edgy. I’m getting that same old Denny’s feeling I get whenever I dig into the code of some big, complex site. That feeling, folks, is fear. Fear that I’m going to try and clean things up and end up breaking the whole page. Fear that my navbar, which looks so nice and neat in the Preview window, is going to look like a wide-awake nightmare of chaos once it is unleashed into the real world.

What to do? I do what I always do with my fear: Ignore it and move on.