- From: João Pimentel Ferreira <joao.pimentel.ferreira@gmail.com>
- Date: Mon, 25 Oct 2021 20:40:40 +0200
- To: www-validator-css@w3.org
- Message-ID: <CAH2MmxpFrH5zh0Fg75=D1PoXjbXfwQTmB7FR_LZmJD_9VZXcsw@mail.gmail.com>
Please check: https://stackoverflow.com/a/69711789/1243247
================================
Since few days ago W3C CSS validator started to be more strict and started
to give errors on this type of CSS3 implementation (this type of CSS3 files
are everywhere and they were used for example by Google Fonts):
/* vietnamese */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: local('Nunito Regular'), local('Nunito-Regular'),
url("fonts/XRXV3I6Li01BKofIOuaBXso.woff2") format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
font-display: fallback;
}/* latin-ext */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: local('Nunito Regular'), local('Nunito-Regular'),
url("fonts/XRXV3I6Li01BKofIO-aBXso.woff2") format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020,
U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
font-display: fallback;
}/* latin */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: local('Nunito Regular'), local('Nunito-Regular'),
url("fonts/XRXV3I6Li01BKofINeaB.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
font-display: fallback;
}/* vietnamese */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: local('Nunito Bold'), local('Nunito-Bold'),
url("fonts/XRXW3I6Li01BKofAjsOUbuvISTs.woff2") format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
font-display: fallback;
}/* latin-ext */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: local('Nunito Bold'), local('Nunito-Bold'),
url("fonts/XRXW3I6Li01BKofAjsOUb-vISTs.woff2") format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020,
U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
font-display: fallback;
}/* latin */@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: local('Nunito Bold'), local('Nunito-Bold'),
url("fonts/XRXW3I6Li01BKofAjsOUYevI.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
font-display: fallback;
}
With the following error on unicode-range: Too many values or values are
not recognized
Apparently many developers have used unicode ranges with multiple values
and multiples ranges for their fonts because MDN says it is OK
<https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/unicode-range>,
but apparently it is not, since according to W3C docs, the syntax
<https://www.w3docs.com/learn-css/unicode-range.html> for unicode-range is:
unicode-range: single codepoint | codepoint range | wildcard range |
initial | inherit;
That is, apparently many ranges are not possible.
*How to tackle this issue?*
This seems to be a very strict approach of W3C since many browsers support
several ranges, and it indeed saves bandwidth because allows more
flexibility on which font files are to be downloaded.
font-face <https://stackoverflow.com/questions/tagged/font-face>w3c
<https://stackoverflow.com/questions/tagged/w3c>w3c-validation
<https://stackoverflow.com/questions/tagged/w3c-validation>css-validator
<https://stackoverflow.com/questions/tagged/css-validator>unicode-range
<https://stackoverflow.com/questions/tagged/unicode-range>Edit tags
Share <https://stackoverflow.com/q/69697222/1243247>
Edit <https://stackoverflow.com/posts/69697222/edit>
Close 1
Delete
Flag
edited yesterday <https://stackoverflow.com/posts/69697222/revisions>
asked yesterday
<https://stackoverflow.com/users/1243247/jo%c3%a3o-pimentel-ferreira>
João Pimentel Ferreira
<https://stackoverflow.com/users/1243247/jo%c3%a3o-pimentel-ferreira>
10.1k66 gold badges5555 silver badges7474 bronze badges
-
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
see: stackoverflow.com/questions/69585993/…
<https://stackoverflow.com/questions/69585993/error-css-unicode-range-too-many-values-or-values-are-not-recognized-but>
– Luuk <https://stackoverflow.com/users/724039/luuk>
yesterday
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#comment123194773_69697222>
-
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
Does this answer your question? Error: CSS: unicode-range: Too many
values or values are not recognized
<https://stackoverflow.com/questions/69516381/error-css-unicode-range-too-many-values-or-values-are-not-recognized>
– Luuk <https://stackoverflow.com/users/724039/luuk>
yesterday
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#comment123194796_69697222>
-
@Luuk no, they just make a workaround, please read my question
carefully, thanks
– João Pimentel Ferreira
<https://stackoverflow.com/users/1243247/jo%c3%a3o-pimentel-ferreira>
yesterday
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#comment123194811_69697222>
-
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
Multiple ranges are definitely valid. The latest W3C recommendation
standard gives examples of such in 4.6. Using character ranges to define
composite fonts <https://www.w3.org/TR/css-fonts-3/#composite-fonts> as
does the latest Editor's draft
<https://drafts.csswg.org/css-fonts/#example-3fd9c28a>. I conclude that
this is just a bug in the validator.
– Alohci <https://stackoverflow.com/users/42585/alohci>
20 hours ago
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#comment123202220_69697222>
-
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
The spec also says of the unicode-range property
<https://drafts.csswg.org/css-fonts/#unicode-range-desc> "This
descriptor defines the set of Unicode codepoints that may be supported by
the font face for which it is declared. The descriptor value is a
comma-delimited list of Unicode range (<urange>) values."
– Alohci <https://stackoverflow.com/users/42585/alohci>
20 hours ago
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#comment123202301_69697222>
Add a comment
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
| Show *4* more comments
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range#>
2 Answers
Active
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range?answertab=active#tab-top>
Oldest
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range?answertab=oldest#tab-top>
Votes
<https://stackoverflow.com/questions/69697222/w3c-css-validator-is-giving-errors-on-font-face-unicode-range?answertab=votes#tab-top>
1
<https://stackoverflow.com/posts/69711789/timeline>
This is a defect of the validator.
The CSS Fonts Specification defines the unicode-range property
<https://drafts.csswg.org/css-fonts/#unicode-range-desc> as
Value: <urange>#
where <urange> can be any of
single codepoint (e.g. U+416)<br>
a Unicode codepoint, represented as one to six hexadecimal digits
interval range (e.g. U+400-4ff)<br>
represented as two hyphen-separated Unicode codepoints indicating the
inclusive start and end codepoints of a range
wildcard range (e.g. U+4??)<br>
defined by the set of codepoints implied when trailing '?' characters
signify any hexadecimal digit
And the # means <https://drafts.csswg.org/css-values-4/#mult-comma>
.... that the preceding type, word, or group occurs one or more times,
separated by comma tokens (which may optionally be surrounded by white
space and/or comments).
The specification underlines this formal definition in prose:
This descriptor defines the set of Unicode codepoints that may be supported
by the font face for which it is declared. The descriptor value is a
comma-delimited list of Unicode range () values.
It also provides examples. Example 30
<https://drafts.csswg.org/css-fonts/#example-3fd9c28a> is particular useful:
@font-face {
font-family: STIXGeneral;
src: local(STIXGeneral), url(/stixfonts/STIXGeneral.otf);
unicode-range: U+000-49F, U+2000-27FF, U+2900-2BFF, U+1D400-1D7FF;
}
If you submit this to the CSS validator, it will report the same error.
Since the spec is authoritative, the validator must be in error.
João Pimentel Ferreira <https://www.joaopimentel.com>
Received on Friday, 29 October 2021 08:03:12 UTC