THE NATURE OF WEB PAGE DESIGN

WEB SITE DESIGN IS UNIQUE

Web sites are unique in that they reflect a very different intent and pattern of interaction by the visitor. Certainly each site should have a specific goal, but what is more is that the site should be designed to enable the visitor to quickly and easily obtain the content being offered or the objectives being promised. The nature of web browsing is such, whether we like it or not, that visitors browse quickly, search for information and tend to move off even more quickly. For these reasons, we must design sites the are easy to interact with, clear and concise, and varied in content and sources of information.

Every site has a purpose
Even though web sites proliferate today, and many seem to be simple commercial or personal messages, every good site has an express purpose or intent. In our case, we want to use our sites for educational purposes, so they should reflect that goal. For educators, the concept of instructional objectives is not new, but probably one that we should always keep in mind in creating a web site. You should be able to spell out, in specific terms, just what the goal or purpose of your site is, in terms of what the visitor can gain from it.

The site should also be the best way of obtaining the intended information. Web based communication is not the answer to every instructional need, particularly those which require substantial student interaction or cooperative work. On the other hand, web sites are particularly good for delivering basic information to learners and for encouraging learners to explore many different sources of information. Be sure that your site is valid, that is, one that really is useful, not just "there because you can do it " and "because it is a 'hot' thing to do".

Convenience of use
Web sites must be easy for visitors to use. The very nature of web browsing implies quick and easy access to information, and learners will be looking for this. In designing your site, you must carefully plan how visitors will navigate through the site and how they will locate what information they need. This does not say, however, that the site should be simplistic or superficial. Learners need to spend time exploring and interacting with the content you post, enough time for them to think through the material, to organize it in their memory, and to "make sense out of it". To make your site convenient to use, you need to organize the content in a logical manner and to provide clear navigation buttons, hot spots and links.

Functionality
The site should also provide the visitor with what they are searching for, not just repetitive or redundant information that can be found in other sources with less effort. When you design your site, limit it to those things which are truly useful and cannot be easily obtained from texts, other sites, or existing sources.

Aesthetic appeal
Be sure not to underestimate the aesthetic value of a well designed site. Because students browse the web broadly, they will see and interact with many different types and qualities of web sites. This invites comparison with your site, so be sure that it is designed to be as visually and aesthetically appealing as possible. Of course this may suggest that a great many brilliant colors, animations and blinking icons will be most appealing and attention gaining for visitors. This is not really the case, since most of these techniques wear thin quickly. A well designed, organized, and attractive site with interesting graphics, layout, and use of attractive colors will usually hold the viewer's attention for much longer periods of time. Maybe you aren't a graphic designer, but in this course we will give you some tips for designing an aesthetically pleasing site.

Structure and organization
Needless to say, an effective site must be logically organized. This is not always the case and many designers tend to include most everything they can find without clear-cut organization. A little preplanning and sometimes testing with some potential visitors will usually help you come up with a logical plan for laying out your site.

One important consideration that usually helps determine how a site should be optimally organized is to consider the organization of your content. Most topics you will be teaching via the web site have some inherent structure that you can use. For instance, a history lesson or unit quite possibly will follow the chronological development of the events, or a biology unit may be structured according to the classifications of vertebrates, or even the sequence of steps in a mechanical process or sports technique. Whatever the structure of your content or the organization you feel is most comprehensible, you must consider the ease of understanding by your visitor to be essential. Think through the main conceptual units of your content and organize them according to some logical and obvious structure.

Navigation
Navigation is the act of moving by the site through the use of buttons and icons, hot spots in the text or menu choices must be obvious and meaningful, but most importantly easy. Your visitor should not have to "figure out" what they should do to get from one place to another. Buttons or icons should be clearly displayed and hot text should readable and meaningful. One really important aspect of navigation is that it should be obvious or intuitive. This means that buttons are identifiable and text links spell out what they do, rather than simply stating "click here ".

Interactivity
Interactivity is an important component of an instructional or educational web site because the primary intent of the site is learning. Research has repeatedly shown the value of having students interact with the teacher or, in this case, the program or site. This interaction is one way that we can be assured that the student is actively thinking and working with the information presented. A good educational or instructional web site employs various techniques to help the learner think about and use what is presented at the site.

While fully interactive web sites are not technically possible given the limitations of HTML programming, a good designer can incorporate a variety of rhetorical or self-test questions or activities to be done by the learner. Remember that learning means thinking, not just sitting and clicking.

LIMITATIONS TO WEB PAGE DESIGN
While the WWW provides a unique environment for learning, with many resources and tools for accessing and exploring a world of information, it also has a number of limitations which are inherent in the act of hypertext browsing and in the capabilities of HTML (the "language"which is used to create web pages). Some of these will constrain what you can do in your web site while others can be accommodated with a little planning and good design.

User centered control
Web based instruction generally employs a HyperText browsing format which shifts much of the responsibility for moving through the site and choosing which links to visit to the visitor. This is usually referred to as learner centered control because the learner has almost total freedom to follow links, interact with text, or visit different pages in a variety of sequences. The opposite type of interaction, where the learner follows a set plan or sequence is called program centered control, and affords the visitor little if any freedom to make choices or construct a personal path through the lesson. Learner centered control is considered by most educators to be a substantially better means of interacting because it allows the student to form their own, unique mental map of the content by visiting or revisiting different links or pages until they gain the desired information and by skipping those parts where they already understand or don't need the information. While this type of navigation is to be encouraged, it does create some problems for the designer. First, learners decide when and where to leave the site, not always visiting some pages that we, the designers might like them to encounter. Similarly, different visitors navigate to pages in different sequences, which may give them a variety of views of the information. In all cases, the site designer has little control over the visitor's actions, a situation which must be taken into account when developing the site.

This is the nature of browsing and it seems to be more useful for certain types of content or learning. If a particular sequence of events is critical to a lesson, these should be built into a single page, or maybe taught by a different means. Browsing, on the other hand, allows the learner a lot of leeway in exploring information and in construction of a different and creative understanding of content.

Limits of HTML
A second limitation in web based instruction is technical in nature and is a result of the HTML markup language, different web browsers, and the rate at which different computers and network connections access and download files.

HyperText Markup Language or HTML is a standard set of tags that determine how text and images are displayed on your computer. Since these files will be accessed by different computers, all over the world, it is necessary to use a common or standard code which can be read by all computer platforms and browsers. For this reason, HTML is really a "lowest common denominator" of languages, which may not always include higher end capabilities. To compound matters, different browsers display HTML differently and can be further configured to display text and images according to the users own personal set of preferences.

HTML text is limiting in that the web page designer does not have a choice of letter font or style, and only partial control of the use of bold or italicized text. For this reason, the wise designer must rely on page and text formatting or layout to communicate the message clearly. In laying out a web page there is also a limitation on how text can be blocked or positioned on the page.

The use of color in a web page can be simply for aesthetic reasons, or for coding purposes. Usually hot links in text or clickable text is presented in different colors to make the links apparent and to show which links have been visited already. This color coding can easily conflict with text color and may limit the use of colors in a particular page.

Browsers can usually be configured to display text, images, and other multimedia objects in different ways, all at the pleasure of the user. The resultant personalization of a particular browser means that different visitors can be viewing pages that look dramatically different in their text, layout, and color as well as in how images are displayed (or not displayed). You, as a designer, have no real control over how different visitors browsers are configured and consequently cannot count on a particular display format. Fortunately, there are some ways to compensate such as asking or telling visitors that the site is best viewed at a particular series of settings. Another mitigating factor is that many instructional sites are accessed frequently (but not always) from an identifiable number of lab sites and the browsers can be given similar configurations at each site. This won't stop students from changing them but at least it helps to maintain some degree of consistency.

Graphic or image display is another area of technical limitation due to the widely differing access capabilities of different computers, modems and network connections (not to mention periods during the day of high traffic on the web or at different sites). If a particular visitor is accessing your site using a relative "slow" modem or other connection, the time necessary to download graphic or video/audio files may become excessive or even prohibitive. Not much can be done about this short of obtaining a faster connection, but it should be considered when incorporating large graphics, video, or audio files.

It is not really a limitation for most individuals today, but only a few years ago, many individuals were using browsers which did nor allow the display of images (such as Lynx). Few such browsers are in use today and you will probably not encounter them.

Interactivity. As things stand with HTML today, there is not a great deal of interactivity that is technically possible between the user and the site. most interactivity is accomplished through the use of direct contact via e-mail rather than by responding on-screen.

HTML does provide the option of creating forms through which the visitor can supply information to the site, but this also requires the creation of programs or devices to accept and store that information as well as the ability for the site (you) to respond to the visitor. Most of this type of interaction requires the additional creation of Computer Gateway Interface programming, (CGI's) for short, which entails programming skills far in excess of most web page designers. In addition, many servers will not accept CGI programs because they could possibly enable the encoding of computer viruses or other undesirable "tinkering" with the server. Also, most servers are simply not equipped to handle the type of data that would be generated through such a program. So, for now, you can probably build sites that allow the visitor to submit basic information, but you will probably not be able to build in more sophisticated interactivity with the visitor. For these, you will want to use chat rooms or threaded discussion sites which are generally require much more advanced software and programming skills.

One type of interactivity that you can build in is conditional branching among pages based on student responses or choices to menu or multiple choice questions. This type of branching simply means that any menu or answer choice must include a link to another page or location on the same page. Granted, this is not very efficient in terms of the number of pages to be constructed or the length of pages, but it will allow you to branch students to desired locations based upon their reactions, choices or answers to questions. you will not, however, be able to analyze student responses in detail or interpret short answer questions. Making your site interactive should be a key concern if you want it to help students learn effectively.

Something to check out
In case you have never done this, go to your browser (probably Netscape or Internet Explorer) and look up the preferences, customize, or options choice in the menu. You'll notice that this allows you to select many of the formats and styles for displaying pages on your browser. These can all be changed by anyone using that browser on that computer. Go ahead, change things to the way you like them (if this is your computer). It isn't courteous however, to change preferences on lab computers or someone else's computer! Come back to the lesson when you're done.

INTERACTIVITY AND WEB-BASED INSTRUCTION
There are many reasons we might want or web sites to be interactive, but of course, helping learners to learn is the main one. Since you can't be there with the learner while they browse your site, you can't know if they are learning anything, actually you don't even know if they are awake!
It has long been a basic principle of learning that students should be actively engaged in interacting with the instruction. They should be not only reading, but thinking, organizing, creating and problem solving. In short, they must be mentally active and the best way to do this is by having them interact with the web site as if it were an real life instructor. Obviously this is not possible, especially given the technological limitations of the web and web browsers. There are however, other ways of having students interact, on their own with your web site. To understand how some of these techniques work, let's look at different types of interactivity.

There are really two types of interactivity; overt, which is what we usually think of as active, visible interaction; and covert, which is a form of interactivity where students answer questions and perform tasks "to themselves" so to speak. Here is a summary of some of the basic points of both types of interactivity:


Granted, there is no real way to check on student performance, but simply having the student do various mental activities will increase the chances that learning will take place or be more complete. Some of these strategies that you might include in a site to promote learning are described here.

Strategies for promoting interactivity
One of the easiest techniques that can be used is the incorporation of rhetorical questions at appropriate places in the text or on the site. Rhetorical questions, or those which students answer to themselves may not seem to be quite the same as those which are checked by the teacher for correctness, but they can be very effective if they are structured in such a way as to allow students to come up with new or creative answers or examples. What is more, even if you(the site) cannot check the accuracy of student work, you can give criteria to guide the learner in estimating its degree of correctness.

Many of these strategies or techniques have been described in the literature and actually constitute a set of good study skills. Among the common strategies you can incorporate into your web site are:

In addition, you can ask students to perform other tasks which will encourage them to think more about the content and to apply it to other situations. These include:
In most all cases, students can do these tasks at the computer or in their heads without direct interaction with the instructor. In almost every instance, the site mearly provides some criteria for the students to self-check their answers or responses. In this way, the student can interact with the site without engaging in actual two-way interaction and learning can be maximized.

You try it out
You probably have a lot of questions or activities that you use in your classroom when you interact with students and many of these are rhetorical in nature. Take a minute to list some of them here. Remember, these should be things that students can do and then check themselves, much like this activity you are doing now.