Before you begin creating your own Web pages with HTML, you need some backgroundknowledge about what Web pages are, how they work, and what you can expect to achievewith them. This chapter provides a quick summary of those basics and some practicaltips to make the most of your time as a Web page author and publisher. To Do: Thisbook assumes that you have spent some time exploring Web pages on the Internet. Ifyou haven't, please take at least a couple of hours to do so now. Trying to produceyour own Web pages without having "surfed" the World Wide Web would belike trying to become a famous author without ever having seen a piece of paper!
Here's a review of what you need to do before you're ready to use the rest ofthis book:
Just A Minute: If you plan to put your HTML pages on the Internet (as opposed to publishing them on CD-ROM or a local intranet), you'll need to transfer them to a computer that is connected to the Internet 24 hours a day. The same company or school that provides you with Internet access may also let you put Web pages on its computer; if not, you may need to pay another company to "host" your pages. You can start learning HTML with this book right away and wait to find an Internet host for your pages when they're done. However, if you want to have a place on the Internet ready for your very first page as soon it is finished, you may want to read Chapter 4, "Publishing Your HTML Pages," before you continue.
Once upon a time, back when there weren't any footprints on the moon, some far-sightedfolks decided to see whether they could connect several major computer networks together.I'll spare you the names and stories (there are plenty of both), but the eventualresult was the "mother of all networks," which we call the Internet.
Until 1990, accessing information through the Internet was a rather technicalaffair. It was so hard, in fact, that even Ph.D.-holding physicists were often frustratedwhen trying to swap data. One such physicist, the now famous Tim Berners-Lee, cookedup a way to easily cross-reference text on the Internet through "hypertext"links. This wasn't a new idea, but his simple Hypertext Markup Language (HTML) managedto thrive while more ambitious hypertext projects floundered.
By 1993, almost 100 computers throughout the world were equipped to serve up HTMLpages. Those interlinked pages were dubbed the World Wide Web (WWW), and severalWeb browser programs had been written to allow people to view Web pages. Becauseof the popularity of "the Web," a few programmers soon wrote Web browsersthat could view graphics images along with the text on a Web page. One of these programmerswas Marc Andreessen; he went on to become rich and famous selling the world's mostpopular Web browser, Netscape Navigator.
Today, HTML pages are the standard interface to the Internet. They may includeanimated graphics, sound and video, complete interactive programs, and good old-fashionedtext. Millions of Web pages are retrieved each day from thousands of Web server computersaround the world.
The Web is on the verge of becoming a mass-market medium, as high-speed Internetconnections through TV cables, modernized phone lines, and direct satellite feedsbecome commonplace. You can already browse the Web using a $300 box attached to yourtelevision instead of using your computer, and the cost of such devices is likelyto fall sharply over the next few years.
Yet the Internet is no longer the only place you'll find HTML. Most private corporatenetworks now use HTML to provide business information to employees and clients. HTMLis now the interface of choice for publishing presentations on CD-ROM and the newhigh-capacity digital versatile disk (DVD) format. Microsoft is even integratingHTML directly into the Windows operating system, allowing every storage folder inyour computer to be associated with an HTML page and hypertext links to other foldersand pages.
In short, HTML is everywhere. Fortunately, you're in the right place to find outhow HTML Web pages work and how to create them.
When you are viewing Web pages, they look a lot like paper pages. At first glance,the process of displaying a Web page is simple: You tell your computer which pageyou want to see, and the page appears on your screen. If the page is stored on adisk inside your computer, it appears almost instantly. If it is located on someother computer, you might have to wait for it to be retrieved.
Of course, Web pages can do some very convenient things that paper pages can't.For example, you can't point to the words "continued on page 57" in a papermagazine and expect page 57 to automatically appear before your eyes. Nor can youtap your finger on the bottom of a paper order form and expect it to reach the company'sorder fulfillment department five seconds later. You're not likely to see animatedpictures or hear voices talk to you from most paper pages either (newfangled greetingcards aside). All these things are commonplace on Web pages.
But there are some deeper differences between Web pages and paper pages that you'llneed to be aware of as a Web page author. For one thing, what appears as a single"page" on your screen may actually be an assembly of elements located inmany different computer files. In fact, it's possible (though uncommon) to createa page that combines text from a computer in Australia with pictures from a computerin Russia and sounds from a computer in Canada.
Figure 1.1 shows a typical page as seen by Netscape Navigator, the world's mostpopular software for viewing Web pages. A Web browser such as Netscape Navigatordoes much more than just retrieve a file and put it on the screen; it actually assemblesthe component parts of a page and arranges those parts according to commands hiddenin the text by the author. Those commands are written in HTML.
Figure 1.2 shows the text, including the HTML commands I typed to create the pagein Figure 1.1. This text file can be read and edited with any word processor or texteditor. It looks a bit strange with all those odd symbols and code words, but thetext file itself doesn't include any embedded images, boldface text, or other specialformatting.
Figure1.1. A Web browser assembles separatetext and image files to display them as an integrated page.
All the images and formatting you see in Figure 1.1 are added by Netscape Navigator.It reads the coded HTML commands in the text, which tell it to look for separateimage files and display them along with the text itself. Other commands tell it whichtext to display in boldface and how to break up the lines of text on the page.
Figure1.2. This is the text I typed to createthe page in Figure 1.1. The words between < and > are HTMLtags.
Time Saver: To see the HTML commands for any page on the Web, select View | Document Source in Netscape Navigator or View | Source in Microsoft Internet Explorer. This is a great way to get an intuitive idea how HTML works and learn by other's examples.
You'll learn how to understand and write HTML commands soon. The important pointto note right now is that creating a Web page is just a matter of typing some text.You can type and save that text with any word processor or text editor you have onhand. You then open the text file with Netscape Navigator or Microsoft Internet Explorerto see it as a Web page.
When you want graphics, sound, animations, video, or interactive programming toappear on a Web page, you don't insert them into the text file directly, as you wouldif you were creating a document in most paper-oriented page layout programs. Instead,you type HTML text commands telling the Web browser where to find the media files.The media files themselves remain separate, even though the Web browser will makethem look as if they're part of the same document when it displays the page.
For example, the HTML document in Figure 1.2 refers to three separate graphicsimages. Figure 1.3 shows these three image files being edited in the popular graphicsprogram Paint Shop Pro.
Figure1.3. Though text and graphics appear integratedin Figure 1.1, the graphics files are actually stored, and can be edited, separately.
You could use any graphics program you like to modify or replace these imagesat any time. Changing the graphics might make a big difference in how the page looks,even if you don't make any changes to the HTML text file. You can also use the sameimage on any number of pages while storing only one copy of the graphics file.
You'll learn much more about incorporating graphics files into Web pages in PartIII, "Web Page Graphics."
A single Web page can take on many different appearances, depending on who viewsit and what they view it with. Figure 1.4 is the same Web page pictured earlier inFigure 1.1, as seen with the text-based Lynx Web browser. Lynx users can only seethe images if they click on the [IMAGE] links at the top of the page.
Figure1.4. The page from Figure 1.1 looks verydifferent in the DOS Lynx browser.
People who are using different versions of the same Web browser may also see significantdifferences in a page. Version 1.2 of Netscape Navigator was used to display thepage in Figure 1.5. Notice that the title graphic placement is different than displayedby Netscape Navigator version 3.0 in Figure 1.1.
Even users of the same version of the same Web browser can alter how a page appearsby choosing different display options. Both Netscape Navigator and Microsoft InternetExplorer allow users to override the background and fonts specified by the Web pageauthor with those of their own choice. Screen resolution, window size, and optionaltoolbars can also change how much of a page someone sees when it first appears.
Figure1.5. Netscape Navigator version 1.2 maydisplay some pages differently than other versions of the same browser.
You can't even assume that people will be viewing your Web pages on a computerscreen. The page in Figures 1.1, 1.4, and 1.5 might also be read on a low-resolutiontelevision screen (see Figure 1.6) or a high-resolution paper printout (see Figure1.7).
Figure1.6. Televisionscreens may blur images, and TV Web browsers usually use a larger font to make textreadable from a distance.
Figure1.7. Web browsers usually change the backgroundto white when sending pages to a printer.
As you learn to make your own Web pages, remember how many different forms theymay take when people view them. Some Web page authors fall into the trap of tryingto make pages appear "perfect" on their computer and are sorely disappointedthe first time they discover that it looks different on someone else's screen.
In Part IV, "Web Page Design," you'll find many tips and tricks forensuring that your pages look great in the widest variety of situations.
There are two basic approaches to making an HTML page: you can type out the textand HTML commands yourself with a text editor, or you can use graphical softwarethat generates the HTML commands for you.
Chapter 23, "Web Site Authoring Tools," introduces some of the HTMLediting tools that are available and discusses when to use each type of tool. Fornow, however, I strongly recommend that you do not use a graphical, "what-you-see-is-what-you-get"Web page editor, such as Microsoft FrontPage or Netscape Navigator Gold (which isa different program than Netscape Navigator).
You will be able to follow along with this book and learn HTML much more easilyif you work with an editor that shows the actual HTML text. Any word processor ortext editor you already have--even the Windows Notepad or Macintosh SimpleText editor--willdo nicely.
Coffee Break: In this book, you'll encounter many sample Web pages. The accompanying 24-Hour HTML Café Web site (http://www.mcp.com/sams/books/ 235-8/) has even more sample pages for you to explore. In addition to all these examples, you can follow the development of a complete, sophisticated Web site from the ground up as you go through the book. You might like to preview this "construction site" now at
Doing so will give you an overview of how this book presents HTML and help you plan the development of your own pages. It will also help you see which chapters cover the aspects of HTML you're most likely to use in the pages you plan to build.
This chapter introduced the basics of what Web pages are and how they work. Youlearned that coded HTML commands are included in the text of a Web page, but imagesand other media are stored in separate files. You also saw that a single Web pagecan look very different, depending on what software and hardware are used to displayit. Finally, you learned why typing HTML text yourself is often better than usinga graphical editor to create HTML commands for you.
