transplanted goose - Everyone's Using the Web, So Why Aren't We?

Consider this hypothetical conversation between two ESOL teachers:

First teacher: Everyone's using the web in the classroom these days except me. What's so great about it?

Second teacher: Well, I'm not using it yet, but I'm thinking about it.

First teacher: Why? Isn't it just a bunch of useless trivia, pornography, and bad information?

Second teacher: Actually, I've been doing some exploring on the web, and I've found several creative ways to use the web in the classroom. I'm even thinking of creating my own web site.

First teacher: Won't that take a lot of time? I mean, don't you have to learn some kind of computer programming language to create a web site?

Second teacher: Not at all. I've been doing some reading, and there are software programs you can use to create your web pages—it's just like using a word processor. And it can't be much more time-consuming than creating the handouts I use in my classes. I've seen some really creative ways to use the web in the ESOL classroom, such as using online newspapers and magazines to develop reading comprehension, using videos and sound files to give our students practice in pronunciation and listening comprehension, providing quizzes that allow our students to test their own progress, games our students can use to increase their vocabulary, discussion forums and chat rooms that allow our students to communicate with other ESOL students, and online magazines where our students can publish their writing. It's also a great resource for teachers, since it's easy to share curriculum materials and teaching activities around the world. And the beauty of the web is that my students can use these materials any time, not just in the classroom or when the language labs are free. And I can share the activities I've used successfully with other teachers. You know, I think I've just convinced myself to develop my own web site—I can't wait to get started!

What is it about the web that makes it so attractive as an educational tool? What benefits does it offer over other tried-and-true media, such as print materials, audiocassettes, and computer-assisted learning software? Perhaps it's that the web can be a relatively inexpensive way to provide educational materials; after all, most of the costs—time, software, human resources—are incurred up front in the creation of the material. There's no need for your students to purchase special software or hardware for their computers. Students can view and even download the materials for relatively little cost. Or perhaps it's because materials on the web are available to students around the clock—students can spend more time outside of class practicing the skills they've learned in the class, without having to wait for access to special facilities. Or perhaps it's because the web has some of the same seductive characteristics as television—with the potential to be much more useful as an educational tool—and entices students into using the web for beneficial activities. Whatever the reason, the web is fast becoming a tool that can both encourage and enhance learning.

As with any tool, however, there is a research and development process that leads to the final, marketable product. Customers will not buy a new product if it is flawed or doesn't work. The same can be said for web sites. They require planning and testing before developing the product that becomes marketable. This article discusses why web design is important, describes the process of designing a web site, and provides guidelines for developing an effective and useful web site. Finally, it provides a list of resources you can use to generate ideas for your web pages and refer to in the development process.

Why Web Design?

Consider the difference between an interior designer and an interior decorator. The decorator focuses on the decorative aspects of an interior—colors, fabrics, wallpaper, furnishings. But the designer also considers the overall design of the space and how it will be used, and often designs the decorative elements and furnishings that will occupy the space.

Well-designed web sites all have three characteristics: they are aesthetically pleasing, they are easy to use, and they provide accurate, authoritative content. The aesthetics—color, graphics, page layout—will attract visitors to your site; usability—ease of use, navigability, search capabilities—will keep them there; and content—the most important characteristic—will bring them back once they leave.

It's very easy to "decorate" a single web page, but designing a web site requires careful consideration of the user's needs. The best web sites are the result of many hours of planning on paper and experimentation with color, graphics, and page layout before committing to a single design.

The Planning Process

The research and development process starts with an idea that addresses a specific need. The first step in designing your web site is to define a need. What is the purpose of the web site? Who will use it? What added value will it provide? What technology is available to you? To your audience? What are the characteristics of your audience? What kind of physical, technological, or other limitations might they have? The answers to these questions will help guide you through the planning process.

The planning stage of the design process—encompassing everything from selecting a color scheme to deciding how many web pages you need and how they relate to each other—is essential. Well-planned sites are ones that provide universal access; that is, they are available to all web users, regardless of hardware, platform, software or connectivity. This does not necessitate building a site for the "lowest common denominator", but rather building in graceful degradation—providing alternatives for those visitors who may be using an older browser or connecting over a slower modem—without sacrificing usability. Some sites achieve this by offering "text-only" or "low graphics" options. Others offer the choice between a "deluxe" version, which uses non-standard features (e.g., java, frames) that require special browser plug-ins or a minimum hardware and software configuration, and a more accessible version that may not have all the "bells and whistles", but is still useable. Still others use the HyperText Markup Language (HTML), which offers some accessibility features. However you accomplish graceful degradation, your users will be appreciative.

By planning your site before you start developing the home page, designing graphics and creating the inner pages, you will save yourself the agony of revising several, sometimes hundreds of pages each time you change your mind (and you will!). And you will create a site where each web page is part of a cohesive whole, from the color and graphic elements, navigation tools and signature that appears on each individual page, to the way in which each web page interacts with the others on your site.

The Development Phase

The development phase is the most exciting—and sometimes the most tedious—part of the design process. Finally, we can see our ideas taking shape and watch our web site grow page by page.

There are several ways you can make the development of your web site easier and faster:

Create a template for your pages. Include the information—graphics, colors, signature, structural elements (e.g., tables)—that will appear on every page. Then just rename the file each time you create a new page and fill in the content.
Use an HTML editor. HTML editors allow you to create attractive and complex web pages without using HTML tags. There are several HTML editors available, some for free, and some better than others. You'll find a comparison of several editors, as well as a list of the features you should look for, in:
Conner, R. (1997, July 16). HTML editors: Find the right tool [Online]. Available: http://www.cnet.com/Content/Builder/Authoring/Htmleditors/ [1998, March 23].
Select graphical elements—backgrounds, bullets, bars, icons, animation—from the public domain. There are hundreds of web sites that offer an astonishing variety of "clip art" for you to use in your web pages. the Yahoo site has a fairly comprehensive list; visit http://www.yahoo.com/Computers_and_Internet/Internet/World_Wide_Web/ Page_Design_and_Layout/Graphics/ for a list of web sites.
Hire a graphic arts student from your local community college or university to design the graphics for your site. The student benefits from the work experience, and you get some great ideas for your web site.
If you decide to design the graphics yourself, there's no need to spend a lot of money on software such as Photoshop; there are several low-cost programs that will work just as well for your needs. A good example of a low-cost graphics program is Paint Shop Pro <http://www.jasc.com/psp.html>. It has many of the same features as Photoshop, at a much more reasonable cost.
If you have large amounts of text in print rather than in electronic format, use a scanner and OCR (optical character recognition) software to convert your text to electronic format. Any scanner will work, and there are several relatively inexpensive OCR software packages available.

Guidelines for Creating an Effective Web Site

Know your goals.
Who is your target audience? If your audience is both teachers and learners, you may need to create a web site for each audience. What is your message? What advantages does a web site offer your audience over more traditional formats?
Keep it simple.
The primary goal of your web pages should be to deliver information to your audience. Content is ultimately more important than form, although it is desirable to have attractive pages that will encourage your audience to return. When you use multimedia (images, sound, animation, video), it should always contribute to the content. Don't overload your audience with fancy formatting or meaningless graphics.
Borrow with honor.
It is very easy to borrow other people's ideas from the web. Your web browser will allow you to save any web page in either text or source (HTML) format. It is even possible to save images, sounds, animations, and other multimedia effects. If you see a page you like, you can borrow the "source" and replace the content with your own. It's important to remember that copyright law includes the Internet. All original content on the web—whether it's text, an image, a video, or a sound—is protected by copyright law, regardless of whether a copyright notice has been included. By using someone else's words or pictures in your web site you may be infringing on their copyright. If you don't have the skills or time to create your own graphics, there are many "clip art" sites on the web that offer graphics and other media that have been placed in the public domain—use a search engine such as Yahoo to find them.
Provide context.
You can help out your audience by letting them know who you are, how current the information is, and where they are in your site. Always sign and date your pages, provide a link to the "home" page (whether it's your home page or a departmental or institutional home page), and provide an email address so that individuals may contact you with questions or comments. After all, who better to advise you on what works and what doesn't than the people using your web pages?
Don't assume knowledge on the user's part.
Knowledge, experience, and culture determine how literate your audience is in using the web. It's good practice to make the organization of your site as transparent as possible, so that even a very inexperienced web user will be able to use your site. How easy is it to find your way around the site? Do the links clearly indicate to the user what he or she will find by following one of them? Are the navigation buttons intuitive, or is it necessary to provide labels?
Don't assume technology on the user's part.
It's impossible to account for the variety of software and hardware configurations your visitors will use to explore your site. Some may have brand new computers, with the latest of everything including the browser; others may have very old computers and use a text browser, such as Lynx, to access your site. Some may have super-fast Internet connections, but others may still connect over a 2400 baud modem. Because of this, it's important to let your users know up-front if you choose to use non-standard features, such as Java or frames, on your web pages. It's also a good rule of thumb to keep graphic file sizes small (less than 35 kilobytes).
Test your pages.
You want to be sure that your web pages are going to look as good on someone's else computer as they do on your own. As much as possible, you should test them on other browsers—I recommend using a text browser as well as a graphical browser—and on other computers. Web pages designed on a Windows 95 computer will look slightly different on a Macintosh computer. And web pages viewed in Netscape Navigator may look vastly different when viewed in Internet Explorer. The best way to find out if your pages work is to ask friends, trusted colleagues, and your students for feedback. They'll let you know if an image or page takes too long to load, if the colors look washed out on a Macintosh, or if they just can't figure it out.
Keep your pages up to date.
Once you've created your pages, your job isn't over. It's necessary to keep them up to date by adding new content, making sure all of the links work properly, and update the technology, if necessary.

In the end, the ultimate test of any web site is you. If your web pages can pass your quality test, and if you can answer the question, "Would I find this site worthwhile?" with a positive response, you have created a useful web site.

Ideas for Your Web Site

These sites show different ways the web can be used to enhance both learning and teaching for ESOL students and teachers. They also provide ideas and materials to enhance the classroom experience outside of the web. Most of them are also examples of good (or reasonably good) web design.

Armour, J. (No date). Etc.: ESL teacher connection [Online]. Available: http://www-personal.si.umich.edu/~jarmour/etc/etchome.html [1998, March 20].

"ESL Teacher Connection is a web site that provides an open forum in which teachers of English as a Second Language can share their own successful class activities and lesson plans with other teachers. An interactive 'bulletin board,' this web site allows you to post lesson plans and activities that have worked well in your classroom."

Bouzaglo, K. (No date). Clubs and classes in Santa Barbara [Online]. Available: http://www.xlrn.ucsb.edu/~kbouzagl/index-clubs.html [1998, March 20].

An example of a resource page for students. Also includes links to student web projects, although many of the links are broken.

Duber, J. (1998, February 23). Cutting edge CALL [Online]. Available: http://www-writing.berkeley.edu/chorus/call/cuttingedge.html [1998, March 20].

Demonstrations of Computer Assisted Language Learning (CALL) modules on the web. Modules include "My Apartment: The Game" (integrated skills practice); "The Store's Door", "I Want to Win!", "Tim's Teams", and "Very Berry" (listening practice); preposition practice; and grammar and listening practice. Requires Netscape 2.0 or Internet Explorer 3.0 (or higher) and Macromedia's Shockwave plug-in.

EF Englishtown [Online]. (No date). Available: http://www.englishtown.com/ [1998, March 20].

This site is organized like a city; inside you'll find the Learning Fair (with Story Stage, Culture Corner, Grammar Station, and Game Hall), Pool Chat, Teacher's Inn (The Brain Bar, Lesson Material Lounge, Lesson Plan Links, and Job Market), PenPal Club, and the EF English School.

Gurevich, N., & Olsen, B. (1998, February 14). The pedagogical resource page of the University of Washington ESL center [Online]. Available: http://weber.u.washington.edu/~ESLinfo/ [1998, March 21].

Includes resources for both teachers and students, including language-related computer resources.

Hernandez, Maria. (1996). ESLoop [Online]. Available: http://linguistic funland.com/ESLoop/ESLoop.html [1998, March 20].

"ESLoop is a collection of sites relevant to English Language Teaching and Learning on the World-Wide Web. ...ESLoop was begun in 1996 as a way to offer teachers and students of English a way to browse the internet for resources specific to English language teaching and learning... . ESLoop sites are all relevant to English language teaching and learning in some manner, from student projects and activities to scholarly papers to English for Science and Technology and job opportunities."

Korber, J. (1998, February). One world, one people: Multiculturalism, ESL and TESOL [Online]. Available: http://members.aol.com/Jakajk/Oneworld.html [1998, March 19].

Contains lessons, games and resources for the ESOL classroom, on topics such as community design, journals, survey questions, describing place, describing people, riddles and jokes, tongue twisters, and creating web pages.

Liu, R. (1998, February 3). English-l: The online community for ESL learners [Online]. Available: http://www.nease.net/~romaine/ [1998, March 20].

This web page describes English-L, "a mailing list where international learners discuss studying English as a Second Language (ESL)."

Lund, A. (No date). English as another language [Online]. Available: http://home.sol.no/~anlun/ [1998, March 20].

A resource for both learners and teachers, this site includes resources on grammar and poetry, examples of collaborative web projects, a list of online news sources, sounds and images, links to sites developed by other ESOL teachers, and a list of web resources on teaching ESOL. Selected as "an outstanding education-related site" by The Education Index, October 1997.

Opp-Beckman, L. (1997, October 27). PIZZAZ!... People interested in zippy and zany zcribbling [Online]. Available: http://darkwing.uoregon.edu/~leslieob/pizzaz.html [1998, March 20].

"PIZZAZ! is dedicated to providing creative writing activities and copyable (yes, copyable!) handouts for use with students of all ages. Permission is given to use these resources for in-class, non-profit use only. Prerequisite: An interest in using English in fun, dynamic ways! ESL Student Level: High Beginner +."

Stegemoller, W. [et al]. (1998, March 20). Exchange [Online]. Available: http://deil.lang.uiuc.edu/exchange/ [1998, March 20].

"The goals of EXCHANGE are to provide an opportunity for non-native English speakers to express themselves through the use of English; to provide resources to enhance the learning of English; and to create a unique source of knowledge and insight about different cultures. To accomplish these goals, EXCHANGE publishes writings of non-native English speakers from all over the world."

Resources on Web Design

The web can be a great source of information on web design, but sometimes it's also useful to use a book that can sit next to your computer. This list recommends some of the better web sites and books on web design.

C/Net. (1998). Builder.com [Online]. Available: http://www.cnet.com/Content/Builder/ [1998, March 23].

Hundreds of articles, product reviews, product evaluations, tools, tips and tricks for the web designer.

Davis, R. (1997). Web design resources directory: Tools and techniques for designing your web pages. Emeryville, CA: Lycos Press.

Normally I don't buy books of this type, because they become outdated so quickly, but this has proved to be a great resource for everything from HTML to images, sound and animation to scripting tools and making the most of your web site. Comes with CD-ROM. ISBN 0-7897-1060-9; $29.99

Flanders, V., & Willis, M. (1998, March 19). Web pages that suck: Learn good design by looking at bad design [Online]. Available: http://www.webpagesthatsuck.com/ [1998, March 22].

As the title says, sometimes we learn how to do something better by looking at a bad example. This site is one that takes pride in showcasing bad examples of web design, so that you can learn from other designer's mistakes. Another site that performs a similar function is:

Berlin, S. (No date). The Useless Pages [Online]. Available: http://www.go2net.com/internet/useless/ [1998, March 22].

The HTML Writers Guild: Web resources [Online], (No date). Available: http://www.hwg.org/resources/ [1998, March 22].

This is a rich collection of web resources, from graphics libraries to information on starting up your own web design business. The HTML Writers Guild had 50,000 members worldwide at the time of writing.

Lincicum, S. (1997, November 18). Resources for new web authors [Online]. Available: http://darkwing.uoregon.edu/~lincicum/resource.html [1998, March 22].

This site is a selective list of helpful web resources for new web authors. It offers comprehensive guides, quick reference guides, tutorials, style guides, HTML editors and software, information on publicizing your site, advanced topics, and fun sites.

Lynch, P., & Horton, S. (1997, January). Yale C/AIM style guide (2nd ed.) [Online]. Available: http://info.med.yale.edu/caim/manual/ [1998, March 22].

This style guide is considered to be one of the best on web design. It was written for the Center for Advanced Instructional Media at Yale University, although the issues and guidelines discussed in the manual do have wider applicability. And the graphics at the front door to this site are stunning (just reload the page to see a different image).

Mecklermedia (1998, March 21). Webdeveloper.com [Online]. Available: http://webdeveloper.com/ [1998, March 22].

This site provides one-stop shopping for the web designer, providing everything from HTML authoring to discussion forums to essays and articles on recent innovations in web design.

Musciano, C. (1997). HTML definitive guide (2nd ed.). Cambridge: O'Reilly & Associates.

Every web designer needs a good reference book on writing HTML. I have the first edition (1996) of this work in my library, and find that it provides all the answers I need. The layout is clear—each discussion of an HTML tag starts with a summary box showing the syntax and available attributes (and values, where dictated by the HTML specification); non-standard tags are clearly identified. ISBN 1-56592-235-2; $32.95

Nielsen, J. (No date). The Alertbox: Current issues in web usability [Online]. Available: http://www.useit.com/alertbox/ [1998, March 22].

Semi-monthly column on web usability by Jakob Nielsen, Sun Microsystems Distinguished Engineer. You can subscribe to the notification list, which lets you know when a new column has been published.

Siegel, D. (No date). Web wonk: Tips for writers and designers [Online]. Available: http://www.dsiegel.com/tips/ [1998,March 22].

If the author of this site was a schoolteacher, he would teach English grammar. This site focuses almost exclusively on the rules of web design, and when (and how) to break them. It has plenty of great tips for creating great web pages, creating white space on your pages, typography, using images effectively, and—not surprisingly—English grammar.

Tillman, H.N. (1997, November 8). Evaluating quality on the net [Online]. Available: http://www.tiac.net/users/hope/findqual.html [1998, March 22].

Hope Tillman is the library director at Babson College (Babson Park, MA). This article has evolved from its original 1995 version, but its focus is still on the need for content quality, as well as the need for critical evaluation skills on the part of web users. Clearly written from a librarian's perspective. Highly recommended reading.

Waters, C. (1997). Universal web design: A comprehensive guide to creating accessible web sites. Indianapolis: New Riders.

This book demonstrates how to create attractive web sites that are accessible to everyone. The examples clearly show that accessibility on the web is in no way synonymous with boring. This is the second offering from Crystal Waters, whose Web Concept & Design (1996, New Riders) is also highly recommended. Don't let the price scare you—it's well worth the investment and should be a part of every web designer's library. Comes with CD-ROM. ISBN 1-56205-738-3; $39.99

Weinman, L. (1997). Designing web graphics: How to prepare images and media for the web (2nd ed.). Indianapolis: New Riders.

Lynda Weinman is widely recognized as a guru on web design; her books are full of wonderful examples, as well as step-by-step instructions for creating great web graphics in several popular software packages for both Windows and Macintosh computers. This book is expensive, but if you're a do-it-yourself web graphic designer it's a very worthwhile investment. ISBN 1-56205-715-4; $55.00

Published in CAELL Journal , volume 8, number 4, Summer 1998 -
<http://www.olaweb.org/quarterly/quar7-2/>

Everyone's Using the Web, So Why Aren't We? Web Design and the ESOL Teacher