The Instant Web Page

Any designer who has created graphics for the web using Photoshop knows how tedious it can be to move ideas from a single Photoshop file to a collection of web-friendly GIF or JPG files. And all web programmers know how difficult it can be to get those graphics to appear in the correct positions on the resulting web page.

With PhotoWebber it is no longer necessary to chop Photoshop files into little pieces and reassemble them manually in an HTML editor. PhotoWebber translates layered Photoshop files directly into matching HTML layouts effortlessly.

In this tutorial you will import a Photoshop file and build an interactive web page in just two steps.

1. Start PhotoWebber and Import your Photoshop file.

From the File menu, select Import Graphics.

Choose the Photoshop file named TUTORIAL1.PSD in the PhotoWebberSampleFiles folder, and click Open.

 

Tip: PhotoWebber takes advantage of the information in your Photoshop file to automatically set up your web page:

  • Auto Button Creation allows PhotoWebber to use Photoshop layer names to automatically generate JavaScript buttons and menus.
  • Solid color Photoshop background layers are converted to the page background color.
  • Solid color rectangular layers are converted to Color Areas (table or layer background colors).

2. Build your page and view the results in your web browser:

From the Output menu, select Build All.

PhotoWebber will prompt you to select a Site Folder. The Site Folder is the folder in which PhotoWebber will build the HTML and graphics files for the web page.

Select Set from the Build Where window and choose a Site Folder.

Click OK to build the page.

 

 

To view the new web page you've just created, run your browser and open the file named index.html in the Site Folder.

Note: You can also preview the page before you build the final files. From the File menu select Preview, Default Browser. PhotoWebber will build a temporary copy of the page and open it in your default browser.

 

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.