Chapter 10: Laying Out Pages; Page Layout For The Web - Adobe GOLIVE CS2 User Manual

Hide thumbs Also See for GOLIVE CS2:
Table of Contents

Advertisement

243

Chapter 10: Laying out pages

Page layout for the web

Page layout techniques
The Layout Editor in the document window provides the canvas on which you drag files or objects (usually from the
site window) onto your page. CSS layout objects, tables, layers, frames, and GoLive layout grids and text boxes
provide the containers for holding and positioning text, images, animations, and movies.
CSS-based designs
CSS layout objects enable you to create liquid layouts; that is, layouts that resize to accommodate the viewer's screen
settings. Liquid layouts are quickly becoming the web standard and offer both designers and viewers more flexibility
than table-based designs. In GoLive, you can instantly create a liquid layout by simply dragging preconfigured CSS
layout objects from the CSS tab of the objects toolbox to the page.
Layout grid-based designs
GoLive CSS-based or table-based layout grids enable you to create designs that let you freely position objects
anywhere on the page. You can convert a CSS-based layout grid to a table-based layout grid. You can also convert a
table-based layout grid to an HTML table.
Table-based designs
All web browsers can display HTML tables, so they are often used for page layouts. You can position images, text,
and other objects on the page by placing them in table cells. To conceal the table structure, you can leave cells empty
and hide table borders.
GoLive provides two ways to create table-based page layouts: standard HTML tables or table-based layout grids that
let you freely position objects anywhere on the page.
Layer-based designs
Like objects on a layout grid, you can freely position objects in layers anywhere on a page. However, layers also let
you overlap objects and interactively show and hide content in a browser. Use the Layer tool in the objects toolbox
to draw and size layers on a page.
A
B
Image links are attached to show or hide actions for stacked layers. Holding the pointer over an image (A) makes text in layer appear (B).

Advertisement

Table of Contents
loading

Table of Contents