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.
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 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 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:
Conner, R. (1997, July 16). HTML editors: Find the right tool [Online]. Available: http://www.cnet.com/Content/Builder/Authoring/Htmleditors/ [1998, March 23].
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.
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.
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."
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
© 1998, colleen bell about
transplantedgoose.net / words