PURPOSE
STORYBOARD
Before you begin:
1. Think about why you want to make a web page….
There are several reasons for a teacher to make a web page
a) Information on class
b) Lesson
c) Internet Scavenger Hunt
d) Student teaching project (ThinkQuest)
2. What makes a good web page…….
- Simplicity
Study the site design of any large corporation. Scrolling text and
gif animations are used conservatively or not at all. Too much repetitive
movement is distracting and sometimes annoying. Try to keep scrolling
text and gif animations to a minimum.
- Consistency
Use one design throughout your site. Remember that to a visitor, your
site is a physical place. It is confusing if pages within a site are
not consistent in design. Color is sometimes used to identify different
sections of a web site but the design and navigation should remain
consistent throughout the site. Choice of fonts is also part of the
design. Be consistent in your use of fonts. Choose fonts
that are compatible to all computers. Use the same color scheme for
fonts and the same font type. You can emphasize areas on the page
and thus guide the movement of the eye through the page through the
use of different sizes of font, not different types of font.
- Identity
Keeping with the concept that a web site is a physical place, consider
the purpose of your site and reflect that purpose in the design.
- Content
Have you ever taken the time to hunt down a web site, waited for the
page to load, and then not found the information you needed on the
site? A visitor is usually not only irritated by this but also inclined
to never return. Make sure that as much information as possible is
made available on your web site. There is yet a site that had too
much information. But on the other hand don’t have too much
writing.
- Visual Appeal
Visual appeal at first seems to be a hard quality to define. Certainly
part of visual appeal involves personal preference but another part
is reflected in adherence to the qualities of simplicity and consistency.
Visual appeal is also dependent upon the quality of graphics used
in a site design. Spend some time visiting sites that you think are
appealing. Notice the graphics on corporate and designer sites.
3. Study some sites…….
The following sites can lead you to some interesting educational
sites.
http://myschoolonline.com
http://web66.coled.umn.edu/schools.html
http://www.esc05.k12.tx.us/tiftech/docs/projectmenu.html
http://www.esc05.k12.tx.us/
Links to School District Web Pages
4. Using a web mapping software, like Inspiration,
brainstorm the topics that you will put on your web site. When you
can't think of any more topics, take time to organize the topics
into categories. These categories will become the navigational scheme
of your web site.
Example site map
TOP OF PAGE
Web Content and Usability
The Alertbox: Current Issues
in Web Usability (http://www.useit.com/alertbox/)
Another great site from Jakob Nielsen. Here is a list of articles
concerning web design.
How Users Read
on the Web - Jakob Nielsen (http://www.useit.com/alertbox/9710a.html)
People rarely read web pages word by word; instead, they scan the
page, picking out individual words and sentences. In a recent study
John Morkes and Jakob Nielsen found that 79 percent of test users
always scanned any new page they came across; only 16 percent read
word-by-word.
Technology Tips and Tricks - Videos
Ten Steps
to Developing Your Web Site(http://realaudio.rice.edu/ecot/web/10steps.ram)
Overview of steps to creating your web site.
TOP OF PAGE
NAVIGATIONAL SCHEMES
In designing the navigational structure of a site, you want to keep
the following user's questions in mind at all times:
- What is here for me?
- How do I find what I am looking for?
- How does all this information relate to me?
It is your responsibility to answer these questions and to point
them in the right directions from the start.
All of the elements of web page functionality apply to navigation
as well.
- Links, at least some of them, should be placed in close proximity
to the concept they relate to.
- The style of navigation should be repeated throughout
the page and consistently throughout the site so
that the viewer can always find their way around.
Three Navigational Schemes:
- Global Navigation - Allows the user to move between
the main sections of the site. It should be present on every page.
For example, the client's logo should always link to the home page.
- Parallel Navigation - Within each section, there
are usually subsections that require a consistent navigational structure.
Because you are moving in a parallel manner within a section, this
is called parallel navigation. It should be present on every page
within a section.
- Local Navigation - This works like a table of contents.
You use it to find information within a page. It may look like a table
of contents or a list of links on a sidebar.
- Most websites use a table of contents in the home page. This home
page usually lists the major divisions of the project, just as a table
of contents lists the chapters of a book. Each campus site has a link
back to the main site as well as buttons across the top that will
link to other pages for that campus.
- Equally important is an overall directory or site map
of the entire web site. This directory makes available not only al
the main sections but all the subsections. The LCM page has buttons
down the left hand side that accomplish that task.
TOP OF PAGE
|