• Hi,

    I made a slider image earlier using 1170px and 500px. When I uploaded it to WordPress, the image become blurry and not sharp.

    How can I stop this? I want to make images for my slider.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Link?

    Thread Starter AlbaFitness

    (@albafitness)

    Looks like you may have committed all the cardinal sins in a single slam dunk.

    Creating and compressing and then scaling bitmap images which include rendered text is asking for trouble as it will always look “blurry”.

    I would recommend removing your text and uploading just the blue background as your slider image — and then adding your text in the slider options.

    But if you want to include text in an image, you could minimise the “blurriness” by:

    a) using an image editor such as Photoshop which allows you to choose from various anti-aliasing options when rendering type onto a halftone image: “crisp” on “none” would be the best type anti-aliasing for small images – but anti-aliasing is really nothing more than organised “blurring” to remove the jagged edges of the curved parts of your text…so it’s not a perfect start;

    b) your image is a JPEG and that’s a disaster compression algorithm for rendered text as it further softens edges and adds noise to help it disguise the fact that it is throwing away a lot of your image data; try PNG instead – or best-for-text GIF if your background image survives intact;

    c) allowing your rendered text to be scaled up in size by the Customizr full-width slider is asking for more trouble as the artefacts/”blurriness” which is less visible at 1170px wide becomes unmissable at larger sizes; so either don’t use text in your image at all — or don’t use a full-width slider as your text will look fine in an 1170 x 500 framed slider.

    Incidentally, the recommended size for a full-width slider image is 1200 x 500. Changing your image to this size would help a little but won’t solve the problem.

    You might want to experiment with an extreme width image, eg 2000 x 500 which would help your text to display better but might introduce unwanted white space around the slider in smaller viewports as the image is scaled to fit.

    Hi,

    I’ve read every one of the suggestions and nothing works. I’m using the Godaddy frames theme and like everything about it except the fuzzy slider images.

    Here’s what I’ve tried:
    Resizing the photos
    Different resolutions from 72 to 600 dpi
    Link. http://www.folkscycle.com (work I progress)

    I would really appreciate any tried and true solutions to this problem.

    Thank you,

    Gald

    What is happening is the slider is auto resizing your photos and overriding the actual photo width, let me take a look at your site and see if I can help, hopefully, someone can help you!

    I see you fixed it, looks good, so what was the issue?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Slider images becoming blurry’ is closed to new replies.