Book HomeCascading Style Sheets: The Definitive GuideSearch this book Sunday 25th of February 2018 10:14:13 PM

5.6. Font Matching

As we've seen, CSS allows for the matching of font families, weights, and variants. This is done through font matching, which is a vaguely complicated procedure. Understanding it is important for authors who wish to help user agents make good font selections when displaying their documents. I left it for the end of this chapter because it's not really necessary to understand how the font properties work, and some people will probably want to skip this part and go on to Chapter 6, "Colors and Backgrounds". If you're still interested, here's how font matching works.

In the first step of font matching, the user agent creates, or otherwise accesses, a database of font properties. This database lists the various CSS1 properties of all the fonts to which the UA has access. Typically, this will be all fonts installed on the machine, although there could be others (for example, the UA could have its own built-in fonts). If the UA encounters two identical fonts, it will simply ignore one of them.

Second, the UA takes apart an element to determine which font properties have been applied, and constructs a list of font properties necessary for the display of that element. Based on that list, the UA makes an initial choice of a font family to use in displaying the element. If there is a complete match, then the UA can use that font. Otherwise, it needs to do a little more work.

Third, if there was no font match in step two, the UA looks for alternate fonts within the same font family. If it finds any, then it repeats step two for that font.

Fourth, assuming a generic match has been found, but it doesn't contain everything needed to display a given element -- the font is missing the copyright symbol, for instance -- then the UA goes back to step three, which entails a search for another alternate font and another trip through step two.

Finally, if no match has been made and all alternate fonts have been tried, the UA selects the default font for the given generic font family and does the best it can to display the element correctly.

As you can see, step two gets visited a lot in this process. It can be broken down into more precise steps:

  1. A font is first matched against the font-style. The keyword italic is matched by any font which is labeled as either "italic" or "oblique." If neither is available, then the match fails.

  2. The next match attempt is on font-variant. Any font which is not labeled "small-caps" is assumed to be normal. A font can be matched to small-caps by any font which is labeled as "small-caps," by any font which allows the synthesis of a small-caps style, or by any font where lowercase letters are replaced by uppercase letters.

  3. The next match is to font-weight, which can never fail, thanks to the way font-weight is handled under CSS1.

  4. Web-based Applications

    Web-based applications are similar to app servers, except for one thing: Web-based applications don't have client apps, instead they use web browsers on the client side. They generate their front ends using HTML, which is dynamically generated by the web-based app. In the Java world, Servlets are best suited for this job.

    Web-based apps might themselves rely on another app server to gather information that is presented on the client web browser. Also, you can write Servlets that get information from remote or local databases, XML document repositories and even other Servlets. One good use for web-based apps is to be a wrapper around an app server, so that you can allow your customers to access at least part of the services offered by your app server via a simple web browser. So web-based apps allow you to integrate many components including app servers, and provide access to this information over the web via a simple web browser.

    Finally, font-size is tackled. This must be matched within a certain tolerance, but the tolerance is left to the user agent to define. Thus, one user agent might allow matching within a 20% margin of error, whereas another might allow only 10% differences between the size specified and the size that is actually used.

The whole process is long and tedious, but it helps to understand how user agents pick the fonts they do. For example, you might specify the use of Times or any other serif font in a document, to get what's shown in Figure 5-34.

BODY {font-family: Times, serif;}
Figure 5-34

Figure 5-34. The end result of font matching

For each element, the user agent should examine the characters in that element and determine whether Times can provide characters to match. In most cases, it can do so with no problem. Assume, however, that a Chinese character has been placed in the middle of a paragraph. Times has nothing that can match this character, so the user agent has to either work around the character or look for another font that can fulfill the needs of displaying that element. Of course, any Western font is highly unlikely to contain Chinese characters, but should one exist (let's call it AsiaTimes), the user agent could use it in the display of that one element -- or simply for the single character. Thus, the whole paragraph might be displayed using AsiaTimes, or everything in the paragraph might be in Times except for the single Chinese character, which is displayed in AsiaTimes.

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

1.4.5. CSS Comments

/* These are my styles! Yay! */

CSSalso allows for comments, but it uses a completely different syntaxto accomplish this. CSS comments are very similar to C/C++ comments,in that they are surrounded by /* and*/:

Before delving into the specific mechanisms of positioning, we needto establish a number of concepts. These concepts actually form thefoundation of CSS layout in general since every displayed element canbe described in terms of its positioning. After all, any element thatis placed onscreen, or printed on a piece of paper, has a positionand must therefore be positioned -- by the user agent, if nothingelse.

The containingblock is the context in which formatting takes

By making the W3C the keeper of the XML standard, it ensures that no one vendor should be able to cause interoperability problems to occur between systems that use the open standard. This should be reassuring to most companies making an investment in this technology, by being vendor neutral, this solution proposes to keep even small companies out of reach of big companies choosing to change the standards on them. For example, if a big company chooses to change the platform at its whim, then most other companies relying on that platform suffer. By keeping all data in XML and using XML in communications protocols, companies can maximize the lifetime of their investment in their products and solutions.

XML is language independent

By being language independent, XML bypasses the requirement to have a standard binary encoding or storage format. Language independence also fosters immense interoperability amongst heterogeneous systems. It is also good for future compatilbilty. For example, if in the future a product needs to be changed in order to deal with a new computing paradigm or network protocol, by keeping XML flowing through the system, addition of a new layer to deal with this change is feasible.

DOM and SAX are open, language-independent set of interfaces