-
Notifications
You must be signed in to change notification settings - Fork 659
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[css-fonts] font-size: 'medium' value is the user's preferred font size #2430
Comments
If most people don't know, or don't take into account, or browsers don't implement, the concept that medium was supposed to be the user's preferred font size, then it was correct to remove it in Fonts 3. So, why reinstate it? |
Chris, If a wide majority of web authors don't know or don't take into account that 'medium' value is the user's preferred font size, then removing such statement will not improve their knowledge or competence and the opportunity to do so will be removed. A wide majority of ordinary web authors think and believe that CSS specifications are too technical. Such 9 words statement is not a burden. As a web author, I do not know and can not know what are each of my visitors' preferred font size and it is impossible to match all of them simultaneously by choosing one absolute value (example given: say, 16px: which can be too small for some and too big for others). But what if I could match all of my visitors' individual preference setting in their browser for each of the platforms (mobile, tablet, laptop, desktop) they use with the screen resolution they have or choose, then we all win. Why reinstate it? |
For me, the first question is: do browser's implement it this way? That is, do they adjust the actual value of Based on my test (Codepen):
So with two rendering engines implementing this behavior, and the other two not contradicting it, I'd say this relationship should be (once again) made explicit in the specs. As part of that, I'd recommend reconsidering the terminology that these are "absolute size" keywords. They are absolute in the scope of a document (I.e., they aren't affected by inheritance), but they are not absolute in the same way that lengths are absolute. |
As an user, you can then set, customize to whatever value you prefer in pixels what is the font-size of medium value in Chrome. In Appearence section, below "Font size", there is "Customize fonts" where you can set medium value to whatever value you prefer in pixels.
In IE11, there is a Text size setting (from the menu bar, View and then Text Size; or from the command bar: Page and then Text Size) with 5 predefined values: Smallest, Smaller, Medium, Larger and Largest. Medium value is default setting and is preset at 16px. |
According to this video (duration: 31sec) In Konqueror, the user can set, customize the value she/he prefers in pixels for the medium value and then see how it looks, how big the glyphs are with a preset sentence ("The brown fox jumps over the lazy dog."). I believe the user can set, customize the value she/he prefers in pixels for the medium value also in less common browsers and web-aware browsers (iCab, AntennaHouse, Prince, etc.). |
According to fig 2 and fig 3 of |
Thanks for the help @TalbotG. Unfortunately, both of those How-To's seem to be out of date. I'm using Safari via an online testing tool, so I may not be seeing all the options, but there is no "Appearance" tab in the settings dialog, going back as far as Safari 6. Edge has font-size controls in its "Reading Mode" view, but those don't affect regular page rendering (and in reading mode, they are implemented by changing the font size on the root Thanks for the information about other browsers/rendering engines. |
I am curious. What is such online testing tool you're using?
You are most likely right. I can not find anything related to Safari 11 in recent webpages or videos. Mac OS X can set at os level the default font size according to iPhone and iPad allow users to customize the default, medium font size via a slider with 7 preset values. |
I'm using Cross Browser Testing; it has a free integration with CodePen that is great for testing quick snippets across many browsers & devices. It also has many other more complex testing features, but they require a paid account. |
There is no material difference in how a user adjusts his font preference in Safari vs. Gecko browsers. Both with the most common displays by default assume 96 DPI and 16px until such time as the user chooses to make a change. With HiDPI displays, it works the same way, but the physical meaning of a px is changed to compensate for the higher physical density. CSS medium in all is thus 16px until a user chooses to personalize. Konqueror, depending on version, provides a choice between WebKit and KHTML rendering engines. Its initial default size is 12pt (pt that depends on display density, as in CSS2; not pt that equals px, as in CSS3). e.g., 16px on a 96 DPI display, 22px on a 132 DPI display, and 28px on a 168 DPI display. Edge has subsumed the concept of a default text size within the scaling knob it calls "Zoom", a simplified way to make everything bigger or smaller than the shipped default. This is a bit like what Gecko users asked for WRT text size as long as 18 years ago and never have gotten: Whatever numerical value may be assigned to the default or medium size, or its CSS px equivalent, really is of no importance to a user, and should be of no direct importance to web authors. The default size is presumptively the optimal size for every web user. Medium is an ideal pseudonym for the default, and should be, like its CSS equivalent, 1rem, the unit upon which all CSS sizes should ultimately be based. Medium should never have been removed from the specification in the first place. It's one of the few hints that CSS is supposed to be a language of suggestion that leaves ultimate control in possession of the reader, the only possible person who can determine the optimal text size for the display in front of his eyes. |
There is an option in the browser in MS-Edge to set an user preferred font-size: with only 4 predefined values. Firefox and Chrome grant more latitude, leeway and fine flexibility than MS-Edge. |
It still comes down to this, as @AmeliaBR said:
Whether browsers offer an option to adjust preferred font size (they do) and whether this is an accessibility benefit (it is) and the precise UI employed and how this scale or zoom is presented to the user, is not the issue here. The issue is, having changed the size, does the browser update what Testing with Amelia's pen in Firefox (60.0b15) Chrome (Canary 68.0.3406.0) and Edge (EdgeHTML 17.17134) all three sizes (100%, medium, 16px) were the same, and all scaled together when zooming. Text can be made as large as you like, and everything scales together. So the low vision accessibility requirement is met, and also is more robust in the real world regardless of how the font size was set; the design scales fluidly. |
Also in Amelia's pen, in Chrome, if I go into settings and change the font size from the default Which means that:
I can see why zooming is a more preferred, and more robust, way to meet the accessibility requirement. |
When users change the size, they are in fact defining, setting the medium size in the user agent style sheet. So, any web author who styles in his/her [author] style sheet, say,
will most likely (and very often) override the user preferred font size for unstyled body text (assuming here that the user prefers a font size different from 13px) when users visit such author's website because that is how cascade order (by origin) works: author (normal or !important) declarations always have precedence over user agent declarations.
Unfortunately, a huge majority of websites will not respect, will not rely on the user's preferred font size. And, as a consequence of this, web accessibility advocacy groups or individuals will write post, blogs, articles, etc... explaining what is the medium font size and relying on that 9-words sentence ... that has been removed from CSS3 and CSS4. One comment about the precise UI employed by browsers. Overall, it is bad and difficult to understand/to figure out (from an ordinary user perspective): AmeliaBR's own comments in this issue with regards to Chrome and MS-Edge supports me on this. But it is also a difficult goal too. That's why many browsers developped (starting around 2012-2014) Reading View and Reading Mode which represent an UI where the user can define an user style sheet with !important declarations. |
Regarding accessibility: Best practice for CSS authors is, and has always been, to define font sizes relative to the user's preferred font size. There are now three ways to do this, which all work equally well in the browsers that allow users to set a preferred font size:
Sadly, far too many web pages do not follow this best practice. So browsers offer a second option: zooming the definition of a pixel. The major downside to this is that it zooms everything on the page, creating blurry images and sometimes strange layouts. It's wonderful that browsers provide this option, but it doesn't replace the benefits of having customizable default font sizes. Regarding this issue in particular: If the only user agents that support customizable font sizes (i.e., changing the default font size as measured in In other words, the following settings on the root element should always be equivalent, and the same as having no font-size declaration at all on the root element: :root {
font-size: 100%;
font-size: 1rem;
font-size: medium;
font-size: initial;
} (and that all the other keywords should adjust up or down relative to In this way, accessibility guides can continue to recommend that authors always use |
That is 1 recommended practice. Many accessibility-oriented, accessibility-advocacy websites also recommend to avoid size smaller than the user's preferred font size.
I think there are 4 ways.
The only way to be sure of this is to examine the user agent style sheet for In an ideal web-world, manufacturers of browsers would use the exact same user agent style sheet and web authors would not bother, would not wonder and would not struggle or hesitate about any of such issues and questions.
That is possible (I have not checked this) but it is unlikely (otherwise this is not optimal, not interoperable) as it would be a reason to complaint and to demand cross-browser compatibility. I know that
|
Ah, of course. I have edited my previous post to include that in with percentages, as it works the same, and has the same drawbacks (gets compounded by inheritance).
I just checked. With the preferred font size of But anyway: all that just goes to confirm that the keywords are not |
Firefox 52.7.3 results of AmeliaBR's codepen test page for larger and smaller only: Such result complies with CSS2.2 (xx-large is 32px in both Chromium 64 and Firefox 52):
coming from CSS 2.2, § 15.7 font size, <relative-size> Chromium 64.0.3282.119 results of AmeliaBR's codepen test page for larger and smaller only: Such results are close but not perfectly, not accurately complying with CSS2.2. Such results clearly indicate a fixed, rigid scaling factor of 1.2 for Chrome. |
Removing Fonts-3 label, if we do decide to change the spec here it would be Fonts-4 |
Why? |
We would never have shipped CSS1 if we had continued tweaking it until it attained some ever-receding perfection. I'm also far from convinced that changing the spec in a direction that is now what is implemented, just because of a statement that used to be in CSS 1 and 2, is the right thing to do. And since the discussion here does not seem close to resolution, holding back Fonts 3 because of it is a bad idea. Fonts 4 is the current active spec (for example, browsers now implement Fonts 3 is the first full definition of webfonts. Webfonts are now used by around 75% of the top 10,000 websites. It is way past time for Fonts 3 to become a W3C Recommendation. |
The reality is: mainstream browsers (Firefox, Chrome, Edge, Safari, Opera) treat and consider 'medium' value to be the user's preferred font size. This is not a wish. This is not enhancement request. This is reality.
I do not understand why you are saying that. CSS3 Fonts says:
and what I am asking for (which is already in CSS2.x) is:
The difference is exactly these 7 words:
|
I did not bring the discussion on the scaling factor of Which GUI browsers develop to allow users to set their preferred font size for normal text is - albeit an interesting discussion to have - not the purpose of this issue. The only thing really involved in this issue are those above-mentioned 7 words missing. |
The Working Group just discussed
The full IRC log of that discussion<dael> Topic: font-size: 'medium' value is the user's preferred font size<dael> github: https://github.com//issues/2430 <dael> chris: It seems...I thought this effected impl and rereading i t looks like this should be t he users default, apperently it already does impact medium. it's restoring language that was in the spec and was removed. Thought it was a change, but I no longer object. We can put the language back. I'd like to hear i f other vendors see a problem. Otherwise trivial change <dael> myles: One thought. Proposal has changed through issue. In Apr 25 post from Amelia it says [reads]. I think that's more specific than original text. Helps me understand what text trying to say. If we make a change, should be one Amelia proposed <dael> Rossen: You're okay with changes? <dael> myles: Yeah <dael> dbaron: One thing we've found in past is if you change the meaning of medium and default font size meaning many web pages break. Turns out to not be a good thing rather then zooming. Maybe that's changing as web changes <dael> myles: One detail, we don't support changing meaning of medium, but do support bumping every font size by a %. No way to effect keywords without effecting font-sizes and that works well <dael> chris: I thinkt hat was the basis for my original reluctance. We seemed to hope that would work in CSS 1, but now you can zoom entire page and that seems more robust and what people do. didn't want to restore on basis of it was in css2. <dael> myles: Q for dbaron. If you change definition of medium to other then 16 pages break, but someone in the issue said chrome and ff allow changing definition of medium <dael> dbaron: We do have a setting and over time it has gotten more hidden, but haven't removed. It's not a great idea to set. <astearns> I have changed that setting and have had pages break <dael> Rossen: What does that leave for this issue? <chris> so we shouldn't really encourage changing it, then <dael> myles: This is a natural pull between browsers custom a11y that they do without spec changes vs something normative the spec can say about how to improve font sizes. dbaron comment on how browsers evolved their solution and maybe normative spec text isn't nec makes sense. Could go either way <dael> chris: Could go either as well. Don't want to encourage people to do a bad practice <dael> Rossen: Leaning resolve no change? <tantek> I don't think we have enough data to justify a specific change on this <chris> fine with no change here if WG so resolves <dael> Rossen: Going to take silence as agree <tantek> +1 <dael> Rossen: Objections to no change to spec, leave piece of text out <chris> +1 <dael> RESOLVED: no change to spec, leave piece of text out |
CSS2.1 and CSS2.2 have this sentence:
"
The 'medium' value is the user's preferred font size and is used as the reference middle value.
"
15.7 Font size: the 'font-size' property
https://www.w3.org/TR/CSS21/fonts.html#font-size-props
https://www.w3.org/TR/CSS22/fonts.html#font-size-props
I am convinced that a lot of web authors do not know this.
Now, in CSS3 and CSS4, such sentence was removed:
https://www.w3.org/TR/css-fonts-3/#font-size-prop
https://drafts.csswg.org/css-fonts/#font-size-prop
https://www.w3.org/TR/css-fonts-4/#font-size-prop
I think it should be reinstated.
The text was updated successfully, but these errors were encountered: