Creating, Saving, and Building Documents

PhotoWebber is the conduit between your Photoshop designs and final web pages. PhotoWebber files are called sessions. These files contain instructions on interpreting Photoshop layers and combining them with other graphics that have been imported, adding enhancements such as joining layers and creating buttons, and optimizing files for output and viewing in web browsers.

Creating New Files

Saving Your Work

Opening Files

Previewing and Building Pages

 

Creating New Files

Top

The first step in creating a web page with PhotoWebber is designing your page in Photoshop. Because PhotoWebber directly translates Photoshop files into matching HTML layouts, you don't have to worry that your designs will not be interpreted properly.

Once your Photoshop page design is complete, you are ready to start working in PhotoWebber. When you run PhotoWebber, a blank Document window opens (along with associated Layers, Properties, and Warnings windows). At this point, you can either import graphics and build a new web page, or open a file that you created in PhotoWebber previously. You can also create a new file at any time.

To create a new file, select File, New and choose Style Sheet Aligned Web Page or Table Aligned Web Page.

To ensure that the page you build matches your Photoshop layout in your browser, you must select the correct layout option.

  • If you are certain that your site visitors will be using browser versions 4.0 or higher, select Style Sheet alignment.
  • If your visitors will be using 3.0 or lower browsers, or if you do not know what browsers your site visitors use, select Table alignment.

Note: You can switch between Style Sheet and Table alignment at any time.

Saving Your Work

Top

When you save PhotoWebber Session files, you are saving the instructions for converting the imported Photoshop file to a web page. You are also saving any changes you have made to Settings, Preferences, or Properties and instructions for including other graphics files that have been imported.

In short, the PhotoWebber Session file includes:

  • Information about graphics you import
    and
  • Any information you enter in PhotoWebber
What's saved in a PhotoWebber Session file? What's not saved in a PhotoWebber Session file?
A list of imported Photoshop layers and the location of Photoshop files (layers may be imported from any number of Photoshop files). The actual graphics.
A list of imported and linked GIF and JPEG files with the location each imported file. The actual graphics.
Hyperlinks assigned to layers and text. Hyperlinks history list.
Any information entered in the Properties Window.  
The names of graphics files, HTML files and folders created or changed on the Output View tab. The actual web graphics and HTML files. These are created when you build the page.
Text created in PhotoWebber. Photoshop text layers (see above).
Definitions of Color Areas and Placeholders as well as any HTML added to Placeholders. The location of HTML files assigned to Frame Placeholders. HTML code used in a Frame Placeholder.

To save a PhotoWebber Session file or to save a file with a new name:

  1. Select File, Save As.
  2. Choose a folder.
  3. Type in a name for the file (in Windows, the .PWS file extension is automatically added).
  4. Click Save.

To save changes to an existing file:

  • Select File, Save.

To close a file:

  • Select File, Close
    or
    Click the close button on the document window.

This closes the file and clears any related info from the Layers, Properties, and Warnings windows. If you close a PhotoWebber session that has not been saved, PhotoWebber will prompt you to save your work.

  • Select Save to save your work and close the file.
  • Select Don't Save to close the file without saving your work.
  • Select Cancel to return to your work without closing the file.

Opening Files

Top

Opening PhotoWebber Files

To continue working on a project, you can open a PhotoWebber Session file that you created previously.

To open a PhotoWebber Session file:

  1. Select File, Open.
  2. Choose the folder containing the file.
  3. Click the file name or icon.
  4. Click Open.
  5. PhotoWebber locates and opens all imported graphics.
  6. Warnings are regenerated. Any warnings that have been resolved will not be regenerated.

To remove all changes made to a session since it was last saved:

  • Select File, Revert.

The PhotoWebber file reverts to the previously saved version. That is, all changes you have made since the last time you saved the file — or since you opened the file if you have not saved changes in the current work session — are lost. Be sure this is what you want to do as there is no way to reverse this action.

Note: You cannot select Revert if you have not yet saved a new PhotoWebber file.

Opening Photoshop Files

You import Photoshop layers to PhotoWebber, you do not open the Photoshop file itself.

When you import graphics, PhotoWebber does not create or save a copy of these elements in the PhotoWebber file. It maintains pointers to the locations of the source files on your hard drive.

When you open a PhotoWebber Session file, PhotoWebber first checks the original location of the imported graphics. If the file(s) are not found in their original locations, PhotoWebber will check in the folder containing the PhotoWebber Session file. If the file is not found in either of these locations, PhotoWebber prompts you for its location.

If you move or rename a source file, PhotoWebber prompts you for its location the next time you open the file that includes that graphic. Click OK and select the correct file from your hard drive.

If you delete a source file, PhotoWebber has no way to reference those layers and they no longer appear in the Document window or Layers list.

If you change a source file, several things may occur:
  • If you make changes to Photoshop layers, those changes are automatically reflected in PhotoWebber when you open the PhotoWebber session file.
  • If you add layers to a Photoshop file, the new layers are not automatically imported. You must import these layers.
  • If you delete layers from a Photoshop file, they are also deleted in PhotoWebber.
  • If you rename layers in Photoshop, they are deleted in PhotoWebber. You must re-import these layers.

See Working with Graphics for instructions on importing individual Photoshop layers.

Previewing and Building Pages

Top

After you import your Photoshop file and other necessary graphics, you are ready to build your page.

Previewing your Work

PhotoWebber allows you to preview your work before building the final web pages:

  • To preview buttons, rollovers and pop-up menus in PhotoWebber, select the Interactivity Preview Tool and then point to the buttons in the Document window.
  • To preview the page in your default browser, select File, Preview, Default Browser. PhotoWebber builds a temporary copy of your page and opens it in the browser.
  • To preview the page in a different browser, select File, Preview, and choose a browser from the list. (To add other browsers, see Settings & Preferences.)

Building Finished Pages

When you are satisfied that you have finished defining all of the appropriate Properties and Settings for the current page, build the final HTML and web graphics files:

To build a web page, select Output, Build All.

If you have not defined a Root Folder, PhotoWebber prompts you to do so. Select Set from the Build Where? window and choose a folder for your HTML and graphics files.

Top

Copyright © 2000 - 2001 Media Lab, Inc. All rights reserved.
PhotoWebber is a trademark of Media Lab. Photoshop is a registered trademark and GoLive is a trademark of Adobe Systems Incorporated.
All other trade names are trademarks of their respective owners.