Jump to content

Recommended Posts

Posted

I have been trying to convert this PDF to a PNG or JPEG to include in a Wordpress blog post and it keeps looking blurry upon upload.

You can see that when I download these, they look normal, but as soon as I put it on a Wordpress post, it gets all blurry, like this:

986157820_Websiteshownblurry.PNG.6b0f745e0feb0bc592e59698ebce2796.PNG

My plan was to put a shadow behind the JPEG or PNG to make it look like a digital download product but I can't get it to look right on a Wordpress post even without a shadow??  I don't know what to do anymore :(
 

Any help here would be amazing.

Random List - JPEG Best Quality.jpg

Random List - PNG Bilinear.png

Random List - PDF Flattened.pdf Random List - PDF High Quality.pdf

Posted

Hi and welcome to the forum.

Did you check the image quality on your PC locally before uploading to wordpress?

  • If IQ is good before upload, it’s probably wordpress settings causing the blurriness.
  • if IQ is bad before upload, check export settings in Affinity (DPI, size, resample settings).

Do you use that exact file shows in you post?

Is the source PDF protected in any way (export, print, editing)? Please check with AdobeReader, as Affinity does not display this information, but will apply those restrictions never the less.

Mac mini M1 A2348 | MBP M3 

Windows 11 - AMD Ryzen 9 5900x - 32 GB RAM - Nvidia GTX 1080

LG34WK950U-W, calibrated to DCI-P3 with LG Calibration Studio / Spider 5 | Dell 27“ 4K

iPad Air Gen 5 (2022) A2589

Special interest into procedural texture filter, edit alpha channel, RGB/16 and RGB/32 color formats, stacking, finding root causes for misbehaving files, finding creative solutions for unsolvable tasks, finding bugs in Apps.

I use iPad screenshots and videos even in the Desktop section of the forum when I expect no relevant difference.

 

  • Staff
Posted

Hi @Printables,
Looks like the image (PNG/JPG) is being downsampled by Wordpress. Do you want to use the image as a "thumbnail" to link to the PDF document? If so, it's probably better if you downsample the image yourself using a better resample algorithm (try Lanczos) to the size allowed by Wordpress to prevent it from resampling the image for you.

Posted

Hi everyone,

Thank you for responding.  I ultimately decided to just add a shadow on Affinity for the image and then export directly from there.
And then on Wordpress, I had to adjust the size of the image manually so it would not get pixelated.

Definitely pointed me in the right direction!

Have a great day,
Tatiana

 

Posted

There are many situations images become blurry on the website.

1. if it's not shown at 100% size, it will be resized by browser, this makes the image blurry. so create exact size of image you will use on the website.

2. you should use "full size" to place the image if you want to show the original image, otherwise Wordpress will show a resized image which is not the best quality.

  • 11 months later...
Posted

Typo: pretend or prevent?

Mac mini M1 A2348 | MBP M3 

Windows 11 - AMD Ryzen 9 5900x - 32 GB RAM - Nvidia GTX 1080

LG34WK950U-W, calibrated to DCI-P3 with LG Calibration Studio / Spider 5 | Dell 27“ 4K

iPad Air Gen 5 (2022) A2589

Special interest into procedural texture filter, edit alpha channel, RGB/16 and RGB/32 color formats, stacking, finding root causes for misbehaving files, finding creative solutions for unsolvable tasks, finding bugs in Apps.

I use iPad screenshots and videos even in the Desktop section of the forum when I expect no relevant difference.

 

Posted

Here are a few suggestions that may help.

If you can determine the maximum size the image will be displayed at in the container it’s in (width is typically the only concern), resize the image to that exact max size, then upload the image to your site.

Don’t manually resize the image in the WordPress theme.

When inserting the image into the webpage, make sure you select Full Size rather than one of the smaller sizes automatically created when the image was uploaded (e.g., Large, Medium, Thumbnail).

Windows 10 22H2, 32GB RAM | Affinity Designer/Photo/Publisher 2 (MSI/EXE)

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.