Chapter 7 concentrates on the design process involved in the production of the multimedia product. While the focus is on basic principles of effective communication and navigation, suggestions for product design will also acknowledge that the primary goal is content area learning.
Here are some questions to guide your study:
There are some decisions designers should make before they begin assembling a web project.
A.1 Content
The content is the information or experience the web project has to offer. As an educational product, the web project should result in the creation of web content that extends the learning experience of student web authors to document or teach what they have learned.
A.2 Purpose
Purpose refers to the intended experience of the individuals who will examine the web project. The online experience can be structured to involve site visitors with the same basic content in different ways (based on Lynch and Horton). Committing to a purpose will influence the information that web authors present and the structure of the web site.
A.3 Audience
The audience is the group the web author would like to attract to the web site. Web authors attempt to adjust their presentation style to their intended audience. School web sites might be targeted at parents, students of a similar age, or other students in the same school. There are other ways of thinking about the audience. One differentiates "web surfers" from "committed site users." This distinction influences whether attention must be devoted to attracting users to a particular site or whether it can be assumed that specific visitors already have a reason for coming to a site and the designer's effort can be focused on efficiency and clear communication.
Content organization concerns the way individual web documents are connected. Web designers connect web documents through the use of links and the links allowed determine the organizational structure.
B.1 Sequential design
In a sequential design, each element leads directly to the next element in a logical sequence, with no other options for the user. The sequential design is especially useful when the purpose is to train the learner in a specific skill.
B.2 Hierarchical design
A hierarchical design organizes content as a system of categories and subcategories. A hierarchical structure is an effective way to organize information when the intent is to allow users to find what they want without having to inspect all of the information that is available.
B.3 Web design
A web design creates a complex set of connections among web pages. The intent is to provide the user as much freedom as is reasonable to follow links that address personal interests.
The user interface is the collective mechanisms through which a user interacts with web resources. The most basic form of interactivity is the navigation system - the links through which the user can move about within a particular web site and also connect to other sites. Links can originate from a word or phrase, an image, or a "hot spot" within an image (image maps).
C.1 Text links
C.2 Image maps
When a single image contains multiple hot spots (links), the image is called an image map. Each hot spot functions as an independent link.
C.3 Guideline for links
C.4 Guidelines for navigation systems
Good page design optimizes the qualities of communication and interactivity. Page design is partly a subjective and artistic process, but there are basic principles that functionality.
D.1 Page layout
D.2 Templates
A page template defines areas of the page and identifies the general type of information to appear in these areas.
A basic template appropriate to student projects might contain areas dedicated to:
Additional suggestions
D.3 Text presentation
Web pages tend not to mimic book pages. Screens of solid text are difficult to read. Text tends to be blocked and surrounded with space. Colored text should be used with caution.
Web page images generated a good deal of the early enthusiasm for the web. Students can acquire images in many ways and the processes of generating or capturing images and then manipulating these images for presentation allow unique learning opportunities. Web authors must become familiar with some of the challenges involved in presenting images online.
E.1 Image size
Image size is related to the size of the image file. Larger files take longer to download. When it is likely users will have slow connections, it is useful to first present a small version of the image (i.e., thumbnail) and offer the opportunity to view larger file. Web authoring programs typically offer a way to "resize" images so authors can adjust the way images will appear on the page. However, it is best to save web images in multiple files (e.g., thumbnail and full-size). Establishing a smaller display size in HTML does not reduce the time to download the image file.
E.2 Graphic file format
Nearly all web graphics are sent over the Internet in one of two file formats: GIF (Graphic Interchange Format) and JPEG (Joint Photographic Experts Group). GIF and JPEG are designed to work cross-platform - to work on different types of computers. There are some limits to this cross-platform compatibility.
E.2.a GIF applications
E.2.b JPEGs
E.2.c Important suggestion
When creating JPEGs or GIFs, it is always a good idea to work from an original image (the original image is likely to be in an entirely different format). Give the JPEGs or GIFs created from the original a different name and store the original image. When creating web images, a certain amount of experimentation is inevitable and the most flexibility is available when modifying the original image.
E.2.d Positioning graphics
One of the easiest ways to align objects on a web page is through the use of tables. Images and segments of text can be inserted in the cells of the table.
E.3 Image maps
An image map provides a unique form of interactivity. An image map allows the designation of invisible or visible "hot spots" within an image. These hot spots can then function as links. Many web page authoring programs automatically generate the html code necessary for "client side image maps" when the web author simply designates areas of the image and enters the corresponding destinations.
Image maps have some interesting educational applications. Clicking on part of an image can be a way to:
When using image maps, it is usually a good idea to also offer a text version of the links available from the image map hot spots.
How does the teacher balance the development of web design skills with content area responsibilities? The development of design skills does impose some new expectations on the teacher and students. We propose that design skills be developed within the context of authentic student projects and scaled to the time and academic level of students. It should be possible to identify prioritize specific skills students should acquire.
For authentic students projects to achieve their potential benefit, student performance must be evaluated in ways that students find both informative and fair. A common way to achieve these goals is through the use of an assessment rubric. The rubric identifies key attributes of the project and/or the processes contributing to the project and levels of quality that apply to each attribute.
|
|
||
|
|
|
|
|
|
||
|
|
|
|
|
|
||
|
|
|
|
|
|
||
|
|
|
|
|
|
|
|
||
|
|
|
|
|
|
||
| The information is poorly written, inaccurate, or too brief. . | The information is adequately presented with few spelling or grammatical errors. | The information is interesting to read and contains very few errors. |
|
|
||
| The pages are difficult to read, and the layout is disorganized. | The pages are adequately designed, and the text is readable. | The pages are particularly well organized and attractive. |
|
|
||
| The links are missing or do not work. | The links all work, but labels are unclear. | The links work, and link purpose is clearly communicated. |
|
|
||
| There are no images. or the images are not appropriate to demonstrate the characteristics of a habitat or a method of construction. | The images are appropriate, but of poor quality. | The images are appropriate and of high quality. |
|
|
||
| The group has obvious difficulty getting along, and the members allow or require one student to do most of the work. | Each group member contributes, but group interaction is limited. | All group members contribute, and the group works together to improve the quality of the final product. |
7/9/00