Optimizing Adobe Illustrator Files for the Web
Creating a Web Gallery with Photoshop
Try using Photoshop's Automate Web Photo Gallery to create your webpages. This feature is simple and fast. It automatically optimizes your images, creates both thumbnails and large images, and it generate individual webpages for each image.
Select the Web Photo Gallery to access this Dialog box below:
The Styles pull-down menu offer different styles of page layout designs. You can even choose a design that offers an email link.
To tell Photoshop where to find your images to create the Web Photo Gallery, you need to select "Choose" under "Source Images." Photoshop needs to know where the source images files are located. This will open a Window for you to navigate to the image source folder.
Navigate to the location where your source image folder is and select "Choose."
After you have designated the Source Image folder, you will need to choose the location of the "Destination" Folder.Photoshop needs to know where to place the newly generated files and images. Select the "Destination" button to open the Window below.
This is where you will create a "New Folder" on the desktop for Photoshop to place all the new web images and files.
Name this "New Folder" based on the exercise or project you are creating. Don't put spaces in this name because this is the name you will type to for the link to the main index page.
Once you have chosen the Source and Destination Folders, you can choose the different Options.This is where you can customize the size of your images, the color palette of your webpage and even a "Banner" where you can tell it to display your page title, your name and the date this page was generated.
Once you select all your customized options, click OK and
Photoshop will automatically generate and optimize all the images and thumbnails
and create the html pages.
The screen print below shows how Photoshop has set up separate folders to
hold images, thumbnails, and html pages, as well the index page which is
main menu for the web photo gallery.
Once Photoshop completes this Web Photo Gallery, you can link this folder's index.html to your main index page.
To create new links to your index template page, open it in Notepad or any HTML Text Editor. Go to View>Source to see the html coding.
Find the Project Title where you want to create the Link. Type the following html code to create the link. <p> <a href="PhotoCorrection/index.htm">Color Correction</a> </p>
Basic Tags to Know (to learn basic tags, Check out the Webmonkey Cheat sheet.
<a href="NAME"></a>
Links to that target location from elsewhere in the document
<html></html>
Creates an HTML document
Body Attributes
<body bgcolor=?>
Sets the background color, using name or hex value
Formatting
<p></p>
Creates a new paragraph
<p align=?>
Aligns a paragraph to the left, right, or center
Once your create the link to the Web Photo Gallery Index page, save your
page and drag and drop the revised index page to your ftp window.