how do i get my header picture to look good on retina screens

• 

  wigaveda · Member · Feb 3, 2015 at 1:23 pm

  • Copy link
  • Add topic to favorites

  hello!
  i can’t seem to get the quality i would like om my header picture when i watch my site on retina screens.
  how can i get better resolution?
  when i look at the picture on my computer it looks fine but when i upload it to my header it looks al blurry.

  The blog I need help with is: (visible only to logged in users)

• 

  thatrobyn · Member · Feb 3, 2015 at 8:38 pm

  • Copy link

  Hello there!

  I took a look at your site wig.se in both a Thunderbolt high resolution monitor, and an iPad with retina display. They appear to have the same, crisp header image.

  Could you take screenshots of what you’re viewing, so I can compare and contrast? I’d like to see what you’re viewing on your computer, as well as what you’re viewing on your retina display mobile device.

  You can simply upload the screenshots to your Media Library, like any other image, and I’ll be able to access them from there.

  The page at the following link has some helpful tips for taking screenshots:

  Take a Screenshot

  Just let me know when there’s something I should look at.

  Also, please confirm that you don’t have a glare filter that disrupts your retina display. Additionally, the brightness/backlight should be similar on your computer and on your mobile device.

  Looking forward to hearing from you. Thanks very much.

• 

  wigaveda · Member · Feb 3, 2015 at 9:01 pm

  • Copy link

  thanx for helping me out. i have uploaded a screen grab. my problem is that the header i have created looks good when viewed i preview on my mac book pro retina but when i upload it to wig.se and watch it in a web browser it looks blurry. i haven’t tried the site on other retina devices.

• 

  thatrobyn · Member · Feb 3, 2015 at 10:11 pm

  • Copy link

  Hey there,

  I will look further into this…could you do one more thing for me, however, and make sure that your imagine is optimized for the web:

  Optimize Your Images

  Also, be sure that your header image is the precise size for your theme: 940 in width and 198 in height.

  Finally, take a look at your site in a browser other than Safari, such as Chrome and Firefox.

  Let me know if the suggestions above make any difference and we’ll continue looking into this for you!

  Thank you very much!

• 

  wigaveda · Member · Feb 4, 2015 at 2:26 pm

  • Copy link

  hello!
  now i have tried all of your suggestions and nothing seams to work.
  the header looks god on non retina screens but it looks blurry on retina computer screen.

• 

  thatrobyn · Member · Feb 5, 2015 at 1:46 am

  • Copy link

  Hi there!

  Have you been able to look at your header on another retina screen? We’re not seeing a difference between computer/laptop/retina screens on our devices.

  If you can find another retina-screened device, could you please look at the site and let us know if you’re experiencing the same trouble?

  Additionally, since this seems to be a display issue, have you contacted Apple support? It would be a great help if you could speak to them, and ask their recommendations. I can certainly help in any way once we hear what they suggest.

  Please let me know what Apple says…and if they have suggestions about how to alter the image.

  Thank you.