• 1

Remove HTML spacers when exporting for web with Photoshop


I'm working for a company that has me create newsletters for them to send out via e-mail. I make them in Photoshop in order to achieve a more professional look, because other programs just don't do it for me (and the company prefers my Photoshop style anyway).

In order to make the different sections of the JPEG newsletter clickable, I divide them into slices, using the slice tool and assign the various URLs to each one. Then I use the Export for Web option to have Photoshop cut the image up and give me an HTML page with the newsletter in its final form.

All seems well in the rendered HTML page, but if I try to copy that HTML code and embed it into an e-mail, I get tiny 1px white spaces (known as spacers) in between each slice. My boss says it's no big deal, but it annoys the HELL out of me. I tried to remove them using Adobe Dreamweaver to edit the code, but the whole newsletter displays incorrectly if they get removed.

Does anyone know how I can export the HTML WITHOUT the spacers?

Share this post

Link to post
Share on other sites

2 answers to this question

Recommended Posts

  • 1

Can’t see this in Photoshop but in Fireworks under File > HTML Setup > Table Tab, there are options for “Nested tables, no spacers” and “Single table, no spacers”.

Not used them myself but it sounds like what you need.

alt text

  • Like 1

Share this post

Link to post
Share on other sites
  • 1

Hey Simon H,

Thanks, I tried messing around with the various export settings, but with no luck. Nonetheless, here's the most effective solution I've found so far:

1) Choose "Export For Web" and input the desired dimensions (if you're resizing before export)

2) Export as "Images Only" in either JPEG or GIF

3) Load up DreamWeaver CS6 (or newer) and quickly slam down some HTML tables, corresponding to the layout of your newsletter (or whatever it's gonna be)

4) Upload the exported images to your preferred file hosting services and insert each image into its corresponding part of the HTML table

5) Save your file as an HTML

6) Open the saved HTML to make sure everything is working fine

7) [OPTIONAL] Copy all the HTML code and use an e-mail manager that supports HTML e-mails (like Thunderbird) to send out the newsletter (or whatever it is) to your desired addresses

Hope this helps out anyone who's been having the same struggles I have!

P.S.: Yes, it IS worth spending 20-30 minutes to learn how to properly code HTML tables and to have them work the way you want - you never know when you're gonna need this valuable knowledge!

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Who's Online   0 Members, 0 Anonymous, 16 Guests (See full list)

    There are no registered users currently online