Source
MMDT1021 Chapter 10 Notes - page 1
| The book is pretty straight forward presenting the material in this chapter. These notes are just to clarify a few things that are not obvious. |
Choosing a Font
| Code | Page |
|---|---|
| Here are several examples of setting a font. | Result Source |
| The book discusses the fonts shared by Mac OS and Windows Arial, Arial Black, Comic Sans MS, Courier New, Georgia, Impact, Trebuchet MS, Times New Roman, and Verdana. |
Result Source |
Choosing a Font Family
| Code | Page |
|---|---|
| The advantage to using a font family, is that you specify alternate fonts and a catch-all generic font in case none of the other fonts are on the system. | Result Source |
Embedding Fonts on a Page
| The procedure to create embedded fonts
is fairly complicated. You need a 3rd party piece of software called
"WEFT" (from Microsoft) to create the embedded font file. Web link
to additional information on WEFT and web font
embedding.
You can create a font file that consists of only the characters used in the HTML document that you created. So if you add more text to your HTML document, you probably have to create a new embedded font file. However the font file is relatively small. Alternatively, you can create a font file that consists of the entire character set. The font file is larger however. To stop copyright infringement and outright theft of fonts, the eot font file is keyed to specific web server names. Firefox does not support the eot font embedding. Too bad font embedding is not implemented by other browerser other that Microsoft. More information on embedding fonts into a web page. Update: The new edition of the book, chapter 13, discusses a newer technique of Web Font embedding with the latest browsers. However a quick investigation on my part shows only the latest browsers support the newest methods. |
| Code | Page |
|---|---|
| An example of an embedded font called "Greek44". | Result Source |
| A good example of an embedded font called "StarTrek". (Courtesy of a couple of CST students!) | Result Source CSS |
Setting an Absolute Font Size
| When setting an absolute font size, the end user cannot change the font size through their browser font size control. This may be good, or bad, depending on the situation. |
| Code | Page |
|---|---|
| Absolute font size. The font size cannot be changed by the user viewing the web page. | Result Source |
Setting a Relative Font Size
| When setting an relative font size, the end user can change the font size through their browser font size control. |
| Code | Page |
|---|---|
| Relative font size. The font size can be changed by the user viewing the web page. | Result Source |
Changing the Text's Background
| I found it interesting that you can specify an image for the background of just a text selection. |
| Code | Page |
|---|---|
| Background image for text. Here
is the image actually used for the background. |
Result Source |