|
|
|
|
|
|
|
 |
 |
 |
 |
 |
|
So, you've decided that your course should have a web presence—but now what? This tutorial will have your syllabus up and running in no time. Our objective is to create your course syllabus, translate it into HTML—the "language" of the Web—and publish it on a web server. You may elect to enhance your web pages now with the additional features, or begin with a simple design and add features as times goes by.
Your home page must be housed on a web server—not simply a server that provides access to shared resources such as WordPerfect Office®, Word®, or Excel®. Your school or department may maintain a web server and provide space on it to the faculty.
Personal home pages, sometimes including syllabi and course pages, are housed in your personal account on the personal home page server. The URL for personal pages is http://mypage.iu.edu/~networkid. Institutional home pages, including course and research interests, schools and departments, may be housed on the Champion server under an institutional Network ID. The URL for institutional Web pages housed on Champion is: http://www.iupui.edu/~networkid. In addition, your school or department may provide space on its Web server for your use.
You must have an account on the machine that will house your Web page(s). To see the network services you currently have, go to the Account Management home page. Click in the line to note your IU status and what you need to do, then click Continue. NOTE: You will need your IUPUI Network ID and password to continue. For assistance, visit the The Support Center's Web site, E-mail a consultant, or phone the Support Center at 317-274-5357. IUPUI faculty can also obtain assistance through the Center for Teaching and Learning, (274-1300), UL 1125, or your Local Support Provider.
To request access (either as a new account or as additional services on an existing Network ID) to either the Champion or Personal Home Page server, use your Web browser and go to the Account Management Web page and follow the prompts.
If you are a "do-it-yourselfer" and wish to create your web pages "from scratch" then you'll need to learn HTML (HyperText Mark-up Language). Feel free to consult one of the many resources available on the Web, including the tutorials, HTML Basics or Beyond HTML Basics. You can find additional resources on Web by Design. Even when you create web pages using an HTML editor, you will most likely find it necessary to "tweak" the HTML tags to "clean-up" areas where the editor became "confused."
To simplify web development, there are many HTML Editors for purchase or download. Recent versions of Word and WordPerfect have HTML Editors, or you can choose a dedicated HTML editor such as FrontPage. When using a word processing application to create an HTML file, open the word processed document, then select the menu option FILE : Save As HTML.
NOTE: If your copy of Word 97 does not show this option in the File menu, the Internet options were not installed during installation; use the installation CD and select the missing options to have these installed.
The IUPUI web servers expect that your beginning web page will be called home.html so be sure to save your home page that way.
If your default word processing template includes any options other than the default, such as larger fonts or other special options, when you select Save As HTML, you will see a warning that you may loose that special formatting—that's OK—proceed with your save. You will see that your document is saved, then converted into HTML!
| SAVE YOUR WORK OFTEN |
| Remember a power surge or a slight (even a very slight) disruption of power will cause the loss of any work that you have done that has not yet been saved. It is better to re-create the last fifteen minutes or so of work than it is to re-create the last five hours of work, so |
| SAVE SAVE SAVE SAVE SAVE SAVE SAVE SAVE SAVE SAVE |
You will likely notice a difference in the appearance of your document after it is converted into HTML (notably, excess spacing most of which you can delete as you would any text or spacing in a word processed document). After the conversion, you may continue using any of the Word menu options and tools to enhance your text, including changing the font, the font size, bolding, italicizing, alignment, etc:
Standard Tool Bar
Special tools for home page development included on the toolbar assist you in inserting hypertext links, previewing your web page, creating forms, inserting tables, inserting horizontal rules and establishing background and font colors. If you forget which tool to use, while using Word, simply point to the tool you want information about and hold the mouse in position; a description of the tool will pop up.
At any time in your development cycle in Word, to test
your web page, save the file, then click the Web Page Preview tool. This will
start your default web browser (if it is not already open) and show you the home
page.
When the file is visible in the web browser's window, if you have made any changes in Word since the time you last viewed your home page, you must save the document in Word, then in the browser click the browser's Reload (Netscape) or Refresh (Internet Explorer) button to retrieve and view the fresh copy.
Quite often the editor in Word does not display a true replica of your home page. For example, you may see a "stray" cell border in a table, or the spacing between paragraphs may appear too far apart. It is IMPORTANT that you frequently save, then view the re-loaded home page in your web browser and not rely entirely on the representation in Word's editor. Remember, your readers will view your page with a web browser—that is what you should rely upon to make decisions about layout.
The information supplied within the standard HTML <TITLE> tag appears at the top of your browser window in the colored strip. Many of the search engines still use the information supplied within this tag as the basis for conducting searches on the web. Therefore, it is very important that you give your home page a good title.
The title should be a concise definition of your page. For example, you should not title your page "My Home Page" or "Steve's Biology Page." Rather, a good descriptive title might be along the lines of "IUPUI Intro to Systems Analysis"—this title identifies the location (IUPUI), the type of course (introduction), and content of the course (systems analysis).
If you do not insert the title in your page, Word will simply pick up the top line of your file and use that instead. Insert the title information by choosing from the menu FILE : Properties and completing the Title information:
Dialog Box for Setting Page Title
Hyperlinks are those areas that you design to be "clicked" in order to take your reader to a different location. There are of three types of hyperlinks:
Click the Insert Hyperlink tool.
Insert Hyperlink Dialog Box
Click the Insert Hyperlink tool. Click the Insert Hyperlink tool.After you have created an internal hyperlink pointing to a named location within the file, you MUST identify where that destination is—Word calls these destinations "bookmarks."
To insert a Bookmark:
Inserting images into your web document is as
simple as clicking the Insert Picture tool then selecting the desired image.
Word 97 contains many basic images (backgrounds, lines, bullets, and
photographs) that you are encouraged to use in your HTML documents. Other
options for images include scanning, creating/modifying in PhotoShop, or
obtaining from the Web.
To save an image you find on the Web (assuming that you clearly have permission from the creator to use it and are not infringing on the copyright), point to the image and right-click (Windows users) or hold the mouse button down (Mac users), then choose Save Image As…
After an image is inserted into your web document, it can be resized or relocated by clicking on the image, then dragging the handles (the little solid squares around the border of the image) to resize or dragging the image to relocate. You will be able to keep the image proportionately correct during resizing if you will always use one of the corner handles to drag. Two-headed arrows will resize an image; four-headed arrow will allow you to move the image.
Other options for using images in your pages involve choosing from the INSERT : Picture menu:
IMPORTANT NOTE: The Word 97 HTML editor allows you to insert any image that is recognized by Word. However, the editor will convert those images to ".gif" format when you save the document. The image files will be referred to in your document—and placed in the same directory as your web/HTML file—as "Image1.gif," "Image2.gif, " "Image3.gif," etc. This will function fine; however, it does make future editing somewhat of a nightmare since you can not tell from the file name what the image might refer to. Furthermore, if you use the same image in multiple locations in your document, the editor does not recognize it as being "re-used"—it will simply create the next consecutive "Image#.gif" file. This could create many file duplications. The solution, if you desire to "clean-up" the files, is to rename them with meaningful names, both the files themselves and the referring locations in your HTML code.
To set the background color of your
home page, click the Paintbucket tool. This will give you a palette of colors
from which to choose, an option to see a more extensive palette or an option to
choose a textured background:
Background Palette
Fill Effects Palette
To set a specific word or phrase in color,
highlight the text to be colored, then click the Font Color tool. The currently
selected color is displayed as a band under the A. To choose a different color,
click the down arrow to display a palette from which to choose:
Font Color Choices
To set the text, link and followed (visited) link colors, choose from the menu FORMAT : Text Colors… Make the appropriate selections from the dialog box:
Text and Link Color Choices
To insert a standard horizontal rule in your
document, position your cursor in the location of your document where you want
the rule inserted, then click the Horizontal Rule tool.
To insert a graphical horizontal rule into your document, from the menu choose INSERT : Horizontal Line… Choose the line you prefer:
Sample Horizontal Rules
From the menu choose INSERT : Background Sounds : Properties. Make the appropriate selections from the resulting dialog box:
Sounds Dialog Box
Word 97 has several audio clips in its Clipart Gallery that you may use, or you may create your own audio clips, locate clips from the Internet where copyright permission has been given by the creator, or obtain copyright permission to use other works. While it may be tempting to have your audio clip loop infinitely, keep in mind that the continuous sound quickly becomes irritating to your listener. (During development, your clip will immediately begin playing; to stop the clip, from the menu choose INSERT : Background Sound : Stop.)
Word 97 has a feature to allow you to insert a scrolling text message into your web document. This feature only works when the document is viewed in Internet Explorer. In Netscape, it will simply show the message as a single printed line of text.
Marquee Dialog Box
Bullet Tool
Number ToolBulleted and numbered lists are an effective way to organize your material for optimum reader "scan-ability." To insert bullets or numbers as you type, place the cursor in the paragraph in which you want the list to start (it doesn't have to be at the beginning of the sentence; simply in the paragraph); click the Bullet or Number tool. When you press ENTER to begin the next paragraph, the next bullet or number automatically appears.
When you begin the first paragraph that you don't want to have a bullet or number, click the Bullet tool or Number tool to turn off the feature.
You can affect indentation of lists by clicking
the Decrease Indent tool or Increase Indent tool, respectively.
To use graphical bullets or to change the number style (i.e. roman, upper case alphabetic, lower case alphabetic, etc.), choose from the menu FORMAT : Bullets and Numbering…
 |
 |
| Bullet Dialog Box | Numbers Dialog Box |
NOTE: The option chosen from the menu will remain the default type when using the Bullet Tool or the Number tool until a new choice is made.
CAUTION: Although it is possible to create nested lists, e.g., outlines, using Word, the editor tends to "get confused." Until you feel comfortable working directly with HTML tags, you should avoid nested lists.
Tables are useful to organize information. They are especially beneficial in creating the appearance of multi-columned text. Remember, there is no way to "tab" in HTML—the alternative is to create a borderless table. Simple tables are easy to create in Word; however, it has been my experience that creating a complex table, or editing a table requires direct HTML tag manipulation.
To insert a table, click the Insert Table tool. The
following type box will be displayed; simply press and drag to create the number
of rows and columns you want in your table:
Table Size Dialog Box
NOTE: It is best if you can decide ahead of time the number of columns—it will save you a step during development; additional rows at the bottom of the table are easily created during development.
When you release the mouse button, a table of the proportions selected will display in your document.
NOTE: The gridlines you see in Word are for you to use during development; they will NOT display on the Web:
Sample Working Table Grid
(color enhanced)
To enter data into your table, click your mouse cursor in the cell and begin typing.
To move from cell to cell, press TAB.
To add an additional table row, position your cursor in the lower, right corner cell and press TAB.
To manually draw a table, click the Pencil
tool, drag diagonally to draw the rows and cells you desire.
To erase cell lines, click the Eraser tool
and press over the cell line you wish to erase.
To insert a row into your table, position your cursor BELOW where you want the row added, then from the menu choose TABLE : Insert Rows.
To delete individual cells, complete rows or complete columns, position your cursor in the appropriate location (in the cell, in the row, or in the column), then from the menu choose TABLE : Delete Cells. Make the appropriate choice from the Delete Cells box.
To control table properties such as text wrapping around the table, table background color, and table column spacing:
Table Properties Dialog Box
To control cell properties such as text alignment within the cell and cell background color:
Cell Properties Dialog Box
To add table borders, including border width:
Border Dialog Box
Quite often the editor in Word does not display a true replica of your home page. For example, you may see a "stray" cell border in a table, or the spacing between paragraphs may appear too far apart. It is important that you frequently save, then view the re-loaded home page in your web browser and not rely entirely on the representation in Word's editor. Remember, your readers will view your page with a web browser—that is what you should rely upon to make decisions about layout.
After you have created your web page in Word—saving often, of course!—then viewing your creation in your web browser, you are ready to publish your page on the Web:
Return Home