Retina display and website images.

Discussion in 'iPad' started by maxsquared, Mar 10, 2012.

  1. maxsquared macrumors regular

    Joined:
    Jun 27, 2009
    #1
    Hi all,

    IPad is ordered and shipped, can't stop finding informations about it.

    One thing that I can't stop wondering about is how web images will show on retina display iPad? I have a 21.5 inch iMac, it's 1080p, and most web pages will use a third of the display in the middle, I can use zoom function to make the web page display full screens, however, when the text appear to be fine, but images will look blurry.

    Now, retina screen has more pixel than 1080p, so when browse "fit to width", the image should be also blurry? Does anyone have a1080p android tablet? How does it show on that?

    iPhone never had the problem, because even retina screen, the resolution is not greater than the website.

    Unless, the new iPad really going to be a game change, and someone is going to invent some kind of true vector image file that sufficient to use for web?
     
  2. elmo151 Guest

    Joined:
    Jul 3, 2007
    Location:
    NYC
    #2
    someone called Apple
     
  3. Lukeyy19 macrumors 6502a

    Lukeyy19

    Joined:
    Feb 16, 2010
    Location:
    England, UK
    #3
    zoom safari in, and look at the image below

    [​IMG]

    tada - problem solved
     
  4. ConnorTurnbull macrumors 6502

    Joined:
    Aug 18, 2010
    Location:
    United Kingdom
    #4
    I don't really get what you're asking, but the iPad is no different to a regular device. If you zoom in an image that's smaller than the size you're viewing it at, it's going to be blurry.
     
  5. Lukeyy19 macrumors 6502a

    Lukeyy19

    Joined:
    Feb 16, 2010
    Location:
    England, UK
    #5
    the new iPad's retina display means it has twice the resolution, websites will all then be scaled up to twice their normal size to fill the screen, otherwise they would be tiny and unreadable in the centre of the screen.

    This means that while anything that is easily scalable like CSS objects and text, will look crisp, but images are not scalable, and will have to be stretched to twice their resolution, to be the same size they would be on an iPad 2 screen, they're not going to look blurry, thats just people being paranoid, they just won't be as crisp as the text, they will look the same, if not a little smoother than they look on an iPad 2, but they won't take full advantage of the new iPad's screen.

    Unless, like i pointed out above, the website is using higher resolution images, being scaled down using html coding, in which case, they will be able to be scaled up because the actual image is large enough, it was just being shrunk to fit where it was needed.
     
  6. erawsd macrumors 6502

    Joined:
    Jul 1, 2011
    #6
    Web images will look exactly the same as they do right now, that's part of the brilliance behind pixel doubling -- in fact, with the improve color saturation, it may look a bit better vs iPad 1/2.
     
  7. ConnorTurnbull macrumors 6502

    Joined:
    Aug 18, 2010
    Location:
    United Kingdom
    #7
    Yep, like I said, "If you zoom in an image that's smaller than the size you're viewing it at, it's going to be blurry."
     
  8. Lukeyy19 macrumors 6502a

    Lukeyy19

    Joined:
    Feb 16, 2010
    Location:
    England, UK
    #8
    it's late, I'm tired, sorry, I didn't read enough into your post.

    you're right, but putting it like that is probably what's got people confused in the first place.

    anyway, i'm going to bed.
     
  9. Jason S. macrumors 6502a

    Joined:
    Jul 23, 2007
    Location:
    Pennsylvania
    #9
    It already exists. It's called SVG. http://en.wikipedia.org/wiki/Scalable_Vector_Graphics
     
  10. dagamer34 macrumors 65816

    dagamer34

    Joined:
    May 1, 2007
    Location:
    Houston, TX
    #10
    While vector graphics would be ideal, the better stop gap solution is to have web sites support CSS3 Media Queries to figure out the DPI of the display and get the appropriate CSS.

    Example: http://blog.iwalt.com/2010/06/targeting-the-iphone-4-retina-display-with-css3-media-queries.html

    However, it's been almost two years since the iPhone came out and few, if any, websites actually bother to supply retina graphics. Though, even fewer websites have mobile-optimized versions (because while the iPhone is a fully capable web browser, it's a lot easier to read an article when you don't have to keep panning and zooming like on the iPad).
     

Share This Page