| To make your page more interesting and easier to read, you can change the fonts that are used to display text. Although a great deal of information is available concerning how type is used for print media, not all of that knowledge translates to the Web. Generally, sans-serif fonts are easier to read than serif fonts on computer screens. Typically, serif fonts are used in print media because the serifs (the small strokes or flares on the ends of the lines) make characters easier to recognize. On a computer screen, however, those same serifs can actually make it more difficult to discern letter forms, particularly when large amounts of text are involved or when the text in question uses a relatively small font size. It is also important to consider that the way type flows on a page can vary from browser to browser, and from computer to computer. To define font options, Dreamweaver uses integrated CSS styles instead of the older method of using font tag attributes. You can change the font for the entire page or for selected text on the page, as you will see in the following exercise. | | 1. | From the Page font menu in the Appearance category of the Page Properties dialog box, choose Arial, Helvetica, sans-serif. Click OK to close the Page Properties dialog box.
 All the text on the page is now formatted in one of the fonts in the list you selected: Arial, Helvetica, sans-serif. Any additional text that you might add to the page in the future will be formatted in the same font.
Note The Page Properties dialog box generates an internal CSS style to redefine a set of tags (body, td, th) with the font attribute. External CSS styles are covered later in this lesson. The font combinations that are listed in the Page font menu of the Appearance category on the Page Properties dialog box instruct the browser to display the text using a font in the selected group, depending on which fonts are installed on the visitors' computers. If the first option in the font group is not available, the browser attempts to use the second font option. If the second font is not available, it uses the third one. If none of the fonts in the combination is available on the user's computer, the text is displayed in the browser's default font.
| | | 2. | Select the text Anusara Yoga in the Heart of San Francisco's Mission District near the top of the page. From the Property inspector's Font menu, choose Courier New, Courier, monospace.
The font set you chose for the tag line overrides the default font set that was specified for the page. The font combinations available to choose from in the Font menu on the Property inspector are the same as the font combinations that were listed in the Page Font menu of the Appearance category on the Page Properties dialog box.
 Tip A number of formatting options can be applied directly in the Document window to selected text if you right-click (Windows) or Ctrl-click (Macintosh) to access the context menu. For visitors to your site to see the text displayed in the fonts that you chose, those fonts must be installed on their computers. Don't assume that all fonts are loaded on everyone's computer. Any fonts not included with the basic operating system are potentially not on your visitors' machines. In addition, the availability of fonts is not the same on the Macintosh as it is on Windows. The fonts specified in Dreamweaver's default font sets are generally available on most computers, both Macintosh and Windows.
Note If you want to use a special font that might not be installed on a visitor's computer, it is recommended that you create a graphic to use in place of the text. This technique is often used for headers, titles, and so on. Graphics are not recommended for large amounts of text because they restrict accessibility and can make updating content more difficult. The font combinations (such as Arial, Helvetica, sans-serif) are useful, but they might not always include the specific fonts you want to use. You can change a font combination by choosing Edit Font List from the Property inspector's Font menu or by choosing Text > Font > Edit Font List to display the Edit Font List dialog box.
 Using the Font List dialog box, you can make a number of changes to font sets:
- To add fonts to an existing combination: Select the font combination you want to modify in the Font list and select the font you want to add in the Available fonts list; then click the left directional button located between the Chosen fonts list and the Available fonts list to add the font to the Chosen fonts list.
- To remove fonts from an existing combination: Select the font combination you want to modify and select the font you want to remove from the Chosen fonts list; then click the right directional button located between the Chosen Fonts list and the Available Fonts list to remove the font from the Chosen fonts list.
- To add a font combination: Select the Add fonts in list below choice in the Font list. For additional font combinations, click the plus sign (+) button in the upper-left corner of the dialog box and then select the new Add fonts in list below choice from the Font list.
- To remove a font combination: Select the font combination you want to remove from the Font list and click the minus sign () button in the upper-left corner of the dialog box.
- To add a font that is not installed on your system: Type the font name in the text field below the Available fonts list and click the directional arrow to add it to the combination. Adding a font that is not installed on your system is useful; you can specify a Windows-only font when you are authoring on a Macintosh, for example. Be sure to use the exact font name.
- To change the order of the font combinations: Select a font combination and click the directional arrow buttons in the upper-right corner of the dialog box.
The Available fonts list in the Edit Font List dialog box contains the fonts that are installed on your computer.
| 3. | Save the file and preview it in the browser.
|
The text now displays with the fonts you selected in your browser, depending on which fonts are installed on your computer. Tip You can remove font settings on a page and return selected type to its default setting by first selecting the text that uses the font you want to remove. In the Property inspector, choose Default Font from the Font menu or choose Text > Font > Default Font.
|
