![]() |
You dont have to surf the Internet very long before you realize that some Web pages are better to use and easier to understand than others. What exactly makes a good Web page "good" and how does the purpose of a Web page impact its design. Explore some of the links under Web design tips to get a sense of features to include and those to avoid. Afterwards, reflect upon the intent of your Web site to determine its possible layouts.
Web Design
What are your primary objectives
in using the Internet for your course?
a. to provide remedial or study guide service
b. to deliver course materials on-line
c. to extend the classroom experience to encourage student-driven explorationThough not exclusively for this purpose, the linear design is well suited to providing remedial or study guide service. This MATLAB Tutorial serves as an example of a linear page, in which students begin with a specified page, continue through the lessons as directed, and conclude (hopefully) with the desired outcome. Web pages often contain a Next and Back button to permit review of prior material or skipping ahead to the next topic. The underlying premise in a linear design is that the content of the entire Web site is viewed in context to provide a better tutorial instrument.
The Web site you are currently viewing is also of a linear type, leading you from your point of origin through the topics in a predetermined manner.
Students do not follow a linear path when nagivating the open page structures of Example 1 and Example 2. Instead, students can switch between topics in an arbitrary manner. Example 1 is a straight-forward style that might prove best for a first try at delivering course materials via the Web. In Example 2, the open styling is accomplished by using a frame structure so that the navigational buttons are always on-screen. The most important general course information is contained on the home page including: course contact information (instructor's name, office, email link, etc.) and course objectives and policies. The other pages are grouped by commonly used categories: help and resources, grades, homework, announcements, test solutions.
Specifics on Web Page Construction for Example 2:
- Most of the pages were constructed using Adobe Page Mill ver. 2.0. The buttons in the banner frame were created using the software Paint and stored as GIF files. A key here is to make the GIF files small in size, less than 10k each, so that they download quickly in order to lesson student frustration.
- The grades were stored in a Microsoft Excel spreadsheet, each student gave a four digit code to identify himself/herself. The spreadsheet was saved as HTML. The resulting HTML file stored the grades in a table and saved the graphs as images that are linked from the HTML file. The Internet Assistant was downloaded from Microsoft so that Excel for Windows95 version 7.0a could be used. Microsoft Excel 97 has a "Save as HTML" option.
- Microsoft Word ver. 7.0 was used to save the outline page as HTML; this was simply converted from a previous Word document of the course syllabus. Again, Internet Assist was downloaded so that the "Save as HTML" option could be used. Newer versions of Word contain this option already.
- The homework assignments, homework solutions and test solutions were predominantly stored as Adobe PDF files. Assignments were written in Word 6.0, and saved as PDF files. (Adobe Acrobat Exchange ver. 3.0 was on the computer, and is needed in order to convert files or save files as PDF.) HTML does not handle many symbols, especially those found in equations. Thus, storing an assignment that has a lot of equations as an HTML file is not very efficient since every equation is converted to a GIF file that is linked from the HTML file. Thus, 5 equations would generate 5 additional files that need to be uploaded to the Web server. The PDF option results in only one file. Adobe Reader needs to be loaded in order to read PDF files, but it is free from Adobe. The solutions were all scanned and then saved as PDF files.
Web Courseware Template Generators
Developing a Web site that truely extends the classroom requires time. If you have a collection of good and currently active Web pages readily available, it will shorten your research time looking for appropriate links to place on your course pages. These advanced course pages can certainly be created manually, but an alternative to creating your own Web course site from scratch is to use the templates generated by one of several Web courseware packages. The WebCT example shown here contains the images of the WebCT Web pages instead of links to the actual pages since those require an account for login. The homepage for WebCT allows people to download a version of WebCT for trial that enables them to play with it, but does not allow student access.
- It took about 6-8 hours to create the basic Web pages shown in the example. It does take longer than required for putting up a basic course Web page using an HTML editor. However, it's more advanced features would be much more difficult to design using basic HTML commands. WebCT makes use of JAVA for interactive Web page design. For example, the calendar and the bulletin boards are already set up in WebCT; you only need to make sure that their associated icons are present on the front page.
- WebCT allows students to view their own grades and the statistics of the class on tests and/or assignments. On-line quizzes can be written in WebCT where students are given a specific time interval in which to complete the on-line quiz, the questions can be multiple choice, matching, short answer, or numerical answer. Any of these can be set up for manual or automatic grading.
- WebCT also provides a tracking feature to see which students are accessing which pages and for how long; this gives feedback for refining the Web pages and for monitoring student progress.