Pixelated photos once uploaded to website.

[vegasrealtor]

Hello everyone,
Hopefully I am posting this in the correct section and hopefully this is something I am just doing wrong with exporting. I am trying to put some of my head-shots onto my website and with one particular picture it gets very pixelated once I view my website. The file itself is 13.1 MB when exported and I am using WIX to create my website. I realize this could be a problem with WIX itself but I assume a lot of photographers use WIX when creating their business websites.

Thank you!

 

[480sparky]

13.1 MB is only the size of the file. What are the pixel dimensions?

 

[vegasrealtor]

13.1 MB is only the size of the file. What are the pixel dimensions?

3580 × 4000 seem to be the dimensions according to the info on the image itself. However I am having to resize it once I import it so maybe that is part of my problem? Also, the pixel count is a good question since I have been exporting from Lightroom5 with 100% quality and haven't adjusted any other settings.

 

[480sparky]

That size should not be pixelating unless you're viewing in on a 96" screen.

 

[Derrel]

Maybe re-process the file. For some odd reason, at times a photo's thumbnail will upload, and not the image itself...I've seen that too many times in my life. I'm not sure why that occurs. If you're uploading images to the web, I'd also check the box in Lightroom, to limit the file size, to say 2.9 megabytes, and also scale the size of the images down from 4,000 pixels to something smaller, say 1,600 pixels on the longer axis.

 

[The_Traveler]

If you are uploading a huge file, either file size or pixel dimensions, you are depending on the image server to resize it.
For best results, resize it to largest dimensions that are seen and upload that file.

 

[vegasrealtor]

Here is where I am at now. I managed to save it as a PNG file which seemed to help but it still doesn't look that sharp. The spot for the picture is currently 1343X1500. The Pixel count I believe is set at 240 per inch by default on Lightroom. This particular photo is 3580X4000 before I uploaded it so the WIX program scaled it down to the 1343X1500. I wonder if I am being too picky but as I look at some of my other photos on here they are very crisp. Not to mention this is my main photo.

 

[Derrel]

Maybe try re-sizing the image to 1,500 pixels long, at 72 ppi, and set Lightroom's sharpening to Screen, and "High". See what that does.

 

[KmH]

Here is where I am at now. I managed to save it as a PNG file which seemed to help but it still doesn't look that sharp. The spot for the picture is currently 1343X1500. The Pixel count I believe is set at 240 per inch by default on Lightroom. This particular photo is 3580X4000 before I uploaded it so the WIX program scaled it down to the 1343X1500. I wonder if I am being too picky but as I look at some of my other photos on here they are very crisp. Not to mention this is my main photo.

For online/electronic display the 240 ppi (or any other pixels-per-inch value) value is meaningless, and has zero effect.

The only numbers that matter are the pixel dimensions (image resolution) and the image file size.

Ppi is print resolution.

 

[vegasrealtor]

Maybe try re-sizing the image to 1,500 pixels long, at 72 ppi, and set Lightroom's sharpening to Screen, and "High". See what that does.

I tried what you said and didn't get any better results. It seems that WIX uses an algorithim designed to get fast load times at the sacrifice of image quality. I will attach what I am currently at now which is a 25mb PNG image that looks better, but definitely not at the level I was hoping.

Here is where I am at now. I managed to save it as a PNG file which seemed to help but it still doesn't look that sharp. The spot for the picture is currently 1343X1500. The Pixel count I believe is set at 240 per inch by default on Lightroom. This particular photo is 3580X4000 before I uploaded it so the WIX program scaled it down to the 1343X1500. I wonder if I am being too picky but as I look at some of my other photos on here they are very crisp. Not to mention this is my main photo.

For online/electronic display the 240 ppi (or any other pixels-per-inch value) value is meaningless, and has zero effect.

The only numbers that matter are the pixel dimensions (image resolution) and the image file size.

Ppi is print resolution.

I wish I would have read this about an hour ago. I found this out and it seems to be all about the size of the file and the format it is saved as.

When I export form Lightroom, should I be exporting at the exact size I want? If thats the case I obviously get a smaller file size. I'm wondering if that would be beneficial as oppose to saving it as the largest image resolution and having it shrunk when loaded to WIX.

 

[The_Traveler]

why are you using PNG, as opposed to jpeg?
quality better than 50% makes for incredibly higher file sizes that cannot be seen on the screen.

there are a couple of things that I don't understand.

If the original picture is 3580 x 4000 how does that get shrung to 1343 x 1500?
While the picture you sent is 1276 x 581
There must be a mistaken number there somewhere.

Here is the picture dmensions as sent but resaved as a jpg at medium quality - 83.9 k

 

[Designer]

Not to mention this is my main photo.

Are you up for some general criticism?

I hope so, because I'm about to offer it anyway.

I might be able to go with the B&W urban background in spite of the general hint that you're looking for more residential listings. Perhaps you want to be the next king of Clarke County Commercial Real Estate.

BUT...Why the raindrops? I mean they take up such a large portion of the screen, and there doesn't seem to be any reason for them to be there.

Then there is that unwanted thin white border at the bottom of your portrait. Why is that there?

FWIW: I think your "main picture" should be primarily about you. Not even any recognizable objects in the background, if it were up to me.

 

[vegasrealtor]

why are you using PNG, as opposed to jpeg?
quality better than 50% makes for incredibly higher file sizes that cannot be seen on the screen.

there are a couple of things that I don't understand.

If the original picture is 3580 x 4000 how does that get shrung to 1343 x 1500?
While the picture you sent is 1276 x 581
There must be a mistaken number there somewhere.

Here is the picture dmensions as sent but resaved as a jpg at medium quality - 83.9 k


View attachment 108225

Okay so according to WIX when I click on "edit" it says the dimensions of my current picture are W289-H323 so I am unsure how I can maximize my quality based on that size. As far as the PNG, according to WIX PNG is best for website as it does not get compressed as much.

Not to mention this is my main photo.

Are you up for some general criticism?

I hope so, because I'm about to offer it anyway.

I might be able to go with the B&W urban background in spite of the general hint that you're looking for more residential listings. Perhaps you want to be the next king of Clarke County Commercial Real Estate.

BUT...Why the raindrops? I mean they take up such a large portion of the screen, and there doesn't seem to be any reason for them to be there.

Then there is that unwanted thin white border at the bottom of your portrait. Why is that there?

FWIW: I think your "main picture" should be primarily about you. Not even any recognizable objects in the background, if it were up to me.

Thanks for the comments. You might have missed the part where I said my website isn't done yet. The raindrops you are referring to will eventually be a slideshow of featured listings once I get this primary problem fixed. I chose the B&W photo of the strip so that it didn't take draw too much attention which I hope will be the case once I get the slideshow all setup. I am also considering make it more "blurry" once I get the rest of my site buttoned up. The thin white border you see below my picture is going to be a box containing my contact info. I am still deciding how I want that to look but it's just there to remind myself to get to it.

 

[Designer]

Okay so according to WIX when I click on "edit" it says the dimensions of my current picture are W289-H323 so I am unsure how I can maximize my quality based on that size. As far as the PNG, according to WIX PNG is best for website as it does not get compressed as much.

You have uploaded a photo that is 289 pixels wide by 323 pixels high. You could export a larger version up to W1343 by H1500 and it would probably look a lot better.

 

[Derrel]

A 25 megabyte PNG file that is going to be scaled down to 289 x 323 pixels....that is probably going to look less than optimal. The best way to make what is called a web reduction is in multiple steps, down-sizing a bit at a time; but if you upload a 25 megabyte image that's quite large, there's a high chance that Wix is just going to reduce it in one, single step, and the resulting web-sized image will look less than optimal. A tiny image on the page that arrives as a 25 megabyte file is GOING TO BE down-rezzed, hard. No two ways about that.