Social Psychology Network

Maintained by Scott Plous, Wesleyan University

Tips on Creating and Maintaining an Educational Web Site

Scott Plous, Wesleyan University


Teaching of Psychology

Note: The complete article is reproduced below (useful for printing a paper copy). There is also a faster loading version in which the article is broken up on sequential pages.

    This essay is an updated version of the following journal article:

Teaching of Psychology is published by Division 2 of the American Psychological Association (the Society for the Teaching of Psychology). If you print, cite, circulate, or add web links to this page, please include full citation information (links to Teaching of Psychology are also appreciated).

In this article I describe several benefits of using the World Wide Web for instructional purposes, and I offer 8 general tips on how to create and maintain an educational web site. Most of these tips are easy to implement if readers have a basic grasp of hypertext markup language (i.e., the language most web pages are written in, known commonly as HTML). For readers who do not yet have experience with HTML, I provide references for tutorials that cover the essentials in 1-3 days. Throughout the article, I discuss examples from my experience with Social Psychology Network, an educational web site I created in 1996.

Here is an outline of the article:

I. Introduction

II. Getting Started

III. Eight Tips on Building an Effective Web Site:

    1. See What's Already Out There
    2. Determine Intellectual Property Ownership
    3. Plan Ahead
    4. Keep Page Loading Time to a Minimum
    5. Appearance Matters
    6. Seek Feedback
    7. Assume Nothing, Check Everything
    8. Spend Time Promoting Your Site

IV. Conclusion and References



Introduction

Have you ever considered creating an educational web site for your students? Most newcomers to web development are surprised at how easy it is to design and publish web pages. In my case, I bought a $27 web editing program in January of 1996, and within just a few days, I published a social psychology course syllabus that later grew into an educational web site known as Social Psychology Network. Today, Social Psychology Network receives an average of roughly 3,000 page accesses every 24 hr, and it has grossed a cumulative total of more than two million page accesses.

In this article, I offer tips on how to create and maintain an educational web site, including techniques for attracting visitors to your pages. My focus is on psychology sites developed by faculty at academic institutions, but most tips can also be applied to other educational web sites. Before I begin, however, let me address one of the most common questions that faculty members ask about web development: Is it really worth doing?

In my experience, the answer is unquestionably yes. As long as your institution has a computer infrastructure that can support web pages -- and most colleges and universities do -- there are several reasons why it pays to develop an educational web site. Here are just a few:

  • The Internet is here to stay. The Internet has already had a profound influence on higher education, and this influence is projected to grow (Gates, 1997; Rosenberg, 1997; Rudenstine, 1997). Indeed, in some respects the Internet is to today's generation of teachers what personal computers were to the previous generation. As a consequence, "web literacy" will increasingly become a standard tool of the trade, and educational web sites will become regular adjuncts to classroom activities. One of the best ways to stay ahead of the curve is to create an educational web site, even if the site consists of nothing more than an online course syllabus with a small set of course-related web links.

  • The web is ideally suited for certain student assignments. Consider, for example, the difficulty many students have understanding the difference between random sampling and random assignment. Much of this confusion would be eliminated if there were a way to have each student personally draw a random sample or conduct random assignment, but it is usually impracticable to arrange this experience for hundreds of students. With the web, however, the impracticable becomes feasible. For instance, when I teach research methods to introductory students, I give them a story problem and direct them to ResearchRandomizer (Urbaniak & Plous, 1998), a web site available through Social Psychology Network. There, students find a brief tutorial and an interactive form that allows them to carry out instant random sampling and random assignment. The students can then print their output from this page, and teaching assistants can quickly look over the answers to make sure there are no errors. I have tried this assignment with more than 500 students, and roughly 95% execute the task perfectly on their first attempt.

  • Most students enjoy the web. During the fall
    term of 1998, I anonymously surveyed 210 students at Wesleyan University to see whether they enjoyed having a course web site in social psychology; 85% of students replied affirmatively (fewer than 1% said they disliked having a web site; the rest said they were indifferent). Given the enthusiasm expressed by most students, I now offer optional web assignments to help students learn more about social psychology than they would from the textbook and lectures alone. For instance, I invite students to submit web sites that illustrate topics covered during the previous week, and I post links to the best sites on a web page entitled Sites of the Week. Periodically, I use class time to visit a few of these sites, and the student feedback on these class presentations has been very positive.

  • The web can save time and increase convenience. One advantage of posting syllabi and other educational materials on the web is that students have 24-hr access to them. In addition, instructors can post "Frequently Asked Questions" (FAQ) web pages with information on grading, class assignments, study tips, and so forth. By publishing this information on the web, instructors avoid having to answer the same questions throughout the academic term. When I teach Social Psychology, one of the most helpful labor-saving devices I use is GradeGetter, a locally developed web-based program that allows students to enter a personal identification number and check how well they are doing in the class (GradeGetter, 1998). GradeGetter displays a student's exam scores, class assignment scores, and a running point total (taken from values in a spreadsheet), and it provides contextual information on how well the student is doing compared with the rest of the class. By using the web to deliver grade information, individualized performance feedback can be delivered to students without redirecting the instructor's focus from teaching to administrative tasks.

  • Web pages can reach a larger and more diverse audience than is otherwise possible. Take, for instance, the case of journal articles. Readership studies suggest that the typical audience of a journal article is quite small (Cohen, 1979; Garvey, Gottfredson, & Simmons, 1984; Wildman & Wildman, 1977). By reproducing an article on the web, however, readership can be dramatically increased. I learned this lesson firsthand in September of 1996, when I created a web version of an article on affirmative action. The hardcopy version of the essay, which appeared in the Journal of Social Issues (Plous, 1996), probably had no more than a few hundred readers, yet by April of 1999 the web page had received more than 20,000 visits [Update: And by July of 2004, more than 500,000 visits.]. Although it is impossible to know how many of these visits represent actual readers of the essay, the number of web-based readers surely exceeds the number of paper-based readers. Even now, three years after the article was first published in paper form, the electronic version continues to get more than 20 visits per day.

    One cautionary note: The American Psychological Association (APA) allows authors to post their articles on the web before publication, but because some journals view web-based preprints as a form of prior publication, it is always best to check with the journal editor before posting an article. The APA also allows authors to post published articles as long as explicit permission has been obtained from the publisher (APA, 1997). Thus, if you are interested in creating "e-prints," you should consult with the publisher in question.



Getting Started

Once a faculty member has decided to create a web site, two common questions are: (1) How long will it take? and (2) What is the best software to use? Unfortunately, these questions cannot be answered in any simple way, because the answers depend heavily on the individual user and the educational objectives. For instance, if the goal is to create a modest web syllabus, then the task will probably take 3-10 hr, depending on the individual's level of computer experience. On the other hand, a large educational web site with thousands of links might require several months of full-time work.

Likewise, the choice of software depends in part on an individual's level of computer experience, and in part on the desired end product. A simple web syllabus can be created easily with a standard word processing program or text editor. If, however, the web site will have interactive forms, frames, image maps, or other advanced features, then it is probably best to use software specifically designed to create web pages. There are a number of excellent web page editors available, and many can be downloaded free for a trial period. My recommendation would be to seek the advice of other web developers and to choose a software program that has good technical support either at your institution or through the software maker.

Once you have chosen a web editor, two further pieces of software are necessary. First, you will need a way to send your pages to the web. Many web editors have this feature built into their menu as a "publish" option. Alternatively, you can use one of several file transferring programs (known as ftp programs, short for "file transfer protocol") that are widely available as freeware. If you are not sure which route to take, I would suggest talking with technical support professionals at your institution. A good technical support professional should be able to set up an ftp program for you in less than 15 minutes.

The final piece of necessary software is a web browser (a program that allows people to look at, or "browse," web pages). At the time of this writing, the most popular browsers are Mozilla's Firefox, Microsoft's Internet Explorer, and Apple's Safari. Any of these programs is fine for browsing the web as a consumer of other people's pages. If you are developing your own pages, however, my advice would be to install all web browsers so that you can check how your pages look with each browser (web pages can appear very different depending upon the browser).

Beyond the three software programs necessary for web design -- a web page editor, a file transferring program, and a web browser -- serious web developers will also want to obtain a graphics program such as Photoshop. A graphics program allows you to create, modify, or resize images for use on the web. This capability is especially useful if you want to customize scanned images, design logos, or make navigation buttons for visitors to click on. If you are interested only in creating a few simple web pages, however, then a graphics program is probably unnecessary. Instead, you can get a wide variety of free images by visiting clip art sites on the web.

In the tips that follow, I will assume that you have obtained the necessary software and that you have a working familiarity with hypertext markup language (i.e., the language most web pages are written in, known commonly as HTML). If you are unfamiliar with HTML, my advice would be to work through a few simple HTML tutorials, either on the web or through a workbook (e.g., Callihan, 1997; Campbell & Darnell, 1997; Lemay, 1997; Oliver & Holzschlag, 1997). Basic proficiency in HTML can be self-taught in a day or two, and it is worth taking the time to learn this language even if your web editing software advertises that no knowledge of HTML is necessary (by understanding the language, you will be able to troubleshoot problems, make direct modifications to the HTML code if necessary, and see how other people's pages are written). With these prerequisites assumed, I turn now to the nuts and bolts of web site construction.



Eight Tips on Building an Effective Web Site

Tip 1: See What's Already Out There

One of the most common mistakes made by new web developers is to begin constructing a site without knowing what is already on the web. Just as professors ask their students to conduct a thorough literature search before undertaking a study, web developers should conduct a thorough web search before constructing a site. A careful search of the web has three important benefits. First, it prevents you from reinventing the wheel. Second, it makes you aware of valuable web sites that can be added to yours as links. And third, it gives you ideas that can enhance your own web site.

There are several ways to track down information on the web. One technique is to use a web-based search engine and type in keywords (a search engine is software that searches an index and returns matches). Many search engines allow visitors to limit a search by date and language, view related keywords in a thesaurus, and conduct complex searches with Boolean operators such as and, or, not, and near.

Another way to find information is through a web guide. Unlike a search engine, a web guide is thematically organized by category, and in some cases, visitors can perform keyword searches within specific sections of the guide (e.g., the psychology section). At present, the most popular web guide is Yahoo!

A third way to find information on the web is to crawl along its various strands in spider-like fashion, clicking on links of interest and jumping from site to site. The main trick here -- as with web searching in general -- is to bookmark liberally. A "bookmark" (sometimes also known as a "favorite" or "favorite place") captures the web address of the site you are visiting so that you can return easily at a later time. As a web developer, you may wish to set up bookmark folders on topics such as Web Page Construction, Free Clip Art, Well Designed Sites, Teaching Ideas, and other topics. Then, when you come upon a useful site, you can click on the "Bookmark" or "Favorites" button of your web browser and add the site to a given folder (if you have never set up folders before, click on "help" within your web browser for assistance). By building your own library of bookmarked sites, you will greatly reduce the time needed to develop a web site of your own.

Tip 2: Determine Intellectual Property Ownership

If you intend to build a large educational web site, make sure you know who will own and control the site before you begin constructing it. Some academic institutions lay claim to any web sites that reside on their web server (a "server" is the computer that serves up web files). Other schools treat web sites in much the same way they treat textbooks written by their faculty, exerting little or no claim of ownership, royalties, or editorial control. Still others have no intellectual property policy governing the Internet. In the latter case, a faculty member who creates a valuable web site might later be faced with a claim of partial or full ownership by the institution (for example, the school might draft a policy in which web sites cannot be freely transferred if faculty members leave the institution).

At my institution, faculty members retain full ownership of their web site as long as the site does not consume an unusual amount of computing resources. If, in the opinion of the computing center, a web site crosses this line, then the faculty member is notified and given the option to (a) scale back the use of resources, (b) move the web site from the university server to a commercial service provider, or (c) negotiate a joint ownership arrangement with the university. In my view, this type of arrangement is ideal because it encourages faculty innovation while protecting the institution from an undue depletion of computing resources (for further discussions on intellectual property, see Marchant, 1996; Rosenoer, 1996). Regardless of the arrangement at your own institution, however, the main point here is to know the intellectual property policy before you invest a serious amount of time creating an educational web site.

Tip 3: Plan Ahead

In most cases, the web pages you create will be separate HTML files with names that end in .htm or .html (just as text documents are often given names that end in .doc or .wpd). For example, if you create a web page with autobiographical information, you might name it something like bio.htm, autobio.htm, or vita.htm. When naming files for your own personal use, you can easily change their names in the future if the need arises. Once a file is uploaded to the web for others to see, however, any change in its name will alter the web page address (technically, the web address is known as a URL, or "Uniform Resource Locator"). What this alteration means is that someone who has bookmarked your page with the old URL will now get an error message upon visiting that location (e.g., a message such as "File Not Found"). For example, if you were to change a web file name from bio.htm to vita.htm, then visitors who go to:

http://www.school.edu/psychology/yourname/bio.htm

would receive an error message, because the correct URL would actually be:

http://www.school.edu/psychology/yourname/vita.htm

The key is to remember that file names on the web are for others as well as oneself, so you should try whenever possible to avoid changing the names and locations of web files.

In practical terms, the best way to minimize these changes is by carefully planning your web site so that you can grow into it gradually without having to rename files or restructure the site. For instance, avoid general file names (e.g., "psych.htm" or "course.htm") or names that might have to be changed if a course gets renumbered or repeated in a later year (e.g., "psyc260.htm" or "course99.htm"). If you intend to create no more than a handful of pages, then planning is relatively easy. All you need to do is choose clear file names and locate them in a single directory (this kind of directory structure is known as a "flat directory," because it has only one level). In contrast, if you are planning to publish several dozen pages with lecture notes, a set of weekly class assignments, and a lengthy series of online tests or experiments, then you may want to create subdirectories for each set of pages. Many ftp programs have an option to create new directories or subdirectories (for help, see a technical support professional at your institution). If you create subdirectories, however, bear in mind that each additional directory lengthens the URL of a web page. For example, by locating an autobiographical page in a subdirectory called "personal," the URL would change from:

http://www.school.edu/psychology/yourname/vita.htm

to:

http://www.school.edu/psychology/yourname/personal/vita.htm

The tradeoff, then, is that a hierarchical organization with subdirectories may be easier to maintain and may help visitors find information, but URLs with subdirectories will be lengthier to type and more prone to keyboard errors.

If, despite your best efforts, it becomes necessary to rename pages or relocate a web site, there are two things you can do to avoid losing potential visitors. First, you can notify as many people as possible of the changes (especially the webmasters of sites that maintain links to yours). And second, you can leave forwarding pages at the old URLs. In the case of Social Psychology Network, I created forwarding pages when I moved the site from its previous location to its current location. Once the move was made, visitors who used the old URL for Social Psychology Network were greeted with a web page that said:

In an effort to provide better service and an easier address to remember, the location of Social Psychology Network has been changed to:
http://www.socialpsychology.org/

You will be automatically forwarded to this location in 10 seconds. After you arrive, please make a note of the address and update your bookmarks.

The way to automatically forward visitors to a new location is by inserting the following line of HTML code between the "head" and "body" sections of the web page file:

<meta http-equiv="Refresh" CONTENT="X; URL=newlocation">

In this statement, X would be replaced with the desired size of the forwarding delay (in seconds), and newlocation would be replaced with the new URL (in the case of Social Psychology Network, http://www.socialpsychology.org/).

Tip 4: Keep the Loading Time of Pages to a Minimum

Surveys of web users suggest that the two most common complaints are slow access and inability to find relevant information (Huberman, Pirolli, Pitkow, & Lukose, 1998). As suggested in the previous tip, careful file naming and directory organization can go a long way toward facilitating information retrieval and ease of navigation. But what about speed of access? Are there any tricks for reducing the time it takes a web page to load?

Over the next few years, technological improvements will speed up web access considerably, but in the meanwhile, there are several steps you can take to reduce the loading time of your web pages. First, if the home page of your web site incorporates large graphic images, lengthy sound clips, videotapes, or other slow-loading files, consider organizing these elements in such a way that accessing them is optional (e.g., by placing them on separate web pages that are linked to the home page). Most web sites are organized such that the home page is a central "jumping off" place, so a good rule of thumb is to make sure that your home page does not exceed 2-3 screens' worth of material or 10-15 sec of loading time.

Another way to reduce loading time is to use a graphics program to crop, compress, or reduce the graphic images on your web site. Suppose, for example, that you have an image 200 pixels wide, and you would like the image to appear on the web at half its original width (a "pixel," or picture element, is equivalent to a dot of color on the screen). A poor (but very common) method of accomplishing this width reduction is to set the image width equal to 100 pixels within the HTML code:

<IMG WIDTH=100 SRC="image.gif">

The problem with this strategy is that it does not change the file size of the image; consequently, the loading time remains unchanged (the image simply displays at half the width). Instead, you are better off using a graphics program to create a half-size copy of the image, thereby reducing the file size and loading time. Similarly, if you have an image that was originally scanned in order to be printed on a laser printer -- at a resolution of, say, 300 dots per inch (dpi) -- you are best off using a graphics program to reduce the resolution before uploading the image to the web. The reason for reducing the resolution is that contemporary computer monitors usually have a resolution of only 72 pixels per inch. Thus, images with a resolution above 72 dpi are wasted on the web and take an unnecessarily long time to load.

A third way to reduce loading time is to minimize gratuitous animation, images, and JavaScript programs (e.g., programs that create animated e-mail images, rotating bullets, and scrolling messages). Overuse of these elements not only detracts from the appearance of a web page, it adds unnecessarily to the loading time. For sites that contain a large number of images in the form of navigation buttons (e.g., "Home," "Back," "Other Links"), another way to reduce loading time is to use text-based navigation buttons rather than images. To generate a text-based navigation button in HTML, first create a borderless table cell in whatever color you desire, and then place the navigation text (e.g., "Home") inside the cell using a font with a different color.

One final suggestion is to include height and width tags with all images in your HTML files. For example, instead of writing an HTML image statement as:

<IMG SRC="picture.gif">

write it as:

<IMG HEIGHT=XXX WIDTH=YYY SRC="picture.gif" ALT="text">

In the latter statement, XXX equals the image height in pixels and YYY equals the image width in pixels (the ALT tag, which is used to provide a text-based description of the image, will be discussed later). The addition of height and width information will not reduce the size of images or loading time, but it will allow the browser to immediately begin formatting the page and displaying text and tables in their final positions. The benefit to visitors is that they will be able to read the text on your page while large images are loading. The only proviso is that all images must have height and width tags in order for this suggestion to work; if even one image is missing tags, the text and tables may not be displayed properly until all the images have loaded.

Tip 5: Appearance Matters

Even though the content of a web site is centrally important, appearance also matters. Attractive images and snappy page layouts make the web fun to use, unless the loading time is excessive. Moreover, improvements to the appearance of a web site can help increase the number of visitors. In the case of Social Psychology Network, I have upgraded the general appearance of the site on three different occasions, and each time the visitor traffic increased by 10-20% soon afterward.

As mentioned earlier, one way to develop an appealing web site is to bookmark and learn from other sites that are particularly well designed. If you understand HTML, you can see how a page was written by using your web browser to look at the source code of the bookmarked page (just select "Source" or "Page Source" under the View pulldown menu of your browser). In this way, you can get the codes for pleasing background colors, font styles, and other design elements.

In addition to maintaining an extensive set of bookmarks, I recommend building your own "image library" by downloading attractive icons, bullets, lines, and other images from clip art sites that you visit. If you use Windows and want to download an image from a web site, simply position your mouse over the desired image, click the right mouse button, and select the option for saving the image or picture (Macintosh users can do the same by positioning their mouse over the image, holding down the mouse button until a pop-up menu appears, and selecting the option for saving or downloading the image). Then save the image to a folder named "images," "library," or any other name you prefer. One warning, though: Be sure that the images you download are free to the public. If you suspect that an image might be copyrighted, check with the site's webmaster before you download the image.

One last suggestion for improving the appearance of a web site is to consult with online style guides (such as the Yale Web Style Guide) or books on web design (e.g., Holzschlag, 1998; Siegel, 1997; Vasquez-Peterson & Chow, 1997; Williams & Tollett, 1998). These guides offer a variety of practical techniques for enhancing the appearance and user-friendliness of web pages. For example, here are a few do's and don'ts of particular relevance to educational web site design:

  • Don't allow lines of text to run the full width of the computer screen. Long lines of text are hard to read. Instead, move the text away from the left edge of the screen by using a tables statement in the HTML code (professional web pages are usually formatted with HTML tables, even if the page has nothing that overtly looks like a table).

  • Don't create tables or images that are wider than 600 pixels. Tables and images wider than this may display well on your computer monitor but may extend beyond the right edge of smaller monitors, forcing visitors to scroll horizontally in order to view your full page. Overly wide tables and images will also fail to print properly.

  • Don't use white text on a dark background if you want visitors to print your pages. White text can be printed, but only if visitors know how to change the text color under "Preferences" or "Options" in their web browser. Because many visitors will not know how to change this setting, the safest route is to avoid using white text. Moreover, black text on a white background is easier to read than white text on a black background. In the words of one web designer, "Before you put a really dark background on your web page, ask yourself this: Why is it so much harder to drive at night than in the daytime?" (Karp, 1998).

  • Do use upper and lower case letters rather than all capital letters. Text written in all caps is harder to read and should be used sparingly if at all.

  • Do develop a consistent style from page to page. The idea here is to unify your pages with a consistent style in terms of background colors, fonts, navigation buttons, and layout. Consistency in style not only improves the aesthetic appeal of a web site, it makes the site easier to use.

  • Do provide a link to your home page on each web page in your site. Otherwise, people who arrive at one of your web pages via a bookmark or remote link may not be able to find your other pages.

  • Do make sure visitors have a way to contact you. The most common way to do this is by placing your email address at the bottom of your home page.

  • Do provide an outline with internal anchors if a page is unusually long. Internal anchors work in much the same way that normal hypertext links do, except that they send visitors to a specific location within the same page, rather than to a different web page. For an example of how to use internal anchors within a page outline, see the Online Psychology Career Center in Social Psychology Network.

Tip 6: Seek Feedback

Feedback is just as essential in web development as it is in teaching and research, yet there is currently no formal system of peer review for web sites. As a result, it falls to individual web developers to gather feedback on the quality and usefulness of their work. There are at least three ways to obtain this information, none of which are mutually exclusive with the others: (a) ask people for feedback, (b) install digital counters to record the traffic on specific pages, and (c) analyze the log files of your web server.

Asking other people. The easiest way to gather feedback is to ask colleagues, friends, and family members to bluntly appraise the strengths and weaknesses of your site. One limitation of this approach, though, is that these individuals may differ from the people who actually use your site. To solicit feedback directly from visitors to your site, you might consider adding an interactive survey form to your web site, or even simpler, you might add a "mailto" link on your home page with an HTML statement such as:

Please send additions, corrections, and any other feedback to
<A HREF="mailto:me@school.edu">me@school.edu</A>

In the previous statement, me@school.edu would be replaced in both locations with your e-mail address. The advantage of soliciting information in this way is that virtually all feedback will be useful. In my experience, however, fewer than one visitor in a thousand sends feedback, so this method will not generate a large or representative set of comments. If you are using your web site in connection with an academic course, a better technique for gathering representative feedback is to anonymously survey students in the class. For example, you might ask students to rate how much they enjoy having the site, how often they use it, how easy or difficult the site is to navigate, how much they like the layout and appearance, and what they would suggest to improve the quality of the site.

Installing digital counters. Perhaps the single most important piece of feedback to a webmaster is the number of visits each page gets. After all, there is no point in developing a web page that does not get visited. By the same token, if certain pages receive an unusually large number of visits, this information may suggest the value of developing similar pages in the future. To monitor the number of visits to a page, you can either ask a technical support professional at your institution to help install a digital counter, or you can install a counter yourself through a commercial counter service on the web (a local counter is usually preferable to a commercial service, in part because commercial counting services often slow down the page loading time).

Analyzing log files. Another way to monitor the traffic on your web site is to analyze the log files of your web server (servers typically keep a log of the web pages they serve, the time they served them, and the characteristics of the computers that made page requests). This method of gathering information will probably require the assistance of technical support professionals at your institution, but the necessary software can usually be installed within a day or two, and the results are much more informative than the information provided by digital counters. For example, the first log analysis program I used, AccessWatch (Maher, 1998), was installed in less than three hours and displayed not only the number of visits to each page, but also information on the sequence of pages that were visited, a general profile of who was accessing the pages, hourly information on the flow of traffic, and the mean number of pages viewed per visit. This information helped me tailor the site to the needs of visitors, schedule web maintenance at off-peak hours, and devote my time to the pages that receive the highest amount of traffic. It also eliminated the need to install separate counters on each page, and it avoided the slow-down in page loading caused by many digital counters.

Tip 7: Assume Nothing, Check Everything

Once you create a web page that looks good on your computer, visit the page from as many other computers as possible. Access the page through a commercial service provider such as America Online. Look at it on a variety of monitors. Print it out. Compare how the page looks on a laptop computer versus a desktop computer, or a PC versus a Macintosh. What you see may surprise you.

For example, a scanned image that looks perfect on a PC may appear somewhat bleached out on a Macintosh computer, because identical images typically appear lighter on Macs than PCs (one of many "cross platform" differences). Macs and PCs also have different color palettes, which means that images may be rendered differently if they contain colors that stray beyond the 216 "web safe" colors that are displayed uniformly by web browsers on both types of computer. Even text is not immune from cross platform differences (e.g., the Windows operating system has traditionally used arial as its favored sans serif font, whereas Macintosh and Unix operating systems have favored helvetica).

In addition to cross platform differences, there are a number of "cross browser" differences. To take just one example, suppose you set WIDTH=50% for an image inside the cell of a table. In Microsoft's Internet Explorer the image will appear half as wide as the table cell, whereas in Netscape's Communicator it will not. Compounding these browser differences, there are even wider disparities among various generations of web browsers. From a practical point of view, this means that many visitors will not be able to benefit from Java programs, Dynamic HTML, or other advanced features. Clearly, these generational differences in browsers are not a reason to forgo recent advances in web authoring, but they do suggest the importance of designing web sites with a wide audience in mind.

Perhaps the ultimate challenge in this respect is to design a web site that works even when visitors are using a text-based browser (e.g., Lynx) or when they have configured their image-based browser to avoid displaying images (sometimes done to load pages faster and reduce connect-time charges for Internet access). One very helpful tip in this regard is to add an ALT tag to each image statement on your page (an ALT tag displays an alternate text-based description of the image). An example would be:

<IMG SRC="spn.jpg" ALT="Social Psychology Network">

In the previous statement, spn.jpg refers to a graphic image file containing the logo for Social Psychology Network, and "Social Psychology Network" is the alternate text that visitors will see if they are using a text-based browser.

Finally, one last thing to check is that your images and links are functioning properly. If your site is relatively small, you can accomplish this task by periodically visiting each of your web pages, visually checking for broken images, and clicking on all links to ensure that they are still current. For sites that are larger, the most efficient way to check links and images is with automated link-checking software. In the case of Social Psychology Network, for example, there are more than 5,000 links and images, so I use a software program called. This program is able to check the entire site in about 20 min, and it generates a report that pinpoints broken images, bad URLs, and faulty e-mail links.

Tip 8: Spend Time Promoting Your Site

If your web site is strictly for use in a class, then there is no need to worry about listing it with search engines or having other sites link to it. If your work is designed for a wider audience, however, then the only way to build traffic is to spend time letting others know about the site. For example, you might develop a brief announcement and e-mail it to colleagues and students, inviting them to visit the site and encouraging them to pass along your announcement to others who might be interested. Or you might submit bulletins to professional newsletters, listservs, or electronic newsgroups that accept such information. If you feel your site is of potential interest to other web developers, you might also e-mail webmasters at related sites and request that they consider addinga link to one or more of your pages.

Another way to increase traffic is by submitting your pages to search engines in the hope that people who are searching the web will be directed to your site. To submit your site to search engines, you can either (a) visit individual search engines and follow their instructions for submitting web pages, (b) visit a registration web site that will, without charge, submit your pages to multiple search engines simultaneously, or (c) pay for your site to be professionally promoted. There is even search position software available for tracking the extent to which your pages have been indexed by major search engines.

Regardless of the registration method you choose, there are several things you can do to increase your ranking in the output of search engines. First, be sure that all your pages have a descriptive title in the <HEAD> section of the HTML file. For example, instead of using an HTML title statement like:

<TITLE>Other Links</TITLE>

create a more detailed title such as:

<TITLE>Links to Other Social Psychology Web Pages</TITLE>

Titles not only appear in the title bar at the top of the screen when a web page is visited, they are also displayed in the results of most major search engines. Without an informative title, the search engine may simply list your page as "No Title" or may use the URL as a substitute title, which is unlikely to draw visitors to your site (Note: Do not confuse title statements with the headings or titles you display on the web page itself; HTML title statements require the use of <TITLE> tags). In addition to creating an informative title, be sure that the first few sentences of your page adequately describe its contents, because some search engines use these lines to assess the relevance of your page to a search term, and some even reproduce these opening lines in the output of a search (to give a sense of what is on your page). A key point to understand here is that even if your page is indexed by a search engine and appears in its output, few people will visit the page unless your title and opening lines are sufficiently descriptive.

Another useful strategy is to place META tags in the <HEAD> section of each HTML file (META tags contain information that is not displayed on the web page itself). Some search engines will use a META tag "description" statement as your site's description in the output of a search, and many search engines will use a META tag "keywords" statement to index according to keywords you provide. The format of these statements can be seen in the <HEAD> section of the affirmative action page mentioned earlier:

<HEAD>

<TITLE>Ten Myths About Affirmative Action</TITLE>

<META NAME="description" CONTENT="A concise essay in support of affirmative action.">

<META NAME="keywords" CONTENT="affirmative action, minority, female, equal opportunity, employment, jobs, hiring, quotas, civil rights, prejudice">

</HEAD>

The main advantage of META tag descriptions is that they usually yield more traffic than a straight reproduction of the opening lines of text on your page (in fact, many webmasters write them as an advertisement for their site). And the main advantage of a META tag keyword statement is that you can provide an ordered list of likely search terms for your page, including terms that do not appear in the text on your page. META tags are especially important for web pages that use frames or begin with advanced features such as imagemaps and JavaScript programs -- without META tags, these sites may be difficult for search engines to index.



Conclusion

As other authors have noted, the web opens up new opportunities for student scholarship and learning (Newcomb, Berkebile, Newman, & Parker, 1998). In the foregoing recommendations, I have tried to offer a set of guiding principles and practical suggestions to facilitate the development of educational web sites. Although portions of this article may seem somewhat technical to readers who are new to web page design, most suggestions are easy to implement with a basic grasp of HTML.

In closing, it is worth considering the global possibilities afforded by educational web development. In a recent essay on the uses of technology in higher education, Gates (1997) invited educators to imagine a world in which political science students in the United States published Bosnia-related reports on the web and received direct feedback from students in Bosnia. Within psychology, we should be equally ambitious in the worlds we envision for our students. By creating innovative web sites and making these resources available to others, we have an opportunity to enrich and expand psychology instruction in ways that have never before been possible.



References

American Psychological Association. (1997, November). Publications and Communications Board of the APA Web Posting Policy [Announcement posted on the World Wide Web]. Washington, DC: Author. Retrieved October 1, 1998 from the World Wide Web: http://www.apa.org/journals/fullposting.html

Callihan, S. E. (1997). Learn HTML in a weekend. Rockli, CA: Prima Publishing.

Campbell, B., & Darnell, R. (1997). Teach yourself dynamic HTML in a week. Indianapolis, IN: Sams.net Publishing.

Cohen, L. H. (1979). The research readership and information source reliance of clinical psychologists. Professional Psychology, 10, 780-785.

Garvey, W. D., Gottfredson, S. D., & Simmons, J. G. (1984). A comparison of two major scientific information exchange processes in psychology: 1962 and 1976. American Psychologist, 39, 11-21.

Gates, B. (1997, Fall). Linked up for learning: Using technology on campus. Education Record, pp. 34-41.

GradeGetter [Computer software]. (1998). Middletown, CT: Information Technology Services, Wesleyan University.

Holzschlag, M. E. (1998). Web by design: The complete guide. San Francisco, CA: Sybex.

Huberman, , B. A., Pirolli, P. L. T., Pitkow, J. E., & Lukose, R. M. (1998). Strong regularities in world wide web surfing. Science, 280, 95-97.

Karp, T. (1998, November 16). Art and the Zen of web sites. [Page posted on the World Wide Web]. Jamaica, NY: TLC Systems Corporation. Retrieved December 23, 1998, from the World Wide Web: http://www.tlc-systems.com/webtips.shtml

Lemay, L. (1997). Web publishing with HTML 4 in a week. Indianapolis, IN: Sams.net Publishing.

Maher, D. G. (1998). AccessWatch 2.0 [Computer software]. Fairfax, VA: Maher Consulting Corporation.

Marchant, B. F. (1996). On-line on the Internet: First Amendment and intellectual property uncertainties in the on-line world. Howard Law Journal, 39, 477-503.

Newcomb, A. F., Berkebile, N. M., Newman, J. E., & Parker, S. W. (1998). Student projects embracing new computer technologies: Opportunities for student scholarship on the World Wide Web. Teaching of Psychology, 25, 52-58.

Oliver, D., & Holzschlag, M. (1997). Teach yourself HTML 4 in 24 hours. Indianapolis, IN: Sams.net Publishing.

Plous, S. (1996). Ten myths about affirmative action. Journal of Social Issues, 52, 25-31.

Rosenberg, R. S. (1997). The social impact of computers (2nd ed.). San Diego, CA: Academic Press.

Rosenoer, J. (1996). CyberLaw: The law of the Internet. New York: Springer-Verlag.

Rudenstine, N. (1997, February 21). The Internet and education: A close fit. Chronicle of Higher Education, p. A48.

Siegel, D. (1997). Creating killer web sites: The art of third-generation site design (2nd ed.). Indianapolis, IN: Hayden Books.

Urbaniak, G. C., & Plous, S. (1998). ResearchRandomizer 1.5 [Web-based interactive program]. Available on the World Wide Web: http://www.randomizer.org

Vasquez-Peterson, A., & Chow, P. (1997). Teach yourself great web design in a week. Indianapolis, IN: Sams.net Publishing.

Wildman, R. W., II & Wildman, R. W. (1977). Relationship between articles read and reprints requested. American Psychologist, 32, 779-780.

Williams, R., & Tollett, J. (1998). The non-designer's web book: An easy guide to creating, designing, and posting your own web site. Berkeley, CA: Peachpit Press.



Return to Top

©1996-2024, S. Plous