Finishing Steps in Adobe’s Bridge – Preparing for Web

Categories

Featured Products

Thank you to Daniel Hurtubise for this great post on using Bridge as part of your editing workflow.

Hi everyone, as you are reading that post I’m boarding a floating Cessna to our first location, the bear shooting in the Alaskan Wild. I might get internet access in between location changes since will be back overnight at Jim’s house. If so I’ll try to send you a few pictures of those magnificent animals.

Now onto our last (maybe not) Bridge/Workflow tutorial. Technically at this point you should be able to organize your library and apply Camera Raw modifications. Now it’s time to create a gallery so our client can view and choose their photos for further “development”. To do so will use the Output function.

Click on the Output to Web or PDF.

image002 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Your screen will then switch to something like this.

image003 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

First option is to choose which output; PDF or WEB. For this tutorial I will choose Web Gallery.

image004 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Then you need to select a template from the list.

image005 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

By clicking the Refresh Preview Button.

image006 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

You will get a preview of the template in the main window.

image007 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

You can also try a preview in the browser.

image008 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Note that the preview will be created with the amount of pictures selected. So if you select 3 you will get that.

image009 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

I suggest you stick to something like 3 to 5 to speed up the preview process.  Some Templates will have different Styles available.

image010 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Then you can fill the Site Info information.

image011 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

If you refresh the Preview you will see your changes applied.

image012 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

You can tell modify the display of the Gallery by changing the color for.

image013 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

And finally you can modify the layout.

image014 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

All you have left is to create it.

image015 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Pick a name(try to avoid spaces for Web Galley since some server are not too kind about it) and save it to your hard drive.  And click the save button.  Once completed you will get a folder that contains the index.html file and a folder resources. This is your new web page.

image016 Finishing Steps in Adobe's Bridge - Preparing for Web Guest Bloggers Photoshop Tips

Upload it to your website and it’s done.

Here’s the sample : (I only selected a few from the shooting)

And here are the final images:

So on that final note I’m gonna go get my bear repellent and try not to get eaten by one. Have a good time and I will see you soon.

MCPActions

No Comments

  1. MCP Actions on August 3, 2009 at 10:39 am

    Great info Daniel – have a great trip!!!

  2. amy little on August 3, 2009 at 12:27 pm

    Hi Daniel,Great info! I have a question, I use CS3 and in my Bridge, I could not see the “output to web or pdf” opton. is it not available in CS3 Bridge?

  3. JM on August 5, 2009 at 9:44 am

    The tutorial was great but next time can you please use family-friendly images?! 😉

  4. JM on August 5, 2009 at 10:10 am

    Great tutorial, but next time could you please use family-friendly images? Pretty please?! 😉

  5. JC on August 7, 2009 at 11:02 am

    great info….but…i am still learning…how do you upload it to your website?

  6. Online Dreamweaver Training on August 11, 2009 at 12:09 pm

    thanks for the tips, i think these really help out alot.

Leave a Comment

You must be logged in to post a comment.

Categories

Recent Posts