Web Writing Guidelines
for Teachers, Tutors, and Students
Text Only Version
(still under construction)A Project Developed for the
Computers, Writing, and Research Labs at the
University of Texas, Austin by
John Runnion
Spring, 1999Please Note that some of the links in this text go to graphic images or pages with tables and graphics.Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citations
This node explores some of the basic organization, structure, and design style aspects of writing for the WWW. There are many fine publications online and in print which cover these issues in depth. These pages are primarily focused on a general overview of the issues involved in the teaching and tutoring of students in the beginning stages of writing in a hypertextual environment. Our main purpose is to raise the questions which need to be asked about writing for the web; questions that are beyond the scope of traditional (print based) writing instruction and tutoring. Students may also find it beneficial to explore these guidelines, since doing so will give them a sense of what instructors may be looking for in web writing assignments. Introduction
Navigation Conventions
If this is your first visit to the guidelines, here are some of the navigational conventions used on this node. We recommend that you set your browser to accept our web page colors, fonts, and images. If you are visually impared, there is a text only version of the guidelines.You can also follow standard links from various graphics, text, and headings in order to go to that subject directly rather than follow our order in the presentation. We hope these guidelines are helpful.definitional links: BOLD or CAPS bibliographic links: (in parentheses) links to external sites: http://www.full.URL.given large graphics: (size in KB shown in parentheses) examples: (example)
Note:
The "Web Writing Guidelines for Teachers, Tutors, and Students" were compiled by John Runnion <http://www.cwrl.utexas.edu/~runnion/> from a variety of sources and the combined experience of many people associated with the CWRL over a number of years. We welcome comments, suggestions, or corrections. Please feel free to e-mail John directly, or use the feedback button at the top of the CWRL <http://www.cwrl.utexas.edu> pages previous to this one.
Overview
WorldWideWeb
These guidelines are primarily about writing assignments published as WWW pages, but you might want to keep in mind that the Internet is only one instantiation of what Espen Aarseth called "cybertext" writing, and it may not be the best one for a given classroom purpose.Other Kinds of Cybertext
Many instructors here at UT have assigned Storyspace (about Storyspace: <http://www.cwrl.utexas.edu/~slatin/environments/sstoweb.html> and MU (about and links to MuDs and MUs: http://www.cwrl.utexas.edu/moo/) style hypertext writing assignments as well. These cybertextual environments are different than web pages in a variety of ways; however, many of the principles outlined here will apply to them in varying degrees depending on the particular writing milieu. Still, the majority of assignments that are "hypertextual" here at UT (and most colleges) will be Web writing assignments.General Questions
The Canvas we use
These pages take a broad brush approach and discuss design style issues in rather general terms, not "academic speak" with references and citations to specific theorists or the specifics of design implementation. There are many books, articles (online and in print) and essays which cover these issues more in depth.What's the question?
Our approach is to bring up the kinds of questions teachers, tutors, and students might ask about their web page work, rather than not just providing "rules of design." Your own reaction as a reader to the web page will probably be your best initial guide, frankly. Of course, there are some of us who tend to be "graphically challenged" and overwhelmed by the visual aspects of the medium . . . in which case, we limp along with "rules of thumb."To Tech or not to Tech
Finally, instructors and students probably should not expect any of the Undergraduate Writing Center tutors to give them assistance with technical issues, like html tags or how to use the software with which they are designing and implementing their web projects. For those issues, students ought to go to one of the labs, their own instructor, or one of the many workshops available online and at UT.
Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citations
To The Writing Tutor
First things first
First, as always, it's a good idea to check the Instructor's assignment page for writing and grading criteria. These can vary widely. The continuum spans from emphasis on traditional writing skills on the one end to technical expertise on the other.Mystery!
As in traditional tutoring, what the Instructor requires is often the first mystery a student or a tutor must unravel! Even clearly delineated criteria can seem overwhelming and confusing to a novice web author (and some of us who aren't novices get confused too).Tutors need help, too . . .
We recommend that Instructors tell their students to bring a hard copy of their writing assignment page to the Writing Center when they come in for assistance. Even if the student is thoroughly familiar with the assignment, it is unlikely that the tutor will be. This information can help guide the tutor in guiding the student.
About the "Mechanics" . . .
Many of the same elements of writing that are found in traditional writing apply to hypertext writing, so these guidelines cover those elements that make hypertext assignments unique. Of course, if a student is obviously still struggling with mechanics, it may be more important to focus on the basics, rather than the variations outlined in these quidelines. For tutors, asking the student for a hard copy print-out of the page or pages may better facilitate that kind of work. However, for the issues discussed in these guidelines, tutors will probably want to view the pages as they are seen at "publication." That is, on the web browser of their choice.
Differences that Make a Difference
Three issues . . .
There are three general issues in hypertextual writing where some variations from traditional writing occur: Design style, Organization/Structure, and Research.Interpenetrating
As with all writing, these elements are separated only for convenience; in actual practice they are recursive and interpenetrating: each affects the other.A classical view . . .
It may also be useful, for the purposes of discussing hypertext writing, to think of our old friend the Rhetorical Triangle, "Ethos/Pathos/Logos," and how Design Style and Organization/Structure relate to those principles of rhetoric.About audience . . .
This issue, sometimes included as part of the rhetorical triangle under pathos, bears mentioning briefly on it's own, though a lot could be said about it.
Audience
Real writing
One of the principle attractions to Web writing assignments is the fact that writing published on the Web is one way to make student assignments "real." In my course "The Rhetoric of Hypertext" in the fall of 1998, students were aware that many of the people with whom they corresponded via e-mail (Michael Joyce, Carolyn Guyer, Stuart Moulthrop, and many other rather well known authors and scholars) would be reading their projects after completion. This brought home to most of them that their writing was not just "for the teacher," a hurdle most of us attempt to surmount in our writing instruction.Impacts all aspects of writing
Issues regarding audience should not be overlooked, though students generally are not very conscious of them. It is not enough for students to think of their audience simply as "anyone who browses the web." All of the issues presented in these guidelines also impact and are impacted by the question "who is your audience?".A beginning step . . .
A good beginning step might be to ask the writer to define the rhetorical situation: who is the audience, what is the purpose of the work, what is the thesis, and what "ethos" does the writer want the reader to infer.
Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citations
Design Style
Graphics, Layout (and navigation cues), Color Schemes, Legibility, Fonts,Contrast,
and Multi-media files.Ethos
What impression does the web page immediately make on the reader? Does the design suggest a business, a casual "entertainment," or some other approach to the subject? What is the color scheme? (and to whom is this likely to appeal?)Do the graphics take forever to download? Generally, a graphics file should not be larger than about 30K, and the larger an individual file, the fewer the number of individual graphics per page. Long downloads can infuriate many readers.
Is the layout of the design confusing, chaotic, elegant, or straightforward? Are navigation cues clear and well defined? Is there a site map? Does it impart enough information and do so in a clear and meaningful way?
Is the page legible? Fonts are an issue entire unto themselves, but at the very least is the font size large enough? Is the contrast between the background color and the font color good?
Misspelling seems to be particularly noticeable online, and detracts from the author's ethos as well.
Are multi-media files clearly annotated and linked, and are they justifiable?
All of the issues of style can impact the author's ethos.
Logos
In terms of both legibility and logic, graphics, multimedia, and links can be overdone; in addition, they need to clearly enhance, support, or emphasize points in the essay (rather than using gratuitous graphics or over-abundant links).A design which distracts, confuses, or seems extraneous to the arguments in the essay can negatively impact the reader, the "flow" of the argument, and the impact of the content. Design issues must therefore be carefully considered.
As one does with citations and quotes in a traditional essay, links to graphics, other internal pages, multi-media files, and especially external web pages should be well introduced, annotated, and clearly support the essay.
Does the style enhance the logic and necessity of these? Or are they a distraction? A balance must usually be struck between form and content such that each supports the other.
Pathos
"A picture is worth a thousand words:" if it's not, then consider throwing it out! Does the style of the pages emphasize the pathetic appeal? Does it detract?Color itself (and the combination of colors) can generate emotional responses in this very visual medium: has the student shown an awareness of this?
Too many graphics, too many links, and extraneous design elements can actually undermine the pathos of the argument by making the reader uneasy, distracted, or even antagonistic and can negatively impact the main arguments.
Multi-media files tend to be large and take a long time to download. If such files are used, do they support the essay? Are they clearly annotated? If not, the reader may become frustrated or simply jump ship and go to some other web site.
In summary, judicious and adroit use of stylistic elements can enhance the pathos of the argument.
Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citationsStructure & Organization
Introduction
Hypertext?
What makes "hypertext" a different kind of writing from traditional writing? Basically, "hypertext" is the linking of individual nodes of "text" (or lexia) into a web of interrelated components. For instance, footnotes or endnotes in a traditional essay are a type of "hypertext." But, "text" in this case must be seen in a much broader context than simply a set of words. Because we are focusing on Web work primarily, we are also talking about graphics and multimedia as part of the rhetorical situation."Structure" & "Organization"
For the sake of convenience, we can think of "structure" as the form in which pages and content are interrelated to other pages and content. "Organization" can be thought of as interrelationships of the content (or the ideas). These two, of course, are recursively related and the distinction between the two can be quite blurry. We use these terms as an aid only, not as a hard and fast heuristic.A continuum of structure . . .
Structures can vary from a traditional essay converted to html (a single continuous page, perhaps with anchors to subsections of the essay) all the way to a complex, multi-level (and, at worst, chaotic) web site. Site maps and navigation cues become more important as the continuum moves from left to right.Organization takes planning . . .
As with traditional essay writing, there are many ways to organize ideas. Writing for the Web expands the options in many ways, but can also make things more difficult. A well structured site, with a lot of pre-planning, can assist the writer in organizing their ideas. Attempting to organize and structure a web site after the fact is much more difficult and time consuming.Many instructors require their students to make their arguments on multiple pages and to arrange those pages in a logical way. A not too infrequent problem students have is that they haven't really given too much thought to the best way to organize their ideas or structure their site. Structure and organization can be hierarchical, cyclical, web-like, or even linear. As with all design issues, the structure of the site and the organization of the ideas should enhance the overall purpose and logic of the essay. It sometimes helps to graphically illustrate the structure of the site and the organization of the main ideas in the essay (gasp!) on paper first. Structure and Organization: Logos
Linking . . .
External links should probably be indicated as such (and well annotated). Authorial ethos and logos can both be negatively impacted by a link to a site which is contrary to the author's statements about the site - care must be taken in the annotations! It is also important that the student read the external site carefully to make sure that it supports the argument in the way the student would prefer.An alternative to external links (depending on the Instructor's assignment) is simply to site the source in a linked bibliography.
Navigation links . . .
A complex structure will need to have navigation links so that the reader can easily move from one place to another. These might be in the form of an image map at the top or in the margins of each web page, or at the bottom. Some students will use images to indicate back, up, or next, but these images probably ought to be defined somewhere, probably on the first web page.Transitions and links . . .
Links ought to be consistent! That is, there ought to be some indication (which can act like a transition) that a link is to a bibliographic citation, a "footnote" (or interesting side-bar), the next main idea, a multimedia file, or an external link to some source or example. Transitions are very important in Web essays, perhaps even more so than in traditional essays, since one cannot be certain where a reader will go from here, or from which page the reader has come. A brief synopsis can often assist the reader in getting the "gist" of the preceding page if they come from some other part of the site or the WWW. Graphics can often be enhanced and the meaning clarified with synopses.For multi-level or multiple page sites, it is usually preferable to have the first page contain a simple overview of the site and the essay.
Marginalia
Some students have had great success with their pages by including quotes from the text alongside the main text (or a graphic) in a margin (9KB). This provides an aid both to their organization and to the reader. Such quotes, of course, need to be set off by color, font, size, or some other distinguishing characteristic or characteristics.As in traditional essays, the ethos of the author can be seriously undermined by a counter-intuitive or disorganized structure. The more sophisticated the structure, the more important it becomes to think through the navigability issues involved in advance Here's an example (9KB) from Mike Chorost's class. Structure and Organization: Ethos
In addition, the nature of the web and its constituency is such that the writing style tends more toward journalistic techniques, rather than long, involved, and "flowery" explication. "Get to the point" is a rule of thumb. The organization and structure of the work usually ought to follow the same idea, or the author may lose her audience (this, of course, can also affect Pathos).
Structure and Organization: Pathos
Emotional appeals can often best be made through graphic images, but these images need to be chosen with caution. Does the image impart the "information" unambiguously? Probably not, and in such cases it is often useful to include brief descriptions along with the image, clearly demarcated from the main text by color, font, position, or any combination of these or some other scheme.Multimedia clips, either sound or video, can also serve the purpose of emotional appeal, but these also need to be scrutinized for their rhetorical appropriateness.
Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citations
Research, Resources, and Citations
Credit where credit is due . . .
At the very least, most sites request links back to them if their graphics or multimedia files are used- this is a part of the citation conventions for Web pages, and an author needs to be aware of the permission requirements for any externally obtained material. Some sites do not give permission for "fair use" at all.
Ah, those external links!
Just like graphical elements, there should be no gratuitous or extraneous external links (or broken ones), and the "linked to" site should be evaluated for its veracity and relevancyLinks can and should be explicated in relatively compact ways for transitions and readability.
Continuity is also important. It can be very frustrating to a reader if links are provided without any clues as to the nature of the information available "on the other end" of the link. If links are provided to the bibliography, they ought to be done in the same way throughout the essay, and "footnotes," or sidebars, should also be handled in a consistent, though different, way.
Links that don't work are worse than worthless, they are a detraction from authorial ethos and can frustrate the reader. They need to be corrected or eliminated.
Citation conventions . . .
Citation conventions can vary widely. It is important to check the Instructor's criteria for citations, and to be aware of the differences between citation guidelines for codex (print based) works and Internet or online resources.Introduction | Overview | General Questions
To The Writing Tutor | Differences that make a Difference | Audience
Design Style: Logos | Ethos | Pathos
Structure & Organization: Logos | Ethos | Pathos
Research, resources,and citations
Please direct comments, questions,Thank you for visiting the Web Writing Guidelines for Teachers, Tutors, and Students. We welcome your comments, suggestions, or queries.
or queries to:
John Runnion or go to the
CWRL feedback page.
Date Last Modified: 2/14/1999
A Project for the CWRL at the University of Texas, Austin
El diseño de la página y las imágenes son
© 1996-2000, Universitat de València Press
© del grupo "mmm"
Comentarios a: fores@uv.es
València 15th September 2000