Building Web Pages in A Workshop Presented by R.S. Schaeffer © 2002. R.S. Schaeffer. All Rights Reserved. 1 Table of Contents Building a Web Page in Netscape Composer................................... 2 Getting Started ................................................................................... 3 Toolbars ........................................................................................... 3–5 Entering Your Text ............................................................................... 6 Saving Your Work ................................................................................ 6 Checking Your Progress...................................................................... 6 Adding Rules........................................................................................ 7 Links & Targets ................................................................................ 7–9 Graphic Images ........................................................................... 10–11 Changing the Appearance of Your Document ............................... 12 Working with Tables ................................................................... 13–14 “Publishing” Your Page(s) ................................................................ 15 Your World Wide Web Address ....................................................... 16 Where Do You Go From Here? ....................................................... 16 Changing Your Web Site After You’ve Already Published It .......... 17 Glossary ............................................................................................. 18 Appendix A (Finding Graphic Images on the Web)....................... 19 Appendix B (Equation Editor Equations) ....................................... 20 Appendix C (Saving in LY215) ......................................................... 21 Appendix D (Viewing a List of Your Files on the KU Server) ...... 22 Appendix E (UNIX File Names) ..................................................... 23 © 2002. R.S. Schaeffer Building Web Pages in Netscape Composer Building a Web Page in Netscape Composer 2 Designing and building Web pages has become an industry unto itself. There are companies that specialize in taking your money and designing your Web pages for you. There are expensive computer applications (such as PageMill and FrontPage) dedicated to creating Web pages. Some equally-expensive word processors (such as Microsoft Word) allow you to convert a standard document into a Web page, provided that you followed very specific conventions in creating your document in the first place. All of these methods for creating Web pages are probably far more sophisticated than what you—the average, beginning user—need to get started in designing and building a simple home page. Fortunately, Netscape Communicator itself has the built-in capability for creating Web pages with a surprising amount of sophistication. It is relatively easy to use, and the best part is that it costs you nothing extra (since Netscape Communicator is now free to all users). It is also available on virtually every computer on campus that is connected to the Internet, making it an easily-accessible Web page creation tool. About this Document This document was created on a Macintosh computer with Netscape Composer, Version 4. The PC version of Netscape Composer, Version 4, is virtually identical except for minor differences in the appearance of some dialog boxes and screens. Most menus, buttons, and commands are also identical on both platforms. In those rare cases when the difference is more significant, there are specific directions for each platform. It is hoped that this document will help you create your own Web pages no matter what platform and version you have at your disposal. About Web Pages & Web Sites A Web “page” is a single document containing text and graphic images. As a member of the World Wide Web, you can have a collection of any number of such pages, each a separate document. Such a collection is usually called a Web “site.” A “home page” is typically the main page that a user first accesses when viewing your Web site. Some people put everything on one single page, which a user then has to scroll through to find what he or she is looking for. By putting your different pieces of information on a collection of separate but related pages, the user has to do much less scrolling, and you can update individual pages without having to change everything. Think of your Web site as a book, your home page as its table of contents, and all of your other pages as chapters in the book. As in a real book, a user can bounce back and forth from the table of contents to its various chapters. For example, if you were a college professor, you could have a site containing such things as your current schedule, the syllabi for the courses you are currently teaching, your vita, your research interests, papers you have presented or published, etc. Your home page would be a simple listing of these various categories. Then each of your syllabi, for example, could be a separate page with a link to it from your home page. When the semester is over and you are no longer teaching that course, rather than removing all of the syllabus’ text, you would simply have to remove the link on your home page (although the syllabus itself would still exist on KU’s server). In the future when you once again teach that course, you would merely have to re-establish the link, rather than entering and uploading the entire syllabus again. © 2002. R.S. Schaeffer Building Web Pages in Netscape Composer Getting Started To create a new, blank document, pull down the “File” menu to “New,” and select “Blank Page” from the resulting submenu. You will be greeted by a blank window with a solid-colored background in the default color (probably 3 gray). Toolbars There are two toolbars for making page creation easier. To show or hide each of these toolbars, click on the arrowed tab at the left end of the toolbar. Nearly all of the commands and operations that are available on these toolbars are also available directly from menus (so if you have a small screen, you might want to hide these toolbars and use the menus instead). File/Insert Toolbar NEW: Since your Web site will probably consist of several individual pages, use this button to create another new page. OPEN FILE: If you need to open a page that you previously created, use this button. SAVE FILE: To quickly save your page to disk, click on this button. PUBLISH: Use this button when you are all finished creating your document, and you want to upload it to the server. Since this step is at the heart of making your page accessible to the rest of the world, a subsequent section of this document is devoted to its function. VIEW IN NAVIGATOR: Use this button to switch from the Editor (the window you are in when you create a new document) to the Browser (the window you and everyone else will actually see when they access your page on the World Wide Web). CUT: When you want to remove an item from its current location on the page so that you can place it somewhere else on the page, use this button. Cutting deletes the item from its current location, but saves a copy of it on the Clipboard. COPY: This is the button to use when you want to save a copy of the selected item to the Clipboard. The selected item is left unchanged. PASTE: After you have cut or copied an item, use this button the paste the item on the page. © 2002. R.S. Schaeffer Building Web Pages in Netscape Composer PRINT: Use this button to decrease the size of the selected text. FIND: Use this button to find a word or words on the page. INSERT LINK: Use this button to link the selected text or image to another location in the same document (further down the page, for example) or to another document entirely (one of your own creation or another page anywhere on the Web). 4 INSERT TARGET (Named Anchor): Use this button to insert a “target,” a location in this document that users will jump to when they click on a link elsewhere in this document. INSERT IMAGE: Use this button to insert a graphic image or picture into your page. INSERT HORIZONTAL LINE: Use this button to insert a horizontal line or rule between lines of text. INSERT TABLE: Use this button to insert a table in your document (similar to a table in Microsoft Word, for example). CHECK SPELLING: Use this button to check the selected text on your page. If no text is selected, the entire page is checked. Format Toolbar Although the World Wide Web has become very graphically-oriented with browsers such as Netscape Navigator and Internet Explorer, the simple truth is that text still dominates and drives most Web pages. Much of what you may want to include on your personal Web pages will probably be text-based as well. Consequently, understanding how browsers handle text and how you have to enter and edit text is vital for having a successfully-designed Web page. Although the name of each button pops up as you move the cursor over it, thereby making its use fairly obvious, more complete descriptions are included below. In order to understand paragraph formatting, it is essential to understand how fonts are handled in Netscape Navigator (or any other browser for that matter). You may have already noticed that there were no provisions for changing the font itself. Since the fonts you have installed on your computer may not be the same as those installed on another person’s computer, Netscape Navigator uses one font for all text displayed on a Web