Instructional learning goals should drive media selection, application, and the course development process. Characteristics of the distance learner and the impact of technology are also important considerations in instructional media selection and course development.
design should be consistent and aesthetically pleasing to orient the
learner and gain their attention. Disorientation is a common complaint
when learners browse the web. "Where am I in this web site?"
and "how do I get where I want to go?" Again, many design
"guides" rely on generalities - "be sensible, clear,
and clutter free (Everhart, 1997). However, there are specific techniques
shown by research to be effective for information retrieval and processing
on the web.
NOTE: The use of Course Management Systems, such as ANGEL the system used at FGCU, has made delivery of web content much easier to manage. Therefore, some of the information in this and following screens is not as applicable as when these guidelines were first written. However, much of the information is still very relevant when designing web pages to run within the system.
Presentation | Interface Design
| Multimedia Elements
The information on a course web page should be organized in a way
that facilitates information processing and reading.
the information on the web page clearly and in a logical flow.
The purpose of educational web design is not to just present
information, but to assist students in learning the information
text has an advantage over electronic text because the
information is presented in a linear way and can be broken
into easily recognizable "chunks." The students
can control the pace at which they learn these chunks.
In a textbook, chapters, pages, sections, headings, even
paragraphs all "chunk" information in ways to
help students comprehend and learn.
sites should emulate this "chunking" strategy.
adequate amount of information on a screen.
indicate that scrolling should be minimized (Shotsberger,
1996). People will scroll for a known purpose, such as coming
to the end of a clearly defined section. However, a single
screen of endlessly scrolling data, even if broken into headings,
creates a navigational and comprehension barrier. Without
"chunking," students become overloaded with information
and comprehension drops.
is an example of vertical scrolling. Generally, horizontal scrolling
is more objectionable than vertical scrolling.
C. Use shorter lines of text if the web page is intended to
be read on-screen.
dependent online newspapers and magazines use a single
column of text taking up no more than 50% of the screen
(40 to 60 characters per line.) For example: http://www.cnn.com
addition to the 50% column "rule," text segments
should be broken into smaller blocks. There should be
less text than in print counterparts. Studies show reading
information from a computer screen can be as much as 30%
slower than from a printed page (Debra, 1996; Wright &
Lickorish, 1983). "Chunked" layout delays fatigue
and increases comprehension (Debra, 1996).
site, from a Fall,
1998 course, is a good example of bad design. Even
though the page contained images, every student in class
reported using the option of downloading and printing
the document. It was just too hard to comprehend by reading
it on screen.
D. Place the
important information at the top of the web page.
the journalism model of the "inverted pyramid",
placing important information at the top of the page.
E. Appropriately use white space to increase the page's visual appeal.
print world calls this "creative use of white space."
If only 50% of the screen is taken up by text (See 3.1.1.
C), what fills the rest? The balance of the space is filled
with navigational elements, appropriate graphics, and "nothing"
(white space). White space helps to divide the "chunked"
portions of the screen so that they are more easily read.
F. Choose the right screen size to design the course web pages.
is no agreement on appropriate screen size, however most of
today's users use a resolution of 1024 x 768, so it is probably
most prudent to design for that size. When using tables, designate
a width using percentage rather than pixels, (EX: width=80%
instead of width=540 pixels) so that the table will resize
according to the actual screen width.
can test both their computer screen settings and also a
variety of other browser
The course content should be clearly organized and the course web
pages should be logically linked to facilitate information retrieval.
B. For advanced
and experienced users, use more complex and nonlinear structure.
A. For novice and naïve web users, it is better to structure
the course web site in a simple and linear structure.
are four main organizational strategies for web sites:
Sequence - a linear narrative
Grids - a good way to correlate variables
Hierarchy - one of the best ways to organize complex bodies
Web - which mimics associative thought and free flow of ideas.
strategy used will depend on both the purposes of the site
and the specific content. The
Yale Style Manual
provides a useful information on incorporating these four
3.1.3 When preparing
content for the course web site, bear in mind that the course content
delivered on the web must be provided in a format accessible to persons
with disabilities if requested.
A. The "Design
Standards for FGCU World Wide Web Resources" clearly states the
FGCU policy on web accessibility for persons with disabilities. "In
order to support the information and educational needs of persons
with disabilities, all FGCU information delivered through the WWW
must be made available in a format that makes a reasonable accommodation
for persons with disabilities."
may be accomplished by making the web-based materials also available
as a text-only viewing option, or it may require an alternative
method of information delivery for those students who need it.
One or the other is required." Review the FGCU
Web Resources Design Standards.
does not say that all web-based information must be completely
accessible to students with disabilities. In fact, techniques
that would enhance accessibility to visually impaired students
might decrease accessibility to hearing-impaired students
due to differences in learning styles. Each student with a
disability must be uniquely accommodated in relation to his
or her specific disability. For assistance in providing accommodation,
contact the Office of Multi-Access Services at 239-590-7925.
may be measured for accessibility in accordance with standards
developed by the Center
for Applied Special Technology. This website allows you
to test web pages for various accessibility issues.