Re: [css-d] Multiple webfonts

2011-07-09 Thread Ghodmode 
On Sun, Jul 10, 2011 at 2:52 AM, Jukka K. Korpela  wrote:
> 2011-07-09 21:19, Ghodmode wrote:
>
  >  font-family: 'englishfont', 'chinesefont', Arial, sans-serif;
>>>
>>> [...]

 This fallback does not work for *single characters* in the font.
>>>
>>> That depends on the browser.
>>
>> Nope, that's consistent across IE, Firefox, Chrome, Safari, and Opera.
>
> To see that the fallback works for single characters, do this simple test:
> Foobar ⌀
> You will see "Foobar" in Courier but the diameter sign in Arial Unicode MS.
> To see this even clearer, download and install the LastResort font (which
> shows generic symbols for characters) and put it after Courier in the list.
>
 Your font-family declaration tells the browser to use "chinesefont" if
 "englishfont" is not available/can not be loaded *as a whole*.
>
> No, it means that 'englishfont', if available, will be used for characters
> covered by it. For other characters, 'chinesefont', if available, is used,
> if it contains them. And so on.
>
> IE tends to get this wrong at times.
>
>> Nope, that's exactly how it works in the specification and it's also
>> consistent across all browsers.
>>
>> spec: http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family
>
> That's a general description of the font-family and does not say how the
> font list is really used. That information can be found at
> http://www.w3.org/TR/CSS21/fonts.html#algorithm
> Note the words "At a given element and for each character in that element,
> the UA assembles the font properties".
>

Ya I seem to have misunderstood what I read.  Your example proves
that.  I thought I once read that the fallback only occurs if the
entire font is missing, but I either misunderstood or I read something
that was targeted at IE.

The funny thing is that I don't ever use IE except as the final step
in testing a site.

Thank you.

--
Ghodmode
http://www.ghodmode.com/blog
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Philippe Wittenbergh 

On Jul 10, 2011, at 4:20 AM, Joergen W. Lang wrote:

> Am 09.07.11 19:50, schrieb Jukka K. Korpela:
>> 2011-07-09 19:58, Joergen W. Lang wrote:
>> 
>>> > font-family: 'englishfont', 'chinesefont', Arial, sans-serif;
>> [...]
>>> This fallback does not work for *single characters* in the font.
>> 
>> That depends on the browser.
> 
> Is there a list of browsers that support single glyph substitution and how 
> they do it?

WebKit, Gecko, Opera all do this on all OS I've tested. IE 8 + works correctly 
on WinVista and newer, but I seem to remember seeing failures in IE 8 on Win XP 
(I was testing with hexagrams at the time - but maybe it was that IE didn't 
really like my custom made font…).
IE 7 and older fails completely.

> The specs do not seem to be very specific about the handling of missing glyph 
> substitution. (1,2)

Is the first numbered list in
http://www.w3.org/TR/CSS21/fonts.html#algorithm
not clear enough ?

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/






__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Ted Rolle Jr. 
Thank you!

On Sat, Jul 9, 2011 at 4:20 PM, Jukka K. Korpela  wrote:

> 2011-07-09 22:44, Ted Rolle Jr. wrote:
>
>  Would having the language declaration at the  level mean that
>> there must be two HTML pages?
>> 
>> 
>> 
>> 
>>
>
> No, you would use  to specify the overall (main) language
> of the page and lang attributes in other elements to specify that their
> language is different, e.g.
>
> 
> [...]
> ...
>
> If you additionally use a class attribute, to make styling possible on old
> browsers not supporting language-related selectors, you would write e.g.
>
> 
> [...]
> ...
>
> A simple selector like .zh-TW would suffice if you just have e.g. elements
> containing Chinese inside a document otherwise in English, with no such
> complications as Chinese text containing English.
>
> --
> Yucca, http://www.cs.tut.fi/~**jkorpela/
> __**__**__
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/**mailman/listinfo/css-d
> List wiki/FAQ -- 
> http://css-discuss.incutio.**com/
> List policies -- 
> http://css-discuss.org/**policies.html
> Supported by evolt.org -- 
> http://www.evolt.org/help_**support_evolt/
>



-- 
+-+
| 3.14159 26535 89793 23846 26433 83279 50288   May the Spirit |
|   41971 69399 37510 58209 74944 59230 78164  of pi spread  |
|   06286 20899 86280 34825 32411 70679 82148  around the world.  |
|   08651 32823 06647 09384 46095 50582 ...PI VOBISCUM!|
+-+
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Jukka K. Korpela 

2011-07-09 22:44, Ted Rolle Jr. wrote:


Would having the language declaration at the  level mean that
there must be two HTML pages?






No, you would use  to specify the overall (main) 
language of the page and lang attributes in other elements to specify 
that their language is different, e.g.



[...]
...

If you additionally use a class attribute, to make styling possible on 
old browsers not supporting language-related selectors, you would write e.g.



[...]
...

A simple selector like .zh-TW would suffice if you just have e.g. 
elements containing Chinese inside a document otherwise in English, with 
no such complications as Chinese text containing English.


--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Ted Rolle Jr. 
Newbie question:
Would having the language declaration at the  level mean that there
must be two HTML pages?





-- 
+-+
| 3.14159 26535 89793 23846 26433 83279 50288   May the Spirit |
|   41971 69399 37510 58209 74944 59230 78164  of pi spread  |
|   06286 20899 86280 34825 32411 70679 82148  around the world.  |
|   08651 32823 06647 09384 46095 50582 ...PI VOBISCUM!|
+-+
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Joergen W. Lang 



Am 09.07.11 19:50, schrieb Jukka K. Korpela:

2011-07-09 19:58, Joergen W. Lang wrote:


> font-family: 'englishfont', 'chinesefont', Arial, sans-serif;

[...]

This fallback does not work for *single characters* in the font.


That depends on the browser.


Is there a list of browsers that support single glyph substitution and 
how they do it?


The specs do not seem to be very specific about the handling of missing 
glyph substitution. (1,2)


[...]


Instead, you might want to mark up your page with appropriate language
attributes e.g.:


Maybe, but it's not safe to rely on them in styling.


You seem to be describing mostly IE behavior. ;o)


html:lang(zh-tw) #quotes h4 {


The :lang(...) pseudoclass is not supported by IE 7 and older, so it's
safer to add a class attribute, say class="zh" or class="en", and use
class selectors, which are supported by all CSS-enabled browsers.


I take your point regarding backwards compatibility. OTOH usage of the 
lang attribute is not only semantically correct, but also recommended by 
the W3C (3,4).


Instead of using 'class' a better fallback might be to use a simple 
attribute selector, which actually is supported by IE7. So instead of 
(or in addition to) using :lang, Chris might also use


  html[lang="zh-tw"] #quotes h4 {...}

Jørgen

===

1) http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family:

"The property value is a prioritized list of font family names..."

and

"Although many fonts provide the "missing character" glyph [...] this 
should not be considered a match for characters that cannot be found in 
the font."


2) http://www.w3.org/TR/css3-fonts/#font-family-prop (03/24/2011)

"A user agent iterates through the list of family names until it matches 
an available font that contains *a glyph for the character* to be rendered."


3) http://www.w3.org/International/questions/qa-lang-why.en.php#fonts

4) http://www.w3.org/International/questions/qa-css-lang
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Jukka K. Korpela 

2011-07-09 21:19, Ghodmode wrote:


  >  font-family: 'englishfont', 'chinesefont', Arial, sans-serif;


[...]


This fallback does not work for *single characters* in the font.


That depends on the browser.


Nope, that's consistent across IE, Firefox, Chrome, Safari, and Opera.


To see that the fallback works for single characters, do this simple test:
Foobar ⌀
You will see "Foobar" in Courier but the diameter sign in Arial Unicode 
MS. To see this even clearer, download and install the LastResort font 
(which shows generic symbols for characters) and put it after Courier in 
the list.



Your font-family declaration tells the browser to use "chinesefont" if
"englishfont" is not available/can not be loaded *as a whole*.


No, it means that 'englishfont', if available, will be used for 
characters covered by it. For other characters, 'chinesefont', if 
available, is used, if it contains them. And so on.


IE tends to get this wrong at times.


Nope, that's exactly how it works in the specification and it's also
consistent across all browsers.

spec: http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family


That's a general description of the font-family and does not say how the 
font list is really used. That information can be found at

http://www.w3.org/TR/CSS21/fonts.html#algorithm
Note the words "At a given element and for each character in that 
element, the UA assembles the font properties".


--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Ghodmode 
On Sun, Jul 10, 2011 at 1:50 AM, Jukka K. Korpela  wrote:
> 2011-07-09 19:58, Joergen W. Lang wrote:
>
>>  > font-family: 'englishfont', 'chinesefont', Arial, sans-serif;
>
> [...]
>>
>> This fallback does not work for *single characters* in the font.
>
> That depends on the browser.

Nope, that's consistent across IE, Firefox, Chrome, Safari, and Opera.


>
>> Your font-family declaration tells the browser to use "chinesefont" if
>> "englishfont" is not available/can not be loaded *as a whole*.
>
> You seem to be describing mostly IE behavior.

Nope, that's exactly how it works in the specification and it's also
consistent across all browsers.

spec: http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Jukka K. Korpela 

2011-07-09 19:58, Joergen W. Lang wrote:


 > font-family: 'englishfont', 'chinesefont', Arial, sans-serif;

[...]

This fallback does not work for *single characters* in the font.


That depends on the browser.


Your font-family declaration tells the browser to use "chinesefont" if
"englishfont" is not available/can not be loaded *as a whole*.


You seem to be describing mostly IE behavior.


Instead, you might want to mark up your page with appropriate language
attributes e.g.:


Maybe, but it's not safe to rely on them in styling.


html:lang(zh-tw) #quotes h4 {


The :lang(...) pseudoclass is not supported by IE 7 and older, so it's 
safer to add a class attribute, say class="zh" or class="en", and use 
class selectors, which are supported by all CSS-enabled browsers.


--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Ghodmode 
On Sat, Jul 9, 2011 at 3:32 PM, Chris Blake  wrote:
> Hey,
>
> I am making a website that will be in two languages, English and Chinese. I
> am going to use my own webfonts but the font I am using for the English side
> doesn't have Chinese variations. I have found another font for the Chinese
> and was wondering if I can have more than one custom font e.g.
>
> #quotes h4{
> color: #3B7E71;
> font-family: 'englishfont', 'chinesefont', Arial, sans-serif;
> font-size: 18px;
> }

It will use the first available font from the font-family property.
So, it will use "englishfont" even if that font doesn't have chinese
characters.  You will probably need to wrap the Chinese text in a
different element and set the font-family to 'chinesefont' on that
element.

--
Ghodmode
http://www.ghodmode.com/blog
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Multiple webfonts

2011-07-09 Thread Joergen W. Lang 

Am 09.07.11 09:32, schrieb Chris Blake:
> Hey,
>
> I am making a website that will be in two languages, English and
> Chinese. I am going to use my own webfonts but the font I am using for
> the English side doesn't have Chinese variations. I have found another
> font for the Chinese and was wondering if I can have more than one
> custom font e.g.
>
> #quotes h4{
> color: #3B7E71;
> font-family: 'englishfont', 'chinesefont', Arial, sans-serif;
> font-size: 18px;
> }

This fallback does not work for *single characters* in the font.

Your font-family declaration tells the browser to use "chinesefont" if 
"englishfont" is not available/can not be loaded *as a whole*.


Instead, you might want to mark up your page with appropriate language 
attributes e.g.:



...

你好世界
...

and


...

Hello world
...


In your style sheet you could then say:

html:lang(zh-tw) #quotes h4 {
  font-family: 'chinesefont', Arial, sans-serif;
}

html:lang(en) #quotes h4 {
  font-family: 'englishfont', Arial, sans-serif;
}

ta-da, a simple, language-based style switcher.

hope this helps,

Jørgen



__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/