UNDERSTANDING PAGE LAYOUT METHODS


The method for laying out web pages using GoLive is pretty much the same regardless of the type of content you're creating. The Layout Editor in the document window is where you build pages, bringing in the content as objects from the Objects palette and Site window. Tables, layers, and GoLive's layout grid and its text boxes provide the containers for text, images, animations, and movies. It's a good idea to spend some time setting up your site in GoLive so you can gather the assets you want to incorporate on your website. See Chapter 40, "Creating a Website with GoLive," for details on setting up your site.

The following are available designs:

  • Basic HTML Design: You can still build web pages using basic HTML top-down design, as shown in Figure 35.6. Simply type text into the layout editor's window and insert elements like images, links, and horizontal lines from the Basic Objects palette.

    Figure 35.6. A basic HTML page in a top-down design.


  • Table-based Design: Tables are commonly used to create web pages because nearly all web browsers support them. In GoLive you can build your pages with tables using two methods. Use the standard HTML table format to input your page content into table cells, rows, and columns, as shown in Figure 35.7, or use GoLive's layout grid, as shown in Figure 35.8. The GoLive layout grid creates a table for all intents and purposes, but it enables you to create the table by positioning grids on your page and then adding embedded grids, text boxes, images, and other media by freely positioning them on the grid. See "Using the Layout Grid" later in this chapter for details.

    Figure 35.7. Create a web page by adding content to table cells, rows, and columns.


    Figure 35.8. Use the layout grid to position your page elements in a table layout without the restrictions of tables.


  • Layer-based Design: You can use DHTML layers to position content on your page freely without the use of tables or grids. Layers are positioned based on the CSS DIV tag coordinates and can be overlapped to create special effects, as shown in Figure 35.9. You can incorporate layers with tables to create those cool rollover effects, making layers show and hide based on what your cursor is over. See "Using Layers" later in this chapter for more information.

    Figure 35.9. Layers lend themselves well to some forms of web design. In this example, a number of layers are positioned on top of each other with only a single layer visible at any time. Moving the cursor over the list on the left changes the content on the right by hiding one layer and showing another.


  • Photoshop, Imageready, InDesign, and Illustrator Design: You can easily incorporate web pages designed with the other applications in the Adobe Creative Suite. GoLive will arrange sliced Photoshop, ImageReady, and Illustrator graphics into tables, as shown in Figure 35.10, and even enable you to import Photoshop and InDesign layers into GoLive's layers, as shown in Figure 35.11. Drag any of the Creative Suite native files from the Site window onto your layout and GoLive automatically imports them as Smart Objects enabling you to modify and update your content easily. See Chapter 36, "Working with Images and Multimedia in GoLive."

    Figure 35.10. GoLive automatically places sliced images into table cells.


    Figure 35.11. Photoshop layers, shown here, are imported into separate layers in GoLive.


  • Frames-based Design: Another form of web page design that is used less and less frequently these days is frames-based design, as shown in Figure 35.12. Page layouts are designed using a series of frames gathered together by a frameset. GoLive offers all the tools and features needed to create frame-based content effectively. Creating frames and framesets is not covered in this book, but you can learn all you need to know about frames using GoLive's help files.

    Figure 35.12. In this example of a frames-based page, there are four frames, three of which contain scrollbars.


    Most web developers stay away from frames because many search engines ignore content using frames and frames pages cannot be bookmarked for later reference. Another drawback is the lack of support for framesets in applications that read web pages to users who are visually impaired.


  • CSS-based Design: You can incorporate Cascading Style Sheets (CSS) in any of the various GoLive design methods. Using external CSS files along with some internal CSS styles is the most effective method for creating a consistent layout and design format for your web pages. See Chapter 37, "Using Cascading Style Sheets in GoLive," to learn how to implement CSS in your work.




Special Edition Using Adobe Creative Suite 2
Special Edition Using Adobe Creative Suite 2
ISBN: 0789733676
EAN: 2147483647
Year: 2005
Pages: 426
Authors: Michael Smick

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net