Saving images so they are clear and sharp

[Bill Gass]

Hey all,

Still using word for my web page because it's free and easy to use.

On my web site it seems I get some sharp pictures loaded up sometimes but a lot of them are also blurry as well. Many years ago you didn't want a very big picture or file size, maybe 200-500k but now, 1 meg files are no problem. Just trying to figure out a good file size and how to get clear and sharp pictures loaded up, all the time. I have the newest version of photoshop/lightroom. Any suggestions or do you think word is a factor ?   website is, [removed]

.

Also, maybe the WSFTP program has to do with quality/clarity.

Thanks-

-Bill-

[Dan Rodney]

Filesizes will vary, so focus more on the pixel width and height.. The factors that affect image quality are:

1. the pixel width and height of the image
2. the size the image is coded into the webpage

You say you're using Word, but I assume that means WordPress (as opposite to Microsoft Word). You should be able to upload large images and have it scale them for you. How it scales/sizes the images depends on your theme, WordPress settings, and possible plugins.

[Bill Gass]

Thanks Dan-

I am using Microsoft Word for my website. When I bought Microsoft Office like 15/20 or more years ago it came with a web page making program and I have used that for the whole time. I think someday I need to move on to something else but not there yet.

.

So for you, Per Bernsten & Chris 486...This is what I do.

I open a picture in PS, raw or jpef, straighten it out if needed then I click on the top on top to view image 100%, then I click on Image Tab, Image Size, type in 1400 for the width and let the height be whatever it populates to. That makes the image about 2.99 megs. I then adjust color a little, sharpen a little and one or two adjustments and save it.

.

I do know what you mean by when I put a larger file in Word it will let me change it's size in there as well but I'd like to not do that and I think it messes with it's file size.

.

When I type in 72dpi it makes a picture that is maybe a 1/4" in size.

[Bill Gass]

Sorry, I meant jpeg, not jpef...

[Chris 486]

In addition to @Dan Rodney 's comments, also make sure your file size is 72 ppi. Let us know if those help shrink your file size or if you are running into other issues.

[Per Berntsen]

The ppi value has no effect whatsoever on file size or image quality.

For screen viewing, an image will display according to its pixel dimension, regardless of the ppi value.

Exporting will strip out the ppi value because it is not required for screen viewing.

Ppi (pixels per inch) is optional metadata, used by printer drivers to calculate physical dimensions.

Pixel dimensions divided by ppi = printed dimensions in inches.

When printing a 72 ppi image, the printer will use 72 image pixels to print one inch on paper.

900 x 601 pixels, 1 ppi, 239 kb

900 x 601 pixels, 600 ppi, 239 kb

[Lumigraphics]

I keep my exports under 300k for a 960px JPEG and they turn out great. I'd be suspicious of using Word for a website, and if images are resized in your layout they may very well look bad.

[Bill Gass]

Ok, thanks.

Will give that a shot as well Lumigraphics.

I agree on word but some don't look bad but I'm all over the place file size wise and need to get to one size and process for all that works, is sharp and clear, and maybe smaller I guess.

[Bill Gass]

So, I did 2 different file saves in PS...

1136 x 775, Res: 144p/i & 2.05megs.

1366 x 932, Res: 72 p/i @ 3.64 megs.

The first file looks good but a little smaller than I'd like, the second was 3x bigger...

.

My web page loads up 1 (one) picture and it looks like this.

I have wonered for years why it uploads 3 jpeg files when there is only 1 picture.

[Per Berntsen]

If you post a link to your website, we might be able to help you better.

[Bill Gass]

It was in my first original post but it was removed for some reason...

Link is  billgass.com with 3 w in front, 😉   The latest picture I uploaded in reference to above is the one on the Sentry Eagle 2017 link. Picture looks terrible to me.

[Per Berntsen]

I have inserted the image from Sentry Eagle 2017 below.

It is 757 x 517 pixels. If the image you uploaded was 1400 pixels on the long side, it has been scaled, probably by the Microsoft software.

It doesn't look too bad, but is not perfectly sharp, this could have been caused by scaling.

When I type in 72dpi it makes a picture that is maybe a 1/4" in size.

By Bill Gass

If this is the Image Size dialog in Photoshop, pixel dimensions will be reduced if you enter a lower value in the Resolution field with Resample checked. Leave the ppi value alone, and uncheck Resample. As I explained earlier, ppi is irrelevant for screen viewing. Only the pixel dimensions matter.

Instead of resizing the image, try using Export (File > Export As), where you enter the desired pixel dimensions, and a new image will be created with those dimensions. The ppi value will be stripped out.

Make sure that both Convert to sRGB and Embed Color Profile are checked.

[Bill Gass]

Thank you again Per Berntsen,

I tried what you suggested and seems to be better i believe. I saved a pix at 1024 wide and uploaded it and I think it's better. Take a look and tell me what you think please.

[Per Berntsen]

That looks much better.

[Bill Gass]

Ok...Next question...After using generative fill, what option should you use in the Layers tab so I can do more editing.

Merge Down / Merge Visible / Flatten Image  ???

[Bill Gass]

ANYONE ???

[Lumigraphics]

Whichever you want. Do you want to keep separate layers?

[Bill Gass]

I still have not learned to use layers sorry to say and I think usually I don't for what I do except for this.

So I don't want to keep any layers, just export pix for photo viewing. I just didn't know if maybe the different one's made a difference for the end result but I don't think so.