TIP 200: Diagramming New Sites


You're probably used to drawing out site maps (on paper or with the computer) and then regenerating the file structure in HTML. Put those late nights of confusion and chaos to an end with the powerful diagramming features in GoLive. Actually, GoLive offers three different site-mapping modes, so let's start by explaining the different options.

Navigation View

Choose View > Site Tabs > Navigation to open the Navigation view of a site. The Navigation view generates a visual site map for an existing site based on a combination of the folder structure and the hyperlinks between the pages (Figure 200a). To customize the orientation and presentation of the map, use the variety of options in the View palette. Using the Navigation, Display, and Filter options, you can really customize the site map to look any way you want. To add pages to the site in this view, simply drag pages from the Objects or Library palette.

Figure 200a. Use the Navigation view to get a hierarchical site map view of an existing site.


Links View

The Links view is grouped together with the Navigation view and is accessed by choosing View > Site Tabs > Links. The Links view is an interesting way of examining existing sites to better understand all the link relationships between various files (Figure 200b). It's sort of like a more intense version of the In & Out Links palette (see Tip 201). To customize the presentation and options for the Links view, make changes to the settings in the View palette. If the Links view starts to get unwieldy, turn on the Panorama pane so you can easily navigate around the site. Turn on the Reference pane to see which files a selected page references.

Figure 200b. The Links view is like the In & Out Links palette on steroids.


Creating Hyperlinked Site Maps

To create a hyperlinked site map, choose Diagram > Create Table of Contents when the Navigation view is open. Any pages that are visible in the Navigation view (click the plus icons) will be included in the site map.


Diagrams

The first two views are for existing sites, but Diagrams are for mapping out new sites or new sections of existing sites.

1.

To create a new diagram, choose Diagram > New Diagram and give it a name when prompted (Figure 200c). The new diagram will be added to the Extras tab of the Site window, and the easiest way to open it is to select its name from the Diagram > Diagrams submenu.

Figure 200c. Create a new diagram, name it, and open it with the Diagram menu.


Bonus Tip

The file extension for diagrams is .aglsd, which is short for Adobe GoLive Site Diagram.

2.

So that GoLive knows how the new diagram fits in with the rest of the site, you need to add an anchor page to the diagram. To add an anchor page, drag the home page or any other page in the Files tab of the Site window into the diagram window (Figure 200d). Notice the anchor page has the special anchor icon next to it in the diagram window.

Figure 200d. Drag and drop a page from the Site window to create an anchor page.


3.

Now plan out the rest of the site map by dragging objects from the Diagram section of the Objects palette into the diagram window. You can add basic objects such as pages, sections, and groups as well as advanced objects including references to wireless content, server-side scripts, and multimedia content (Figure 200e).

Figure 200e. Use objects from the Diagram section of the Objects palette to build your site map.


4.

Use the Point and Shoot (Fetch URL) tool next to any files in the diagram window to create link relationships between multiple files.

5.

After the organization of the site map is complete, you can assign templates (see Tip 133) to the pages to accelerate the rest of the site design process. Just select a page in the diagram, open the Page tab of the Inspector, and choose a template in the Template pull-down menu (Figure 200f).

Figure 200f. Assign a template to the pages in the diagram before submitting them into the site.


6.

Before you're done with the site map, you can customize the presentation of the diagram using all the options in the View palette (Figure 200g). The variety of controls is utterly amazing. You also might want to customize the diagram by putting your company logo or the name of the project on the diagram using the Master tab of the diagram window.

Figure 200g. Adjust the Design and Display settings for the diagram in the View palette.


7.

When you're ready to start adding content to the pages in your diagram, click Diagram > Staging> Submit All and watch GoLive move all the pages from the diagram into the Files tab of the Site window. It's incredible how much time this can save you, but even more amazing is the fact that all the links and references within all your pages and templates are updated perfectly by GoLive. By default, pages in a diagram are submitted to the top level of the Site window, but you can control this behavior. Before you submit a diagram, select files and sections in the diagram window and name a folder in the Folder or Target Dir(ectory) fields in the Inspector (Figure 200h).

Figure 200h. Assign the target directories for the diagram pages in the Inspector palette.


Exporting Site Maps to PDF

Choose File > Export > Diagram, select PDF in the format pull-down menu, and click OK. This turns your diagram into an Adobe PDF that anybody can view with the free Adobe Reader. It's a great way to get feedback and approval on a project before it starts.


8.

If you change your mind after you submit a diagram and want to try a different design idea or navigation bar, you can recall all the pages of a diagram. Just select Diagram > Staging > Recall All and try a different approach.



    Adobe GoLive CS2 Tips and Tricks The 250 Best
    Adobe GoLive CS2 Tips and Tricks The 250 Best
    ISBN: B008CMGJS0
    EAN: N/A
    Year: 2005
    Pages: 301

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