Creating HTML Pages for Web Delivery with Microsoft Front Page

Return to tutorial list

The language of the Internet is HTML. If you work in HTML this will provide you the greatest control over how your content pages appear on a web server or in a course management system (CMS) Since you have already created your master document for your lesson or module, you will now be using those file names, the content that you have developed and the titles for your pages to create HTML pages.

Your master document for your lesson or module was developed using a word processor such as Microsoft Word. The main reason for developing content in a word processor is that this is one less program you need to learn.  If you have worked with tables in Word or other word processing programs, learning how to create web pages in a HTML editor shouldn’t be too difficult.  This part of the lesson will give you a very brief overview of working in Front Page to illustrate how you can create individual HTML files from a Word document.

Once you have a HTML editor (such as MS Front Page) open, create a New Page.

On the blank page create a two row, two-column table and set border size to 0 (zero).  This will make the table invisible to the viewer, but will allow us to control how content looks.

Highlight the left column and right click in the column.  Select Cell Properties from the dialog box.

Set the left column to equal 2% of total width of page. Click Apply, then click OK.

Now repeat the process this time highlighting the right column. Set the right column to equal 98% of total width of page. Click Apply, then click OK.

This will allow the table to occupy 100% of the available screen space on the student’s computer.  Because we can’t predict the size of every screen that students might use, allowing the table to equal 100% will assure us that the content will fit on any screen.

e create a two-column table because it will give us a small space on the left side of the screen.  This separation space creates an aesthetically pleasing page because the text is not bumped up directly to the edge of the page when it is displayed as a single page or when it is displayed within a course.  In your open master document (word processed document), highlight and copy the first instructional chunk. (Note that your “chunk” may be a single paragraph, or several paragraphs. You should try not to have too much (and this should be determined by the instructor) material on one html or web page).

Navigating back to the HTML editor, place the cursor in the right column of the table and paste.

Now that the text is inserted into a HTML document using an editor all you need to do is save as HTML.  In some HTML editors, you assign the page name when you save, in other programs assigning the page name is done using a separate action.  In Front Page, during the saving process you can assign the page name and file name. From the File menu select Save As.

Confirm you are saving to the correct folder (Ccdm). When you created your master document, you created a folder. Save your pages to that folder so you have your master document along with the files that were made from the content contained in your Master document all together in one place.

In the save dialog box, click Change Title.

Enter the page name you created in your document for that page of content.

Assign the file name to the file and click save.

In this case the file named ccdm01, with the page name “Familiarity with Program” has been saved in the Ccdm folder.

Repeat as Often as Necessary

The actual development of the lesson in Word frees you from developing in another software program. If you choose to do this conversion from Word to HTML, you first develop your content (one or many single pages of content that make up a lesson or module) in the master document and then all you have to concentrate on is the use of Front Page to create your HTML pages. You do not have to be concerned with content development because that part was completed when you created the master document.

Getting your course on the web presents you with three very different challenges:

By segmenting the development of your course into three parts, 1) development in Word 2) preparing content for presentation in a HTML editor, and 3) uploading content and displaying files on a web server or in a course management system, you can concentrate on one task at a time and hopefully not experience cognitive overload by learning too many new tasks/programs at one time.

All Those Files

Now that you have created all of your content page(s) using an HTML editor, what are you supposed to do with them?  The simple answer is to upload your pages to a web server.

If you are going to upload your HTML pages to a course management system go to the ISU Faculty Tutorials page and review the tutorials that will assist you in uploading your content/lesson to Blackboard. In Blackboard, you can upload single pages by using Add item and placing the items in a folder. You can also use the Learning Unit if you wish to display a group of pages as a sequential (or non-sequential) unit.

Return to tutorial list