Setting a blank JPEG color

N
Posted By
nomail
Jun 2, 2005
Views
485
Replies
19
Status
Closed
Pixmaker wrote:

Once again…the effects of those stupid pills are long lasting <G>
I want to create a blank JPEG that I can import to a web page. Sounds easy, right? Well, it is, but I have some really stupid problems.
I can create the JPEG of a given size and set it as transparent…no problem. But when I insert in it into my html document, it comes up white…it overlays the black background. Help!

That’s normal. JPEG doesn’t support transparency. Why don’t you use PNG instead?

OK, sez I…just create a sized JPEG and color it black. (Black is black, right?) Sounds like a good idea? (I’d prefer transparent but…)

I don’t know how to color a blank JPEG white! I select the bg and choose a color (black’s a color, like round is a shape) but nothing happens. I can’t seem to get a solid black JPEG.

Menu ‘Edit – Fill’


Johan W. Elzenga johan<<at>>johanfoto.nl Editor / Photographer http://www.johanfoto.nl/

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.

BH
Bill Hilton
Jun 2, 2005
I can create the JPEG of a given size and set it as transparent…no problem. But when I insert in it into my html document, it comes up white…it overlays the black background. Help!

Any reason why you’re not using gif format instead of jpeg? Should be easy to do what you describe with a gif.
T
thisisnota
Jun 2, 2005
yep

go the .gif

"Pixmaker" wrote in message
Once again…the effects of those stupid pills are long lasting <G>
I want to create a blank JPEG that I can import to a web page. Sounds easy, right? Well, it is, but I have some really stupid problems.
I can create the JPEG of a given size and set it as transparent…no problem. But when I insert in it into my html document, it comes up white…it overlays the black background. Help!

OK, sez I…just create a sized JPEG and color it black. (Black is black, right?) Sounds like a good idea? (I’d prefer transparent but…)

I don’t know how to color a blank JPEG white! I select the bg and choose a color (black’s a color, like round is a shape) but nothing happens. I can’t seem to get a solid black JPEG.

Please help!

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
BH
Bill Hilton
Jun 2, 2005
Any reason why you’re not using gif format instead of jpeg?

Dave replies …

The only reason, as I recall, is that a programmer I know sez to use JPEG’s, they work better.

jpegs are better for photos but gifs are better for line art etc, things which have fewer colors (you are limited to 256 colors in gif but 16.7 million colors with jpegs).

Gifs allow transparency easily, unlike jpegs.

OK, I’ll try GIF (it’s easy enough) but I’m having other problems getting the solid-color jpegs to load into my web page.

This is another problem with jpegs, trying to do solid color … when you do the jpeg compression you’ll probably get dithering and the ‘solid color’ may not look solid at all. With a gif you can reduce the palette from 256 down to a small number of colors (one color, if all you really have a ‘solid color’) so there is no dithering and the file size becomes very small. (If you do this it’s probably a good idea to use the ‘web-safe’ color subset to make sure that color reproduces correctly on current browsers).

To repeat the main point, jpegs are definitely better for photographs but gifs are better for many non-photo images, especially for those with limited colors. Also gif makes it easier to make part of the image transparent. For what you’re trying to do gif would be a better choice.

Bill
T
Tacit
Jun 2, 2005
In article ,
Pixmaker wrote:

I don’t know how to color a blank JPEG white! I select the bg and choose a color (black’s a color, like round is a shape) but nothing happens. I can’t seem to get a solid black JPEG.

Select all.
Set the foreground color as the color you want to fill the JPEG. Hold down the ALT key on the keyboard and press Delete. ALT-Delete means "Fill with foreground color."


Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
T
Tacit
Jun 2, 2005
In article ,
Pixmaker wrote:

The only reason, as I recall, is that a programmer I know sez to use JPEG’s, they work better.

You need to talk to that programmer and set him straight.

JPEG and GIF are used for different purposes. GIF can be transparent, JPEG can’t. A GIF can contain only 256 colors; JPEG can contain millions of colors.

What does that mean?

It means GIF is better if the image must be transparent, or if the image contains flat color, such as with a diagram or a cartoon. A JPEG is better if the image is a photograph. Neither is "better" all the time; each is used for different purposes.

If you just want a single transparent image, GIF is best.


Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
T
Tacit
Jun 2, 2005
In article ,
"Bill Hilton" wrote:

This is another problem with jpegs, trying to do solid color … when you do the jpeg compression you’ll probably get dithering and the ‘solid color’ may not look solid at all.

JPEGs do not dither.

When you take a solid color JPEG and compress it, you may notice that it is no longer a solid color. This is not because of dithering. It is because JPEGs use "lossy’ compression–image information is discarded and the quality of the image is deliberately degraded in order to make the file size smaller. the math behind the way the image is degraded is quite complex, but one consequence of this degradation is that solid colors may not be solid any more.


Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
J
johnboy
Jun 2, 2005
"Johan W. Elzenga" wrote in message

That’s normal. JPEG doesn’t support transparency. Why don’t you use PNG instead?

PNG isn’t well supported by MS Explorer. GIF is better, of course, and if it used as a spacer, a 1-pixel square is best because it can be sized to any dimension.
P
pixmaker
Jun 2, 2005
Once again…the effects of those stupid pills are long lasting <G>

I want to create a blank JPEG that I can import to a web page. Sounds easy, right? Well, it is, but I have some really stupid problems.

I can create the JPEG of a given size and set it as transparent…no problem. But when I insert in it into my html document, it comes up white…it overlays the black background. Help!

OK, sez I…just create a sized JPEG and color it black. (Black is black, right?) Sounds like a good idea? (I’d prefer transparent but…)

I don’t know how to color a blank JPEG white! I select the bg and choose a color (black’s a color, like round is a shape) but nothing happens. I can’t seem to get a solid black JPEG.

Please help!

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
J
johnboy
Jun 2, 2005
"Pixmaker" wrote in message
That’s exactly why I’m having these problems. I need spacers for my splash page.

After all these years using Pagemaker and its easy positioning, it’s like re-entering kindergarten to position objects in html!

Patience. 🙂 There is a lot more you can do with CSS styles. If you want total control, you have to go there.

What do you mean by a one-pixel spacer and resizing? It seems easy enough to create what I want in PS directly.

All you need for all your spacers is a single one-pixel transparent GIF. When you place it into an html document, specify the size you wish it to be, from 1 pixel square on up. Try it. Give it a size of 1042×50 pixels, for example. Cool, eh? One tiny file loaded only once and used in many sizes with no additional overhead.

If you use Dreamweaver MX, it can create the spacer gif file for you.
P
pixmaker
Jun 2, 2005
The only reason, as I recall, is that a programmer I know sez to use JPEG’s, they work better.

I know, doesn’t make sense to me ’cause GIF is smaller and better for graphics as I understand.

OK, I’ll try GIF (it’s easy enough) but I’m having other problems getting the solid-color jpegs to load into my web page.

I’m really just learning so thanks for your patience.

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
O
Odysseus
Jun 2, 2005
In article ,
Pixmaker wrote:

<snip>
My logo is three colors: black, gray and red. Any problems here with GIF?

Shouldn’t be. In fact, depending on the amount of anti-aliasing between the colours, you can probably get away with an 4- to 16-colour (two- to four-bit) palette, reducing the file size even more. The "Save for Web" hook from Photoshop to ImageReady is a convenient way to experiment with various settings, with fairly immediate feedback on how they affect the file size and quality.


Odysseus
T
Tacit
Jun 2, 2005
In article ,
Pixmaker wrote:

That’s exactly why I need to solve this problem. After years of Pagemaker and its easy (and logical) positioning, trying to position objects in html is like re-entering kindergarten!

The preferred way to position objects in HTML is with a table (works in all browsers) or with style sheets (works in most, but not all, browsers).


Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
P
pixmaker
Jun 2, 2005
THANK YOU ALL!

What a great ng. It looks like my problems are on the way to solution.

I like the idea of a very small file for fast loading. For all the reasons cited, GIF seems to be the way to go. Indeed, I have seen problems with jpegs failing to load or loading with strange spacing and/or colors, especially with graphic images. (Stupid pills, remember?)

Question:

My logo is three colors: black, gray and red. Any problems here with GIF?

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
J
johnboy
Jun 2, 2005
"tacit" wrote in message
In article ,
Pixmaker wrote:

That’s exactly why I need to solve this problem. After years of Pagemaker and its easy (and logical) positioning, trying to position objects in html is like re-entering kindergarten!

The preferred way to position objects in HTML is with a table (works in all browsers) or with style sheets (works in most, but not all, browsers).

No. Divs. Tables in tables only using CSS. Same with layers.
P
pixmaker
Jun 2, 2005
That’s exactly why I’m having these problems. I need spacers for my splash page.

After all these years using Pagemaker and its easy positioning, it’s like re-entering kindergarten to position objects in html!

What do you mean by a one-pixel spacer and resizing? It seems easy enough to create what I want in PS directly.

If I use a one-pixel black, for example, do you mean I can specify the dimensions in html, tables and it will then open up to whatever I set, without problems?
DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
P
pixmaker
Jun 2, 2005
That’s exactly why I need to solve this problem. After years of Pagemaker and its easy (and logical) positioning, trying to position objects in html is like re-entering kindergarten!

I think much of my problem is that I’m in a hurry and don’t have the patience I once had.

The one-pixel comment intrigues me. Do you mean that I can create a black gif that’s one pixel by one pixel (funny statement) and then resize it with the dimensioning statements in, say, tables? That means it would expand precisely to fill the allocated space and would be the smallest possible file. Now, that’s efficiency!

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================
OA
Ohan Armoudian
Jun 3, 2005
Davein, what you are asking (to put transparent spacer between your tables or in a cell) is very easy, I use them all the time to all my pages so my cell or table does not change from different browsers. If you are using Microsoft FrontPage for creating web site, all you have to do is create white spacer the same size as the cell and save the spacer Giff or Jpeg and Import it in the image folder and when you insert the spacer on the spot where belongs go to image (spacer) property and change it as transparent and the spacer will disappear.
I hope this helps….

Ohan

"Pixmaker" wrote in message
THANK YOU ALL!

What a great ng. It looks like my problems are on the way to solution.
I like the idea of a very small file for fast loading. For all the reasons cited, GIF seems to be the way to go. Indeed, I have seen problems with jpegs failing to load or loading with strange spacing and/or colors, especially with graphic images. (Stupid pills, remember?)

Question:

My logo is three colors: black, gray and red. Any problems here with GIF?

DaveinFLL
==========================
It’s not the heat, it’s the humidity
==========================
(Think the humidity’s bad?
You should watch us vote!)
==========================

—-== Posted via Newsfeeds.Com – Unlimited-Uncensored-Secure Usenet News==—- http://www.newsfeeds.com The #1 Newsgroup Service in the World! 120,000+ Newsgroups —-= East and West-Coast Server Farms – Total Privacy via Encryption =—-
TT
Tom Thomas
Jun 3, 2005
"johnboy" wrote:

All you need for all your spacers is a single one-pixel transparent GIF. When you place it into an html document, specify the size you wish it to be, from 1 pixel square on up. Try it. Give it a size of 1042×50 pixels, for example. Cool, eh? One tiny file loaded only once and used in many sizes with no additional overhead.

It’s probably a better practice to leave the single pixel GIF sized as it is and use the hspace and vspace tags to create your spacer. Some people leave image "placeholders" turned on in their browsers, and using HTML to resize the image (as opposed to just placing space around it) causes the placeholders to appear at the same size as your resized image.
——————
Tom

Unsolicited advertisements cheerfully ignored.
C
Chris
Jun 3, 2005
In article ,
Tom Thomas wrote:

"johnboy" wrote:

All you need for all your spacers is a single one-pixel transparent GIF. When you place it into an html document, specify the size you wish it to be, from 1 pixel square on up. Try it. Give it a size of 1042×50 pixels, for example. Cool, eh? One tiny file loaded only once and used in many sizes with no additional overhead.

It’s probably a better practice to leave the single pixel GIF sized as it is and use the hspace and vspace tags to create your spacer. Some people leave image "placeholders" turned on in their browsers, and using HTML to resize the image (as opposed to just placing space around it) causes the placeholders to appear at the same size as your resized image.
——————
Tom

Unsolicited advertisements cheerfully ignored.

Except when you need pixel-precise positioning. To push some HTML object over by 4 pixels with a 1 px GIF, you set the GIF’s size to 4 pixels. Try that using HSPACE. You can’t. The HSPACE works *around* the pixel, so HSPACE=1 gives you 3 pixels of push (1 for the GIF, 1 on each side of the GIF). HSPACE=2 gives you 5 pixels of push.

A 1-pixel image is 42 bytes, and will load nearly instantly. Placeholders, for the brief time they appear, shouldn’t be a problem, save for pages that are way overloaded (and then your problem isn’t the 1-pixel GIF).


C

How to Improve Photoshop Performance

Learn how to optimize Photoshop for maximum speed, troubleshoot common issues, and keep your projects organized so that you can work faster than ever before!

Related Discussion Topics

Nice and short text about related topics in discussion sections