| Register | Members | Calendar | Search |
| Programming Languages A Place for windows applications programs and programmers . |
 |
| LinkBack | Thread Tools | Display Modes |
|
The God Father
 |
|
||
|
The God Father
|
Hour 4
Publishing Your HTML Pages Here it is, the chapter you've been waiting for! Your Web pages are ready for the world to see, and this chapter explains how to get them to appear before the eyes of your intended audience. The most obvious avenue for publishing Web pages is, of course, the Internet. Yet you may want to limit the distribution of your pages to a local intranet within your organization instead of making them available to the general public. You may also choose to distribute your Web pages on CD-ROMs, floppy disks, Zip disks, or the new DVD-ROM disks. This chapter covers all of these options, and offers advice on designing your pages to work best with the distribution method you choose. -------------------------------------------------------------------------------- New Term: An intranet is a private network with access restricted to one organization, but which uses the same standards and protocols as the global public Internet. To Do: Before you read about publishing your pages, you should give some thought to which methods of distribution you will be using. You probably already know if you're going to be publishing on a corporate intranet, but the decision of whether to publish on the Internet or on disk can be harder to make. -------------------------------------------------------------------------------- If you want your pages to be visible to as many people as possible all over the world, Internet publishing is a must. But don't rule out other distribution methods; you can easily adapt Internet-based pages for distribution on disks and/or local networks. If you want to reach a specific group of people who have computers, but may not be on the Internet yet, publish your pages on floppy disk (if there aren't very many of them) or CD-ROM (if you have an extensive site). But first, consider seriously whether you can present the same information on good old-fashioned paper. If you want to provide very large graphics, multimedia, or other content that would be too slow to transfer over today's modems, consider publishing on a CD-ROM. You can easily link the CD-ROM to an Internet Web site, and offer the CD-ROM to people who find you through the Internet, but want the "full experience." Publishing Web Pages on Disk Unless you were hired to create documents for a company intranet, you have probably assumed that the Internet is the best way to get your pages in front of the eyes of the world. But there are three major incentives for considering distribution on some form of disk instead: Currently, more people have disk drives than Internet connections. Disks can deliver information to the computer screen much faster than people can download it from the Internet. You can distribute disks to a select audience, whether or not they are connected to the Internet or any particular intranet. In the not-too-distant future, as Web-enabled televisions and high-speed networks become more commonplace, these advantages may disappear. But for now, publishing on disk can be an excellent way to provide a bigger, faster, and more tightly targeted Web presentation than you could on today's Internet. Publishing on 1.44MB floppy disks or 100MB Zip disks is simply a matter of copying files from your hard disk with any file management program. You just need to keep in mind that any links starting with http:// will only work if and when someone reading your pages is also connected to the Internet. The cost is currently about $0.50 per floppy disk, or $10 per Zip disk, plus any delivery or mailing costs. -------------------------------------------------------------------------------- Time Saver: Never use drive letters (such as C  in <A HREF> link tags on your Web pages or they won't work when you copy the files to a different disk. Refer back to Chapter 3, "Linking to Other Web Pages," for more details on how to make links that will work both on disk and on the Internet. -------------------------------------------------------------------------------- Publishing on CD-ROM or the new DVD-ROM disks isn't much more complicated; you either need a drive (and accompanying software) capable of creating the disks, or you can send the files to a disk mastering and duplication company. Costs for CD-ROM duplication vary a lot depending on how many disks you need. For less than a hundred CD-ROMs, it may cost more than $10 per disk. But for thousands of copies, expect to pay less than $1 each plus delivery or mailing costs. DVD-ROM pricing hasn't settled down yet, but it will eventually be similar to CD-ROM pricing. Setting Up an Internet Web Site To make an HTML page part of the publicly accessible World Wide Web, you need to put it on a Web server (a computer permanently connected to the Internet and equipped to send out Web pages upon request). If you run your own Web server, this procedure is simply a matter of copying the file to the right directory. But most people use a Web server run by an Internet service provider (ISP) to host their pages. Almost all service providers that offer Internet access also offer space to place your own personal Web pages for little or no additional cost. However, if you plan (or even hope) to attract large numbers of people, you should pay a little more money to get a fully supported business site with a major Internet service provider. -------------------------------------------------------------------------------- Time Saver: Don't think that you have to use the same local company that provides you with Internet access to host your pages. If you run a busy business Web site, you may save a lot of money and get more reliable service from a company in another city. For example, I use a company in Vermont to access the Internet, but my Web site is hosted by a different company in Boston. To "comparison shop" the hosting services offered by various Internet service providers, go to the list of ISPs at: http://thelist.com/ -------------------------------------------------------------------------------- Prices for a business site start well under $100 per month, but you usually pay more when lots of people start viewing your pages. For a site with about a hundred different Web pages, I have paid as little as $40 per month when a few thousand people looked at my pages, and as much as $2,000 per month when hundreds of thousands of people looked at my pages. -------------------------------------------------------------------------------- Just A Minute: One of the most important choices you'll need to make when you set up a Web site is the name you want to use as the address of the site. If you aren't willing to pay $100 up front and $50 a year to maintain your own domain name, the address of your site will include the name of your Internet service provider (example: http://www.shore.net/~smith/). If you're willing to pay for it, you can pick any name that isn't already in use by another company (example: http://mister-smith.com/) You can check to see if the name you want is already in use at http://domain-registration.com/ (Or you can just enter the name in your Web browser to see if you get a page.) Once you find a name that isn't already taken, ask your Internet service provider to help you apply for that name as soon as possible. Transferring Pages to a Web Server When a Web server computer sends Web pages to people through the Internet, it uses an information exchange standard called Hypertext Transfer Protocol (HTTP). To upload a page to your Web site, however, you need software that uses an older communications standard called File Transfer Protocol (FTP). -------------------------------------------------------------------------------- New Term: File Transfer Protocol is the standard that your file transfer software must adhere to when sending files to a Web server. The server then sends those files out to anyone who asks for them using the Hypertext Transfer Protocol. -------------------------------------------------------------------------------- Netscape Navigator can receive files using both the HTTP and FTP standards. It can also send files using FTP, so you can use it to upload your pages to a Web server. Follow these steps: 1. Enter the address of your Web directory in Netscape Navigator's Location box, as in the following example: ftp://myname:mypassword@myisp.net/home/web/wherever/ Put your username and password for accessing the site instead of myname and mypassword, your Internet service provider's address instead of myisp.net, and the top-level directory where your Web pages reside instead of /home/web/wherever/. 2. Drag the icons for the HTML and graphics files you want to upload from any Windows 95 file management program (such as Windows Explorer) into the Netscape Navigator window. 3. A dialog box appears and asks you whether you want to upload the files. Click OK, and wait while the files are transferred. 4. Test your page by clicking on the HTML file you just uploaded in the FTP directory listing (in the Netscape window). You're on the Web! Even though Netscape Navigator 2.0 or 3.0 can send files to any Web server on the Internet, specialized FTP programs such as WS_FTP or CuteFTP offer much more control for managing your Web pages. For example, Navigator doesn't give you any way to delete an old Web page that you want to get rid of, or change the name of a Web page on the server computer. You'll definitely want a specialized FTP program to maintain your Web site. Figure 4.1 shows one of the most popular FTP programs, CuteFTP for Windows. You can download a free copy of CuteFTP (see the following "To Do:" section), though CuteFTP does require a modest registration fee for business users. (See the documentation that comes with the program for details.) Similar programs are available for Macintosh computers (Fetch is a popular favorite), and FTP utilities come pre-installed on most UNIX computers. You can find these and other FTP programs at http://www.shareware.com. Figure 4.1. CuteFTP is a powerful and user-friendly FTP program that individuals can use for free. To Do: I recommend that you download CuteFTP now and use it to send some files to your own Web site as you read on (if you have a Web site set up, that is). Go to the CuteFTP home page at http://www.cuteftp.com/ and follow the Download CuteFTP links. Once the download is complete, run the self-extracting .exe program, which will install the CuteFTP program. No matter which FTP program you choose, transferring your Web pages to a Web server involves the following steps. (The steps are illustrated here with CuteFTP, but other FTP programs work similarly.) 1. Before you can access the Web server, you must tell your FTP program its address, as well as your account name and password. In CuteFTP, select a category for your site in the FTP Site Manager window (Personal FTP Sites in Figure 4.2), and click Add site to access the FTP Site Edit dialog box in Figure 4.3. Figure 4.2. CuteFTP includes an intuitive FTP Site Manager, though most Web page authors only need a single FTP site entry. Figure 4.3. Clicking on Add site or Edit site in Figure 4.2 brings up this dialog box. 2. Here's how to fill in each of the items in Figure 4.3. Site Label is the name you'll use to refer to your own site. Nobody else will see this name, so enter whatever you want. Host Address is the FTP address of the Web server that you need to send your Web pages to. This usually (but not always) starts with ftp. Notice that it may or may not resemble the address that other people will use to view your Web pages. The Internet service provider that runs your Web server will be able to tell you the correct address to enter here. User ID and Password are also issued by the company that runs the Web server. Be aware that CuteFTP (and most other FTP programs) will remember your password automatically, which means that anyone who has physical access to your computer may be able to modify your Web site. You should set the Login type to Normal unless somebody important tells you otherwise. (The Anonymous setting is for downloading files from public FTP services that don't require user IDs or passwords.) Set the Transfer type to Auto-Detect. (This will automatically send HTML and other text files using a slightly different protocol than images and other non-text files, to ensure complete compatibility with all types of computers.) For the Initial Remote Directory, fill in the name of the main directory folder on the Web server where your Web pages will be located. The people who run your Web server will tell you the name of that directory. (In some cases, you don't need to enter anything here, because the Web server computer will automatically put you in the directory when you connect to it.) For the Initial Local Directory, enter the drive and directory folder on your computer's hard drive, where you keep your Web pages. Normally, you won't need to change the Port, Retry, Delay, Max Safe Index Size, and Host Type settings unless you experience problems with your connection. If that happens, have your service provider help you figure out the best settings. You should also make sure that Use firewall and the other check box options are unchecked unless someone in the know says to check them. You can enter any Comments or reminders to yourself that you like. Only you will see them. 3. When you click OK, you'll go back to the window shown in Figure 4.2. Make sure you are connected to the Internet, and click Connect to establish a connection with the Web server computer. Most server computers issue a short message to everyone who connects to them. Many FTP programs ignore this message, but CuteFTP presents it to you as shown in Figure 4.4. It seldom says anything important, so just click OK. Figure 4.4. CuteFTP displays the "boilerplate" message that some server computers send whenever you connect to them. 4. Once you're connected to the server, you'll see two lists of files, as shown earlier in Figure 4.1. The left window pane lists the files on your computer, while the right pane lists the files on the server computer. To transfer a Web page to the server, select the HTML file and any accompanying image files in the left window. (Remember that you can hold down the Ctrl key and click the mouse to select multiple files in any Windows program.) Then select Commands | Upload, as in Figure 4.5, or click on the Upload button on the toolbar. As you can see, the same menu contains commands to delete or rename files (on either your computer or the server), as well as commands to make and change directory folders. -------------------------------------------------------------------------------- Time Saver: Most Web servers have a special name for the file that should be sent if someone doesn't include a specific filename when they request a page. For example, if you go to http://netletter.com/, my Web server will automatically give you the welcome.htm file. Other Web servers use different names for the default file, such as index.html. Be sure to ask your service provider the default filename so you can give your home page that name. -------------------------------------------------------------------------------- Figure 4.5. To send files to the server, select Commands | Upload in CuteFTP. 5. That's all there is to it! In most cases, you can immediately view the page you just put on the Web server using Netscape Navigator (see Figure 4.6) or Microsoft Internet Explorer. Figure 4.6. Most Web servers make pages immediately available on the Internet seconds after you upload them. 6. When you're done sending and modifying files on the Web server, select FTP | Disconnect to close the connection. The next time you need to upload some Web pages, you won't need to fill in all the information in step 2. You can just click Connect, select the pages you want to send, and click on the Upload button. -------------------------------------------------------------------------------- Just A Minute: Most Web servers are set up so that any documents placed onto them are immediately made available to the entire World Wide Web. However, some require that users manually change file permission settings, which control who is allowed to access individual files. Your Internet service provider can tell you exactly how to change permission settings on their server and whether it's necessary to do so. -------------------------------------------------------------------------------- Putting Web Pages on an Intranet The procedure outlined above for sending pages to a public Internet server is fairly standard. But the internal workings of private corporate intranets vary considerably from company to company. In some cases, you may need to use an FTP program to send files to an intranet server. In others, you may be able to transfer files using the same file management program you use on your own computer. You may also need to adjust permission settings, or make special allowances for the firewall that insulates a private intranet from the public Internet. About all I can tell you here in this book about putting files on your company's intranet is to consult with your systems administrator. He can help you put your Web pages on the company server in the way that best ensures their accessibility and security. Testing Your Pages Whenever you transfer Web pages to a disk, Internet site, or intranet server, you should immediately test every page thoroughly. The following checklist will help you make sure everything on your pages behaves the way you expected. 1. Before you transfer the pages, follow all of these ten steps to test the pages while they're on your hard drive. After you transfer the pages to the master disk or Web server, test them again--preferably through a 28.8Kbps modem connection, if your pages are on the Internet. 2. Do each of the following steps with the latest version of Netscape Navigator, the latest Microsoft Internet Explorer, and at least one older browser such as DOS Lynx or Netscape Navigator 2.0. 3. Make sure the computer you're testing with is set to a 16-color video mode, or at most a 256-color mode. (Pages look better in higher color modes, but you want to see the "bad news" of how they'll look to most people.) 4. If possible, use a computer with 800x600 resolution for testing purposes, but adjust the size of the browser window to exactly 640x480 pixels. On each page, use the Maximize button on the corner of the window to switch back and forth between full 800x600 resolution and 640x480 resolution. If pages look good at these two resolutions, they'll probably look fine at larger resolutions, too. (Additional testing at 1024x768 or 1600x1200 resolution isn't a bad idea, though.) 5. Turn off auto image loading in Netscape Navigator before you start testing, so you can see what each page looks like without the graphics. Check your ALT tag messages, then hit the Load Images button on the toolbar to load the graphics and review the page carefully again. 6. Use Microsoft Internet Explorer's Font Size button (the big A on the toolbar) to look at each page at all font sizes, to ensure that your careful layout doesn't fall to pieces. 7. Start at the home page and systematically follow every link. (Use the Back button to return after each link, then click the next link on the page.) 8. Wait for each page to completely finish loading, and scroll down all the way to make sure all images appear where they should. 9. If you have a complex site, it may help to make a checklist of all the pages on your site to make sure they are all tested. 10. Time how long it takes each page to load through a 28.8Kbps modem, preferably when connected through a different Internet service provider than the one who runs the Web server. Then multiply that time by two to find out how long 14.4Kbps modem users will need to wait to see the page. Is the information on that page valuable enough to keep them from hitting the Stop button and going elsewhere before the page finishes loading? If your pages pass all those tests, then you can be pretty certain that they'll look great to every Internet surfer in the world. Summary This chapter gave you the basic knowledge you need to choose between the most common distribution methods for Web pages. It also guided you through the process of placing Web pages on a Web server computer using freely available file transfer software. Finally, it offered a checklist to help you thoroughly test your Web pages once they are in place. Q&A Q When I try to send pages to my Web site from home, it works fine, but when I try it from the computer at work, I get error messages. Any idea what the problem might be? A The company where you work probably has a firewall, which is a layer of security protecting their local network from tampering via the Internet. You will need to set some special configuration options in your FTP program to help it get through the firewall when you send files. Your company's network administrator can help you with the details. Q I don't know which Internet service provider to pick to host my pages--there are so many! How do I choose? A Obviously, you should compare prices of the companies listed at http://thelist.com that provide hosting services, but you should also ask for the names of some customers with sites about the same size as you plan yours to be, and ask them (via e-mail) how happy they are with the company's service and support. Also, make sure that your provider has at least two major (T3 or bigger) links to the Internet, preferably provided to them by two different network companies. Q All the tests you recommend would take longer than creating my pages! Can't I get away with less testing? A If your pages aren't intended to make money or provide an important service, then it's probably not a big deal if they look funny to some people or produce errors once in a while. In that case, just test each page with a couple of different window and font sizes and call it good. However, if you need to project a professional image, there is no substitute for rigorous testing. Q I wanted to name my site jockitch.com, but Proctor and Gamble beat me to it. Is there anything I can do? A Well, if your company was named Jockitch, Inc., before Proctor and Gamble registered the word as a trademark, you could always try suing them. (Good luck.) Yet even if you don't have the budget to take on their lawyer army, there may be hope. Many new three-letter extensions for site names will probably soon be approved for use, so you may be able to get jockitch.inc or jockitch.biz (if P&G doesn't scoop you again). Quiz Questions 1. How do you put a few Web pages on a floppy disk? 2. Suppose your Internet service provider tells you to put your pages in the /top/user/~elroy directory at ftp.bigisp.net, your username is elroy, and your password is rastro. You have the Web pages all ready to go in the \webpages folder on your C drive. Where do you put all that information in CuteFTP so you can get the files on the Internet? 3. What address would you enter in Netscape Navigator to view the Web pages you uploaded in Question 2? 4. If the following Web page is named mypage.htm, which files would you need to transfer to the Web server to put it on the Internet? <HTML><HEAD><TITLE>My Page</TITLE></HEAD> <BODY BACKGROUND="joy.gif"> <IMG SRC="me.jpg" ALIGN="right"> <H1>My Web Page</H1> Oh happy joy I have a page on the Web!<P> <A HREF="otherpage.htm">Click here for my other page.</A> </BODY></HTML> |
|
|||
|
The God Father
|
Hour 6
Font Control and Special Characters This chapter gives you the power to decide what size, color, and typeface should be used to display any text on your Web pages. It also shows you how to create special symbols, such as the copyright mark and European language characters such as the é in Café. Font Size and Color To set the size and color of any text on a Web page, use the <FONT> tag: <FONT SIZE=5 COLOR="purple">This text will be big and purple.</FONT> The SIZE attribute can take any value from 1 (tiny) to 7 (fairly big), with 3 being the normal default size. The COLOR attribute can take any of the following standard color names: black, white, red, green, blue, yellow, aqua, fuchsia, gray, lime, maroon, purple, navy, olive, silver, or teal. -------------------------------------------------------------------------------- Just A Minute: The <BIG> and <SMALL> tags discussed in Chapter 5, "Text Formatting and Alignment," produce effects that you can also achieve with <FONT SIZE>. <FONT SIZE> gives you more precise control over the size, but <BIG> and <SMALL> may work with some older browsers that don't support the <FONT> tag. -------------------------------------------------------------------------------- The actual size and exact color of the fonts will depend on each reader's screen resolution and preference settings, but you can be assured that SIZE=6 will be a lot bigger than SIZE=2, and that COLOR="red" will certainly show its fire. -------------------------------------------------------------------------------- Just A Minute: You'll learn more about controlling the color of the text on your pages in Chapter 13, "Backgrounds and Color Control." That chapter also shows you how to create your own custom colors and control the color of text links. -------------------------------------------------------------------------------- Choosing a Typeface With the 3.0 versions of both Navigator and Internet Explorer, Netscape and Microsoft have added another extremely powerful form of font control: the <FONT FACE> attribute. This allows you to specify the actual typeface that should be used to display text--and has been the source of much rejoicing among Webmasters who are awfully sick of Times and Courier! The page in Figures 6.1 and 6.2 uses these font controls to present a warmly welcoming homestyle site. The code to set the typeface used for the headings in Figure 6.1 is: <FONT FACE="Copperplate Gothic Bold" SIZE=5 COLOR="red"> If Netscape Navigator or Microsoft Internet Explorer can find a font named Copperplate Gothic Bold on a user's system, that font is used. Otherwise, they will use the default font (usually Times New Roman). Browsers other than Navigator 3.0 and Internet Explorer 3.0 will ignore the FONT FACE attribute and display the fonts they always use. You can also specify a "second choice" font, for people who don't have your first choice font installed on their computer. For example, I used the following tag to choose the body text in Figure 6.1: <FONT FACE="Lucida Handwriting, Comic Sans MS" SIZE=4 COLOR="maroon"> Figure 6.1. The <FONT> tags give you control over the size, color, and typeface of any text. Figure 6.2. If you have the Copperplate Gothic Bold and Lucida Handwriting fonts installed on your computer, they will be used to display the page in Figure 6.1. Anyone who has Comic Sans MS (a very common font) installed, but doesn't have Lucida Handwriting (a slightly less common font), will see the body text as it appears in Figure 6.3. Figure 6.3 also shows what the headings look like to people who don't have the Copperplate Gothic Bold font. Figure 6.3. Someone without the two fonts specified in Figure 6.1 (but with Comic Sans MS) would see this instead of Figure 6.2. Currently, only fonts that each user happens to have on his or her system will show up, and you have no control over which fonts are installed. Furthermore, the exact spelling of the font names is important, and many common fonts go by several slightly different names. Extensions to HTML will soon support a new, highly compact font format that can be automatically downloaded along with your pages to solve these problems. For now, you just have to stick to the most common fonts and make sure your pages still look acceptable in Times New Roman. Figure 6.4 shows the most common TrueType fonts, many of which are also available in PostScript format. Microsoft offers a number of these fonts available for free download from this site: http://www.microsoft.com/truetype/ Microsoft has also included these fonts (and variations on them) in Windows and other popular software packages, as indicated in Figure 6.4. -------------------------------------------------------------------------------- Time Saver: To make all the text in Figure 6.4 larger, I put <BASEFONT SIZE=5> just after the <BODY> tag. (I did the same thing in Figure 6.5, too.) <BASEFONT> is just a time-saving tag for setting the overall size of all text in a document. The size of all headings will also be relative to the <BASEFONT SIZE>. This tag can't take any attributes other than SIZE, and doesn't require a closing </BASEFONT> tag. -------------------------------------------------------------------------------- Figure 6.4. The most popular TrueType fonts are good bets for inclusion in your Web pages. (Arial is especially reliable.) If you want to use a font on your Web page that isn't on this list, don't be afraid to do so! The user will never see an error message if the font can't be found; the worst thing that could happen is that the user won't see your special font, but will still see the text in the next best font that can be found. If one of the fonts in Figure 6.4 has a similar feel to the one you want, include it as a "second choice" as I did with Comic Sans MS in the preceding example. To Do: All the Web pages associated with a single "site" should usually use the same fonts and text color scheme. You don't need to be a professional typographer to make good font choices if you follow the guidelines below. If you are a professional typographer, you know how to break these rules and still make a page look great. If you try to deviate from them without much experience, however, your pages are likely to stand out as very "unprofessional" looking, even to people who can't articulate exactly why. Always choose a typeface with serifs (those little beveled points on the edges of the letters) for the main body of your text. The serif typefaces that a significant number of people are likely to have installed are Times New Roman, Georgia, Book Antiqua, and Calisto MT. For headings, choose a heavy typeface without serifs, such as Arial Black, Impact, or Copperplate Gothic Bold. For captions and other short passages of text, either use your body text font or a "light" version of your heading font, such as Arial or Copperplate Gothic Light. Medium-weight fonts without serifs are suitable for both headings and short passages of text. These include Arial, Trebuchet MS, Verdana, Lucida Sans, Lucida Sans Unicode, and News Gothic MT. Use one color for all body text, and either the same color or a "stronger" complementary color for all headings and captions. Unless you are an experienced graphics designer, stay with a dark color such as black, blue, maroon, olive, or purple for body text, and put it on a contrasting, light background. If you want a wilder color, headings (and graphics images) are the best place for it. Use ornamental fonts like Comic Sans MS, Lucida Handwriting, and OCR A Extended very sparingly and for main headings or highly stylistic pages only. Better yet, reserve these fonts for use in graphics images where you can also accent them with textures, shadows, or other effects. If your company has a standard set of TrueType or PostScript fonts for all communications, specify those fonts as the first choice in your <FONT FACE> tags. However, you should always include one or two "second choice" fonts from Figure 6.4 as well. Special Characters Most fonts now include special characters for European languages, such as the accented e in Café. There are also a few mathematical symbols and special punctuation marks such as the circular * bullet. You can insert these special characters at any point in an HTML document by looking up the appropriate codes in Table 6.1. (This table includes only the most commonly used codes for English-language usage. You'll find a complete table of all special characters for European language fonts in Appendix B, "HTML Quick Reference.") For example, the word Café would look like this: Café Each symbol also has a mnemonic name that might be easier to remember than the number. Another way to write Café, for instance, is: Café Notice that there are also codes for the angle brackets (< >), quote symbol ("), and ampersand (&) in Table 6.1. You need to use the codes if you want these symbols to appear on your pages, because the Web browser will otherwise interpret them as HTML commands. In Figures 6.5 and 6.6, several more of the symbols from Table 6.1 and Appendix B are shown in use. Figure 6.5. Special character codes begin with &# and end with ;. Figure 6.6. This is how the HTML page in Figure 6.5 will look in most (not all) Web browsers. -------------------------------------------------------------------------------- Time Saver: Looking for the copyright (Š) or registered trademark (Ž) symbols? The codes you need are © and ® respectively. To create an unregistered trademark (&tm  symbol, use <SUPER>TM</SUPER> or <SMALL><SUPER>TM</SUPER></SMALL> for a smaller version. -------------------------------------------------------------------------------- Table 6.1 lists some of the special characters you might need to use on your Web page. Table 6.1. Important special characters. Character Numeric Code Code Name Description " " " Quotation mark & & & Ampersand < < < Less than > > > Greater than cents ˘ ¢ Cent sign [sterling] Ł £ Pound sterling | Ś ¦ or brkbar; Broken vertical bar SS § § Section sign Š Š © Copyright Ž Ž ® Registered trademark deg. ° ° Degree sign +/- ą ± Plus or minus 2 ˛ ² Superscript two 3 ł ³ Superscript three . ˇ · Middle dot 1 š ¹ Superscript one [dieresis] ź ¼ Fraction one-fourth ' ˝ ½ Fraction one-half p ž ¾ Fraction three-fourths Æ Ć Æ Capital AE ligature æ ć æ Small ae ligature É É É Accented capital E é é é Accented small e x × Multiply sign / ÷ Division sign -------------------------------------------------------------------------------- Just A Minute: Some older Web browsers will not display many of the special characters in Table 6.1. Some fonts may also not include all of these characters. See Table B.1 in Appendix B for a complete list of special symbols and European language characters. -------------------------------------------------------------------------------- The Future of Web Fonts There are two major advances in the works which promise to revolutionize Web page typography. Neither of these advances is ready for widespread use today, but you should be aware of them and plan on learning about them when the revolution hits. Cascading Style Sheets (CSS) will be part of the next HTML standard, but they work very differently from normal HTML. You will be able to create a special document containing only information about the fonts and formatting to be used on a Web page. This document, called a style sheet, can then be linked to any number of Web pages so they will all have a consistent style. Style sheets offer two huge time-saving advantages. Because a single style sheet may control the appearance of many pages, you can change the look and feel of your entire Web site just by changing a single style sheet. For complex Web sites, this might save you from spending hours modifying each page individually. The second big advantage of style sheets is that they will allow more precise control over the appearance of your pages than any previous version of HTML. You will be able to set the exact line spacing, font metrics, margins, and paragraph indentation for any text. You'll also have the ability to put colored boxes behind any text, and wield more control over multiple-column text than you can today. When you want a document, or a part of a document, to be a little different, you can put style information at any point in that document to override part of its style sheet. (The idea is that styles "cascade" down from the style sheet to the document, and then to specific parts of the document. At any point in that cascade, new styles may "flow in." That's why they're called "cascading style sheets.") -------------------------------------------------------------------------------- Just A Minute: If you'd like to start learning about style sheets today, Microsoft Internet Explorer 3.0 supports some of the simpler aspects of HTML style sheets. The Internet Explorer Web site at http://www.microsoft.com/ie/ offers a quick style sheet tutorial. Upcoming versions of Microsoft Internet Explorer and Netscape Navigator promise full support of the new CSS standard. -------------------------------------------------------------------------------- The other revolutionary advance in typography that's afoot is font embedding. This will allow you to retrieve the actual typeface along with a Web page, so even people who don't have the correct font preinstalled on their computer will see it on the page. There has been a standard for embedding TrueType fonts in documents for a while, but it doesn't yet include some features that are necessary for it to work with Web pages. The most important feature to be added is font compression, which minimizes the file size of fonts so they can be transferred over the Internet quickly. Transferring only the letterforms actually used in a document and allowing font publishers to control how the font can be reused are also key features to make font embedding a reality. The upcoming OpenType font standard will also combine both TrueType and PostScript (the two competing font formats) into a single standard. Support for font embedding should appear in Netscape Navigator and Microsoft Internet Explorer at the same time as style sheet support. These two technologies together will dramatically expand your ability to control the appearance of your Web pages. -------------------------------------------------------------------------------- Coffee Break: At the 24-Hour HTML Café, I chose Georgia as the main font for body text. Because I wanted to use fonts that most people don't have installed for headings, I used Paint Shop Pro to render all headings as graphics. When embedded fonts become a reality, I may choose to replace some of the graphics at the Café with regular headings that use the Parisian and Present Script fonts. -------------------------------------------------------------------------------- In the meantime, check it out at: http://www.mcp.com/sams/books/235-8/cafe6.htm (You'll also notice that I used one of the codes discussed under the Special Characters section to finally spell Café with the accent-acute it deserves!) If you go to the address above and still see most of the text as Times New Roman, you don't have Georgia installed on your computer yet. I highly recommend that you download it from Microsoft by going to http://www.microsoft.com/truetype/ and following the "free Web fonts" link. Georgia will be included with future versions of Microsoft Internet Explorer, and is likely to become a popular font on the Web due to its excellent readability and stylish appearance at low resolutions. While you're at Microsoft, pick up Verdana, Trebuchet, and whatever new free fonts they have, too. Then go back to the 24-Hour HTML Café for links to some sample pages that use them. Summary This chapter has shown you how to control the size, color, and typeface of any section of text on a Web page. This chapter also provided an overview of some exciting advances in font control that are just around the bend, including HTML style sheets and font embedding. Table 6.2 summarizes all the tags and attributes covered in this chapter. (See Table B.1 in Appendix B for special character codes.) Table 6.1 Summary of tags and attributes covered in Chapter 6. Tag Attribute Function <FONT>...</FONT> Controls the appearance of the enclosed text. SIZE="..." The size of the font, from 1 to 7. Default is 3. Can also be specified as a value relative to the current size; for example, +2. COLOR="..." Changes the color of the text. FACE="..." Name of font to use if it can be found on the user's system. Multiple font names can be separated by commas, and the first font on the list that can be found will be used. <BASEFONT> Sets the default size of the font for the current page. SIZE="..." The default size of the font, from 1 to 7. Q&A Q How do I find out the exact name for a font that I have on my computer? A On a Windows or Macintosh computer, open the Control Panel and click on the Fonts folder. The TrueType fonts on your system will be listed. Use the exact spelling of font names when specifying them in the <FONT FACE> tag. Windows 95 users can view all the characters in any font with the Character Map utility, usually located in the Accessories folder. To find the name of PostScript fonts in Windows if you use Adobe Type Manager, run the ATM Control Panel. Q How do I put Kanji, Arabic, Chinese, and other non-European characters on my pages? A First of all, everyone who you want to be able to read these characters on your pages must have the appropriate language fonts installed. They must also have selected that language character set and font under Options | General Preferences | Fonts in Netscape Navigator or View | Options | General | Fonts in Microsoft Internet Explorer. You can use the Character Map accessory in Windows 95 (or a similar program in other operating systems) to get the numerical codes for each character in any language font. If the character you want has a code of 214, use Ö to place it on a Web page. The best way to include a short message in an Asian language (such as We speak Tamil--Call us!) is to include it as a graphics image. That way everyone will see it, even if they use English as their primary language for Web browsing. Quiz Questions 1. How would you say, "We're having our annual Nixon Impeachment Day SALE today!" in normal-sized blue text, but with the word "SALE" at the largest possible size in bright red? 2. How would you make all text on a page green and a little larger than normal, but make all headings yellow? 3. How do you say "Š 1996, Webwonks Inc." on a Web page? |
|
|||
|
The God Father
|
|
||
|
The God Father
|
|
||
|
| Bookmarks |
| Tags |
| day, html |
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Thread Tools | |
| Display Modes | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| HTML Tables | Developer | Articles | 0 | 28-10-2008 06:57 PM |
| HTML Attributes | Developer | Articles | 0 | 28-10-2008 06:37 PM |
| Lesson : HTML Linking to E-Mail in HTML Tutorial | Developer | Articles | 0 | 17-10-2008 09:14 PM |
| Html 4.01 | Developer | Articles | 0 | 03-09-2008 10:26 PM |
| What is HTML? | Developer | Articles | 0 | 03-09-2008 10:24 PM |
| Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read |
Linear Mode
