GNOME Bugzilla – Bug 596396
Layout problems because of minimum font size preference
Last modified: 2015-09-24 19:24:42 UTC
Created attachment 144051 [details] comparison between font rendering the front page of library.gnome.org in firefox, google chrome, and epiphany After upgrading from epiphany-gecko to the new 2.28.0 epiphany with webkit, a lot of pages are rendering with far smaller fonts than they did in gecko. In addition, they seem to be rendering much smaller than they are rendered in firefox and google chrom as well. I need to bump the 'Minimum size' setting to at least 9 in order to have the main content on many sites even be readable. The same sites are readable on other browsers without setting any minimum font size setting. Attaching some screenshots for comparison.
Created attachment 144052 [details] nytimes.com rendered on epiphany 2.28.0 with 'minimum font size' set to 1
(In reply to comment #0) > Created an attachment (id=144051) [details] > comparison between font rendering the front page of library.gnome.org in > firefox, google chrome, and epiphany > > After upgrading from epiphany-gecko to the new 2.28.0 epiphany with webkit, a > lot of pages are rendering with far smaller fonts than they did in gecko. In > addition, they seem to be rendering much smaller than they are rendered in > firefox and google chrom as well. I need to bump the 'Minimum size' setting to > at least 9 in order to have the main content on many sites even be readable. > The same sites are readable on other browsers without setting any minimum font > size setting. Attaching some screenshots for comparison. You might be comparing apples and oranges here. You need to tell me what are those browsers using as minimum font size, and we need to know what units are they using to set them (otherwise comparing the numbers is not that useful). For example, in the next screenshot you show me how a page looks with minimum font size *1*, which basically is telling the page to use a font as small as it likes. Not surprising it appears really small, IMHO. I have been using Epiphany for many years and have never used it with minimum font size 1, because text was too small in many sites. And yes, that was with the gecko backend.
Perhaps I have misunderstood the 'minimum font size' setting in epiphany, but I was under the impression that it worked the same as it does in firefox, which is basically: "If any fonts are specified to be smaller than this value, limit them to be at least this big". Since I'm quite certain that nytimes.com is not specifying any fonts to be 1px, I assumed that setting Epiphany's min font size to 1 would render the page as the designer intended it (in other words, I was trying to set no min font size to match what I had set in firefox). firefox renders nytimes.com perfectly fine with its min font size setting set to 'none'.
(In reply to comment #3) > Perhaps I have misunderstood the 'minimum font size' setting in epiphany, but I > was under the impression that it worked the same as it does in firefox, which > is basically: "If any fonts are specified to be smaller than this value, limit > them to be at least this big". That's right. I made a small twist in the 2.27.x cycle though: previously I was always forcing the minimum size to be the one specified, but I changed it to be set *only* if it does not break layout. If it does, I let the page do what it wants (the commit is f3366f19eb5d7fe77d843742a9db39d1fb53e36b). I did this because lots (and I mean lots) of pages were breaking pretty badly, and if you end up with fonts too small you can always zoom in, which epiphany will remember for that host. So I'm not sure what Firefox does, but it would be interesting to know what Chrome does, since we share engine. I'll investigate that. > > Since I'm quite certain that nytimes.com is not specifying any fonts to be 1px, > I assumed that setting Epiphany's min font size to 1 would render the page as > the designer intended it (in other words, I was trying to set no min font size > to match what I had set in firefox). firefox renders nytimes.com perfectly > fine with its min font size setting set to 'none'. I believe having a minimum font size in epiphany of "1" should be pretty much equivalent to that, yes.
Created attachment 149150 [details] Webpage rendered by Epiphany
Created attachment 149151 [details] Webpage rendered by Chromium
Thanks Xan Lopez for the detailed explanation. But it seems that such a new behavior is not so good for practical use of Epiphany; There are too many webpages which Epiphany have to ``zoom in'' while other popular browsers can nicely render. To avoid an ``apple vs orange'' comparison, I take Chromium (daily build by Ubuntu) as an example since the same engine is used. The default settings are used, i.e., the minimum fonts of Epiphany is set to 1. For the webpage having render problem, I think the emerging ``Google Dictionary'' is a good example. When both Epiphany and Chromium access http://www.google.com/dictionary the results clearly show the problem of Epiphany. See the attachments (id=149150 and id=149151) for an illustration. In fact, this problem of Epiphany is much more significant when rendering webpages using CJK languages. For example, the Google Hong Kong (http://www.google.com.hk) is hardly to read with Epiphany.
*** Bug 610610 has been marked as a duplicate of this bug. ***
*** Bug 613263 has been marked as a duplicate of this bug. ***
The usefulness of a "minimum size" option is questionable if most sites won't work correctly with it.
(In reply to comment #10) > The usefulness of a "minimum size" option is questionable if most sites won't > work correctly with it. That minimum size is ever necessary is testament to the fact that most sites are stupidly designed in the first place. There's a limit to how much a browser can do with the results of web designer efforts directed at trying to make every web page behave as if it were a piece of paper. If only 1 in 20 or 30 web visitors routinely complained to webmasters about broken rendering likely they'd eventually figure out how stupid their designs are. http://www.dev-archive.net/articles/font-analogy.html http://www.xs4all.nl/~sbpoley/webmatters/essence.html http://tobyinkster.co.uk/article/web-fonts/ http://www.useit.com/alertbox/designmistakes.html http://fm.no-ip.com/Auth/defaultsize.html
It seems to me the minimum font size setting has nothing to do with these problems: It is the default font size that's the problem. Currently, epiphany has no way to set it.
I've found it quite frustrating that the minimum font size option in Epiphany does *not* actually enforce a minimum font size, as various people have pointed out in this thread. Xan, thanks for pointing out (in comment 4 above) the particular change you made which uses the minimum font size only if it does not break layout. In my own source tree I've reverted this change (changing "minimum-logical-font-size" back to "minimum-font-size" in ephy-embed-prefs.c). I then rebuilt Epiphany and - voila - the minimum font size is now enforced everywhere! This is exactly what I want. If this breaks layout on a few pages, I can live with that - I just really really never want to see fonts that are smaller than I want to read. It appears from the comments above that I'm not alone in wanting this, so I question whether this change was the right thing to do. It would seem that other browsers enforce a minimum size and also render most pages correctly, so perhaps we should study how they do it.
(In reply to comment #13) > I've found it quite frustrating that the minimum font size option in Epiphany > does *not* actually enforce a minimum font size, as various people have pointed > out in this thread. Xan, thanks for pointing out (in comment 4 above) the > particular change you made which uses the minimum font size only if it does not > break layout. In my own source tree I've reverted this change (changing > "minimum-logical-font-size" back to "minimum-font-size" in ephy-embed-prefs.c). > I then rebuilt Epiphany and - voila - the minimum font size is now enforced > everywhere! This is exactly what I want. If this breaks layout on a few > pages, I can live with that - I just really really never want to see fonts that > are smaller than I want to read. > > It appears from the comments above that I'm not alone in wanting this, so I > question whether this change was the right thing to do. It would seem that > other browsers enforce a minimum size and also render most pages correctly, so > perhaps we should study how they do it. I do believe if we can setup minimum zoom level instead of minimum font size (assume zoom both image and font), Epiphany can render most pages correctly with preferred minimum font. Just cut off this option, and replace it with minimum zoom level could simply work the way you want.
(In reply to comment #14) > I do believe if we can setup minimum zoom level instead of minimum font size > (assume zoom both image and font), Epiphany can render most pages correctly > with preferred minimum font. Just cut off this option, and replace it with > minimum zoom level could simply work the way you want. The problem is that zooming doesn't always yield satisfactory font sizes. To choose just one example, if I go to my Gmail inbox page then the fonts at the bottom of the page are unreadably small by default in Epiphany. To make them a readable size I have to press the Larger Text button twice, but then the font in the menu bar at the top of the page looks too chunky. If I can set a minimum font size then the problem is solved nicely. In particular, if I apply the code hack I mentioned in comment 13 and then set a minimum font size of 11 then the page looks great (to me, anyway).
(In reply to comment #13) > I've found it quite frustrating that the minimum font size option in Epiphany > does *not* actually enforce a minimum font size, as various people have pointed > out in this thread. Xan, thanks for pointing out (in comment 4 above) the > particular change you made which uses the minimum font size only if it does not > break layout. In my own source tree I've reverted this change (changing > "minimum-logical-font-size" back to "minimum-font-size" in ephy-embed-prefs.c). > I then rebuilt Epiphany and - voila - the minimum font size is now enforced > everywhere! This is exactly what I want. If this breaks layout on a few > pages, I can live with that - I just really really never want to see fonts that > are smaller than I want to read. Actually when I made the change the layout was broken for way too many pages to be a sensible default IMHO, and I got constant complaints because of that. In any case I agree that the way it works now is less than perfect too. > > It appears from the comments above that I'm not alone in wanting this, so I > question whether this change was the right thing to do. It would seem that > other browsers enforce a minimum size and also render most pages correctly, so > perhaps we should study how they do it. Yes, other WebKit-based browsers do in fact work better than we do. I actually spent some time with Evan Martin from Chromium looking at what could be causing the differences (since they just seem to use the font preferences the way we do it), but we couldn't reach any conclusion. If someone wants to spent some time looking into it that would be most welcome.
Based on the comments here perhaps the subject of this bug should be "epiphany fonts are too small by default" ? Most pages I view require me to zoom (+) twice to make the smallest fonts readable. For example the gmail inbox and google reader feeds. The problem is compounded as pointed out in comment #15 that zooming (+) to make small fonts bigger then makes big fonts gigantic. Since epiphany is part of the gnome desktop I would anticipate some sort of consistency between the size of desktop fonts and the epiphany web page fonts. In Epiphany I found Preferences->Fonts, "Use system defaults" and thought this was the case already. But it's clearly not because fonts used on the desktop for window titles, menus, dialogs, etc all use sane and readable font sizes. Epiphany web pages often do not (as already identified in attachment #144051 [details] of the original bug report). Tested with epiphany-3.0.0-1.fc15.i686 Similar downstream bugs: https://bugs.launchpad.net/ubuntu/+source/epiphany-browser/+bug/222256 https://bugs.launchpad.net/epiphany-browser/+bug/72109 https://bugs.archlinux.org/task/20547
Created attachment 186167 [details] 120 DPI screenshot of Gecko rv1.9.2.16, Opera 11.01 & Epiphany 2.30.6/WebKit 534.16+ in KDE 4.6 URL used in screenshot: http://fm.no-ip.com/Auth/Font/font-vera.html (In reply to comment #17) > Based on the comments here perhaps the subject of this bug should be "epiphany > fonts are too small by default" ? They're probably just fine by default - IF your DTE is 96 DPI. If you're running a high resolution display with an appropriately configured DPI (at least approximately) to match, then you may be experiencing the impact of WebKit's hard coding of the points to pixel ratio at 3 to 4, same as IE and Opera do, because the desktop's fonts are configured in points, not pixels, in KDE, and AFAIK in Gnome also. e.g., at 120 DPI, 12pt should be 25% more px than at 96 DPI, 20 instead of 16. If Epiphany's environmental font setting is 10 (from Gnome or KDE desktop preferences), the hard coded ratio makes the px size 13 by default (equivalent to CSS medium). Then when a web page sets a body size to e.g. CSS small or e.g. 76% as common examples, you wind up with CSS small equal to 86% of 13px (~11px), and 76% of 13px (~10px) in Epiphany (& Opera), instead of Gecko's (& Konqueror's) 86% of 16px (~14px), and 76% of 16px (12px).
(In reply to comment #18) > They're probably just fine by default - IF your DTE is 96 DPI. According to /var/log/Xorg.0.log it's 96 [ 7644.341] (==) RADEON(0): DPI set to (96, 96) > If you're > running a high resolution display with an appropriately configured DPI (at > least approximately) to match, then you may be experiencing the impact of > WebKit's hard coding of the points to pixel ratio at 3 to 4, same as IE and > Opera do, because the desktop's fonts are configured in points, not pixels, in > KDE, and AFAIK in Gnome also. e.g., at 120 DPI, 12pt should be 25% more px than > at 96 DPI, 20 instead of 16. My screen resolution is 1680x1050. > > If Epiphany's environmental font setting is 10 (from Gnome or KDE desktop > preferences), the hard coded ratio makes the px size 13 by default (equivalent > to CSS medium). Then when a web page sets a body size to e.g. CSS small or e.g. > 76% as common examples, you wind up with CSS small equal to 86% of 13px > (~11px), and 76% of 13px (~10px) in Epiphany (& Opera), instead of Gecko's (& > Konqueror's) 86% of 16px (~14px), and 76% of 16px (12px). Yes the font setting in epiphany is 10 (using system fonts). I appreciate the explanation of where the font sizes calculation comes from. I will attach a screenshot with an example case where we can dig a little deeper.
Created attachment 186179 [details] gmail.com font comparison; firefox on left, epiphany on right The block that reads "Gmail is built on the idea that..." is very small. This is the same font size used in the gmail inbox for reading emails. (Sorry I didn't take a screenshot inside my email for privacy). Using Epiphany web inspector I've noticed it is defined as <font size="-1">. I'm not really familiar with size -1, (one smaller than the minimum size?) but perhaps Epiphany should ensure that it can render -1 in a readable size and scale up from there?
<font size="-1"> is a legacy method[1] of sizing web page text via (X)HTML instead of CSS. -1 means one size smaller than the inherited size[2]. Where no ancestor size has been set, this means one size smaller than your browser's default. In your Firefox window, assuming the OEM font sizes remain intact and no ancestor size was set by the page, <font size="-1"> translates to 13px. Using the same assumptions for Epiphany, because your DTE font is 10pt (aka 13px @ 96 DPI), it translates to 10px. [1] http://www.w3.org/TR/html4/present/graphics.html#edef-FONT [2] http://www.w3.org/TR/css3-fonts/#font-size-prop For Epiphany's minimum size to affect that Gmail URL, it would need to be set to more than 10px, approximately 7.5pt@96DPI. Here I had to change it to 9 to see Gmail's fonts increase in size.
(In reply to comment #21) > For Epiphany's minimum size to affect that Gmail URL, it would need to be set > to more than 10px, approximately 7.5pt@96DPI. Yes, in Epiphany unchecking 'Use system fonts' and changing the default Serif font size from 10 to 12 made gmail readable and roughly equivalent to the default appearance in Firefox. I've been doing this workaround for a while now actually (I think even pre-webkit transition). To me this indicates an underlying problem that fonts are being drawn too small. Perhaps it's just a "google" problem (but I'm certain I've encountered other popular sites that rendered far too small in Epiphany too).
Created attachment 186243 [details] 96 DPI screenshot of 6 web browsers showing Gmail login page (In reply to comment #22) > this indicates an underlying problem that fonts > are being drawn too small. Perhaps it's just a "google" problem (but I'm > certain I've encountered other popular sites that rendered far too small in > Epiphany too). Comment 18 was intended to answer this, but on rereading it now it's obvious I didn't get to the point. 1-Konq gets its default font size directly from a Konq setting in pt, 12 OEM. 2-Opera gets its default font size directly from an Opera setting in px, 16 OEM. 3-Google Chrome gets its default font size directly from a Chrome setting in px, 16 OEM. 4-Rekonq gets its default font size directly from a Rekonq setting in pt, 12 OEM. 5-Most Gecko browsers get their default sizes directly from a Gecko setting in px, 16 OEM, usually. At 96 DPI, 12px is equal to 16px. So, all 5 of those browsers OEM the same default size. 6-Epiphany built on Gecko (prior) got its defaults from a direct pref setting, same as most Gecko browsers. Its OEM default may or may not have been the same size as other browsers, as some distros OEM'd it with slightly smaller fonts. 7-Epiphany built on WebKit, current at least, inherits its default from Gnome's Application Font setting rather than allowing it to be set directly via an Epiphany pref setting. So, unless the Gnome Application Font setting is 12pt, Epiphany's default size will not match other browsers. If your Gnome desktop is set to use 10pt, you can expect web pages that size text relative to users' browsers' defaults to display smaller text than is displayed in the other browsers that use 12pt/16px as their defaults. Epiphany's fonts are being drawn as they have been directed to be drawn via gnome-control-center's "Application Font". In this screenshot, in the upper right, Epiphany's viewport fonts strongly resemble the other 5 browsers' viewport fonts because in gnome-control-center I have selected size 12, instead of the default 10, for "Application Font" (saved in ~/.gconf/desktop/gnome/interface/%gconf.xml). Unfortunately, this causes Epiphany, and Firefox, to use the larger size for UI text as well.
Your specific case is solved by overriding the sans font size in Preferences. This is available in 3.0
(In reply to comment #23) > In this screenshot, in the upper right, Epiphany's viewport fonts strongly > resemble the other 5 browsers' viewport fonts because in gnome-control-center > I have selected size 12, instead of the default 10, for "Application Font" > (saved in ~/.gconf/desktop/gnome/interface/%gconf.xml). So the first thing the user should do is increase the desktop font size before using Epiphany ? ;) (In reply to comment #24) > Your specific case is solved by overriding the sans font size in Preferences. > This is available in 3.0 See above :) So we have a short term work around. What's the best long term solution? With one of the focusses of 3.2 being better web integration with the desktop then this is a prime issue to resolve. There's an obvious need for consistent fonts between Gnome desktop and Epiphany. This happens to some degree already (as mentioned via gnome-control-center's "Application Font" ) but the result is that the desktop is "readable" but Epiphany (for some web pages) is barely readable. The only place on the desktop with fonts as small (as the gmail example) is the font used in the Dash tooltips or the Activities application icon grid. Options: 1. The Gnome desktop should increase the font to size 12 by default 2. If Gnome desktop is going to remain at font size 10 then perhaps Epiphany should render it's perception of font size bigger. Thoughts?
The current state of Epiphany taking its default from the desktop settings assumes an ideal world where web stylists do not assume everyone's browser defaults are too big. It makes sense in an ideal world with nice web integration in the desktop for the browser default to be inherited from the general desktop setting. In the real world we actually live in, virtually all web pages either assume everyones' browser defaults are too big (relative sizes such as 76% or small as dominant size), or disregard them entirely (dominant sizes such as 11px or 9pt). Since we don't, we need what most browsers have, a separate setting for web page content text size. The way I read comment 24, that has been implemented as of Gnome 3, hopefully by making access to a separate web page default text size available in the same location as the rest of the desktop text sizes, in addition to the location provided by other browsers, in the browser's own settings.
Anything still need changed here?
Unfortunately I generally use firefox these days, so I'm not really sure whether this bug still exists in any corner cases, but a very brief test suggested that it behaves OK these days. Epiphany has changed so much since my original report that I think it's probably safe to close it and wait to see if anybody else complains.
I just tested on gmail.com, and Epiphany 3.16.1 still has this issue of overally tiny fonts. Maybe it's better in 3.18, I haven't tried that yet.