5 Replies Latest reply: Jan 26, 2012 10:11 AM by jc1742
jc1742 Level 1 Level 1 (0 points)
About a year ago, I asked about problems with web pages' text formatting and/or reflow in Safari, and didn't really get an answer. The problem has gotten worse with the advent of iPhones with different screen resolutions (320x480, 640x960).

The problem is that web pages from several sites I'm working on are rendered on the iPhone by Safari in either a tiny unreadable font, or if you resize the screen, a legible font but a "window" that's much wider than the screen, requiring left-right scrolling to read. Users find this really unacceptable, of course, and want it fixed.

When I asked before, the proposed solution was "<meta name="viewport" content="width=320">" in the page's <head> section. This sorta worked, but has the problem that when you rotate the phone, you get the text in a huge font, and shrinking it is simply undone by Safari.

But we now have clients with the newer iPhones, and the above semi-solution doesn't work very well for them at all. So I'm trying to learn whether there's a solution now. Is there a way to get Safari to render web pages with the text at a font size chosen by the user, and "flowed" to fit the iPhone's screen width, whatever it is?

The weird thing here is that this is something that most browsers have done from the start. The main design goal of the original HTML over two decades ago was handling different-sized screens (or windows). The very first browsers (Mosaic, etc.) did "flowing" of the text to fit whatever size window widget they were running in. If you resize a browser's window, all the others I know of will quickly reflow the text so it's the same font size and fits the new window size.

But iPhone's Safari seems to stand alone in not doing this. It formats the text for a window much larger than the screen, and then shrinks it to fit the current width (i.e., portrait/landscape mode).

But is this actually true? Is there some way to tell Safari to do the usual sort of formatting to fit the current screen size and shape/layout? The <meta> tag doesn't do this, and has the problem that it can't know the size of the client's screen, which is no longer the same on all iPhones.

Googling turns up a lot of questions and complaints about this, but no solutions. My earlier question also stands unanswered. But it's more of a problem now, with more than one iPhone screen resolution in users' hands.

(And why does the Apple Discussions input form want to know my Macbook Pro's OS level? This is a question about iPhone software, and our web pages aren't delivered by my Macbook Pro, even if I do develop a lot of them there.

Macbook Pro, Mac OS X (10.5.8)
  • 1. Re: Safari text reflow/formatting revisited
    carltonzone Level 1 Level 1 (0 points)
    JC, the lack of text reflow on the Safari browser has been the biggest sore spot with me regarding my iPhones for the past 2 years. I have written a couple of blog pages about this over on my website (http://www.carltonzone.com, then click on the "technology" tab to pull up all of my gadget posts). Someone turned my attention to the Atomic browser which does reflow text, not upon zooming, but when you increase the font size. It works great on mobile-compliant sites, but not as well on standard websites. This is obviously an easy fix for Apple, but they apparently don't see it as beneficial. Their argument is that the "Retina" display is so clear, you don't need to zoom in to see things better. Common sense should tell you that even infinite resolution (for example, +printed text+???) is not readable when its in microscopic font size.

    Even though we now have a solution with the Atomic broser, I still think this should be added to the Safari browser for the simple fact that people want it.
  • 2. Re: Safari text reflow/formatting revisited
    cubbmind Level 1 Level 1 (0 points)
    I been asking about Safari text reflow/formatting and the reason apple won't let it happen its the same reason they won't have a flash player.
    reflow will not happen on the iphone Safari browser or any browser for the iphone or iopd touch you might get an reflow pdf reader but apple as its own rules and laws and they are not an open platform. when you phoned them they knew what you was talking about but they try to play dumb ..
  • 3. Re: Safari text reflow/formatting revisited
    GBH Level 1 Level 1 (65 points)
    This is the sole reason why I got rid of the iphone and went to an android phone, which has text reflow. Otherwise, I'd still have an iphone 4. Text reflow makes all the difference in the world, not having to constantly pan back and forth to read a page as on the iphone.
  • 4. Re: Safari text reflow/formatting revisited
    DrFacade Level 1 Level 1 (0 points)

    I have the same problem with the iPad. I just bought it 2 days ago, so I'm going to return it.

  • 5. Re: Safari text reflow/formatting revisited
    jc1742 Level 1 Level 1 (0 points)

    Hmmm ... So the only replies are basically "We don't know either." ;-)

     

    Meanwhile, I've been advising friends who've asked that in reality, Safari on the iPhone isn't actually a browser. Yes, it can download files and display them, but there are zillions of programs that can do that.  The primary feature of the original (Mosaic) browser 20 years ago was that it could reformat text to fit whatever size screen you had. It did this with the help of the funny new HTML markup, in which <P> indicated a new paragraph.  It knew how to reformat a paragraph's text to fit the width and font size of its current window.  This made it very easy to write simple text that would display readably on any screen that had a vertical scroll ability (and even the dumb terminals back in the 1980s had that).  Yes, it had lots of other nice features, like the <B> and <I> tags to make text bold and/or italic.  But the "reflowing" of text was the big gain in readability that really made it usable by the masses.

     

    So the iPhone and iPad don't actually come with a browser.  But I've also been getting those friends to download Opera and try it.  They're all happy with it.  So as long as Apple doesn't ban Opera, there is a way to get a browser on these gadgets.  Maybe I should look around and see if there are others.

     

    And maybe what I should do is change my CGI code that looks at the HTTP_USER_AGENT string, so when it finds Safari there, includes a short apology that the text is so poorly formatted. I suppose it should only do this when iPhone or iPad also appear in the string, since the Macbook and iMac versions of Safari seem to do a good job of (re)formatting text.