making scanned drawings transparent

C
Posted By
ctjdavies
Jan 8, 2004
Views
624
Replies
12
Status
Closed
Hi there,
I have scanned some technical drawings that I’d like to build in to my webpage. I would like to convert the white background to transparent to let the background colour of my webpage be seen behind the drawing. How do I do that? Any help is appreciated.

Master Retouching Hair

Learn how to rescue details, remove flyaways, add volume, and enhance the definition of hair in any photo. We break down every tool and technique in Photoshop to get picture-perfect hair, every time.

G
Glenn
Jan 8, 2004
A little cheat is to change the white backgound to the color of your web page background.

"CTJDavies" wrote in message
Hi there,
I have scanned some technical drawings that I’d like to build in to my
webpage.
I would like to convert the white background to transparent to let the background colour of my webpage be seen behind the drawing. How do I do
that?
Any help is appreciated.
M
Mike
Jan 8, 2004
in article , CTJDavies at
wrote on 1/8/04 12:35 PM:

Hi there,
I have scanned some technical drawings that I’d like to build in to my webpage.
I would like to convert the white background to transparent to let the background colour of my webpage be seen behind the drawing. How do I do that? Any help is appreciated.

Change the white to the same color as your web page.

duh…
C
ctjdavies
Jan 8, 2004
From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!
I’m building my webpage using Netscape Composer. I edit my graphics with Photoshop. I tried changing the background colour of my plans to the colour of my webpage, but even if I get the reds, greens and blue dead on as far as the numbers go, there always is a (more than) slight difference when viewing the page using Netscape.
That didn’t quite work as good as I thought it would.
Making the background transparent would be great. That way I could just place the drawing into Netscape.
DN
Debeuf Nikolaas
Jan 8, 2004
Are you using the monitors RGB -sRGB IEC61966-2.1 working space for both your websitebackground and your graphic ?
Normally the colors should be consistant.
If not, you can convert the colorspace of both your images into the same workspace as written above.

hope this helps

"CTJDavies" schreef in bericht
From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!
I’m building my webpage using Netscape Composer. I edit my graphics with Photoshop. I tried changing the background colour of my plans to the
colour of
my webpage, but even if I get the reds, greens and blue dead on as far as
the
numbers go, there always is a (more than) slight difference when viewing
the
page using Netscape.
That didn’t quite work as good as I thought it would.
Making the background transparent would be great. That way I could just
place
the drawing into Netscape.
J
jonz
Jan 8, 2004
CTJDavies wrote:

From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!
I’m building my webpage using Netscape Composer. I edit my graphics with Photoshop. I tried changing the background colour of my plans to the colour of my webpage, but even if I get the reds, greens and blue dead on as far as the numbers go, there always is a (more than) slight difference when viewing the page using Netscape.
That didn’t quite work as good as I thought it would.
Making the background transparent would be great. That way I could just place the drawing into Netscape.

How about exporting to .PNG ? Are U using PS, you`ll find it under "help">Export transparant. First you have to select the area to be made transparent…

Jon
M
Mike
Jan 8, 2004
in article , CTJDavies at
wrote on 1/8/04 2:19 PM:

From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!

No you have not done that.

If you use a little square of color from the background of your drawings and use that little square of color as your background on your web page then there can be no difference in the colors.

DUH.
H
Hecate
Jan 9, 2004
On Thu, 8 Jan 2004 23:56:10 +0100, (Jon
Zickfeldt) wrote:

CTJDavies wrote:

From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!
I’m building my webpage using Netscape Composer. I edit my graphics with Photoshop. I tried changing the background colour of my plans to the colour of my webpage, but even if I get the reds, greens and blue dead on as far as the numbers go, there always is a (more than) slight difference when viewing the page using Netscape.
That didn’t quite work as good as I thought it would.
Making the background transparent would be great. That way I could just place the drawing into Netscape.

How about exporting to .PNG ? Are U using PS, you`ll find it under "help">Export transparant. First you have to select the area to be made transparent…
No. Use gif unless you want everyone using IE to be unable to see the graphic.

If the background is white then it’s a trivial matter to make the image into a layer, then select white and delete it. It’s all in the help files/manual.



Hecate

veni, vidi, reliqui
S
steven
Jan 9, 2004
OK Mr. Duh, you’re squabbling over the wrong issue. Replacing the white with some background color is not what he wants to do, so just let it go… Besides, it takes a lot of work to redo all your pictures if you decide to change your background.

In answer to the question, it would probably be best to save your pictures in .gif format, which supports transparency. You said they are technical drawings, so I assume they are not color intensive (.gifs have a 256 color limit). I would recommend .png, except that as far as I’ve seen, the transparency doesn’t work in Internet Explorer.

So, to convert:

Image > Mode > Indexed Color. There are a couple of options for choosing the color palette. You can play with those, but make sure Transparency is checked.

Image > Mode > Color Table. This shows the palette of colors you chose. Select the eyedropper, then click the color on the image itself that you want to be transparent (in this case, the white background). This will change everything that is that color in the image transparent, so be careful there is not white somewhere in the interior that you want to remain opaque.

File > Save As > technicaldrawing.gif

Or if you’re really adventurous, you can try "File > Save for Web". There are more options for optimizing .gif files there.

As for DuhMike, I guess ignorance is not bliss, huh?

-Steven

"mike" wrote in message
in article , CTJDavies at
wrote on 1/8/04 2:19 PM:

From: mike

Change the white to the same color as your web page.

duh…

ok…been there, done that!

No you have not done that.

If you use a little square of color from the background of your drawings
and
use that little square of color as your background on your web page then there can be no difference in the colors.

DUH.

C
Combaticus
Jan 9, 2004
in article fOnLb.1786$ wrote
on 1/8/04 5:51 PM:

OK Mr. Duh, you’re squabbling over the wrong issue. Replacing the white with some background color is not what he wants to do…

He wants his drawing’s background to match his web page backgrounds.

Easy.

Grab a chunk of the background color from the graphic and make that color your web page color.

Easy.

Now move on.

":^) ®
M
mscir
Jan 9, 2004
http://www.cybia.co.uk/alpha.htm

AlphaWorks : 20 free Photoshop-compatible plug-in filters for producing various transparency effects.

Combaticus wrote:

in article fOnLb.1786$ wrote
on 1/8/04 5:51 PM:

OK Mr. Duh, you’re squabbling over the wrong issue. Replacing the white with some background color is not what he wants to do…

He wants his drawing’s background to match his web page backgrounds.
Easy.

Grab a chunk of the background color from the graphic and make that color your web page color.

Easy.

Now move on.

":^) ®

B
brucewj
Jan 9, 2004
This is probably the fastest way I know of to do what you want and it isn’t permanent if you need the original again.

From the Layers Window (Window > Layers) do the following.

Make sure the drawing is not the "Background" layer. If it is double click on the Layer in the the "Layers" Window to convert it from a "Background" layer to one that can have transparency.

Double click on the Layer in the "Layers" Window and it will open the "Layer Styles" Window "Blending Options".

Use the right slider on the "This Layer" and move it towards the left. This will make the white transparent. Note: If you hold down the Alt key you can split the slider and it will allow you to soften the edge.

File > Save For Web
GIF
Transparency checked
Colors: 2, 4, 8
Note: The number of colors will depend on the image. You can use 2 but it might make the image look ragged but the file size will be smaller. You will have to decide what looks best.

Bruce

CTJDavies wrote:
Hi there,
I have scanned some technical drawings that I’d like to build in to my webpage. I would like to convert the white background to transparent to let the background colour of my webpage be seen behind the drawing. How do I do that? Any help is appreciated.
PF
Paul Furman
Jan 10, 2004
CTJDavies wrote:
Photoshop. I tried changing the background colour of my plans to the colour of my webpage, but even if I get the reds, greens and blue dead on as far as the numbers go, there always is a (more than) slight difference when viewing

JPEG format will change the color a little. Use GIF. A transparent image will probably look too jaggy, zoom in very very close and you will see grays at the edge that make it look smooth. A color matched background will allow the smooth edges like that.

Must-have mockup pack for every graphic designer 🔥🔥🔥

Easy-to-use drag-n-drop Photoshop scene creator with more than 2800 items.

Related Discussion Topics

Nice and short text about related topics in discussion sections