Design 

Plan first, repent less

I am going to tell you that you should sit down and plan out your web site with low-tech pen and paper. But I know exactly what is going to happen: you are not going to listen to me. Because I know that you are too eager to listen to me, I am going to ask that you at least read some of the resources on the list, click on some of the links, and try to contain your excitement. This little guide is to help you out on your first run at a school project site.

[Top]

No web site is perfect

Creating a stellar site is difficult for teachers and students with limited resources, web design experience and time. Design for the audience that you know will come to the site. Who will come to visit your site? In order of importance: students and teachers; parents and school officials; education professionals and researchers; political or funding agencies.

[Top]

Composition of the audience

No individual reads the Web in the same way as another: age, literacy skills, computer experience, culture, hypertext-magnetism--"the itchy clicking finger"--emotional state and expectations will affect how each individual looks at, into and through the Web. There is no metaphor that I can use that will effectively explain how each individual will use the Web. The following are courtesies and comparisons that teachers and students can use as references for simple, clear design which are accompanied by the material and links in the resource list.

[Top]

The surfer has total control

If the surfer does not like it, they will leave and never come back. The surfer shuffles and deals your web pages like a deck of cards. Whether playing rummy or fish, the game rules and the players determine the precedence and order of the cards. To attract and satisfy surfers, create a site that is easy to navigate and duplicate and has a simple and clean design.

Just like the publisher of a deck of cards who can expect that purchasers of their cards will play certain games with their decks, the web designer can anticipate some of the routes that a surfer will take on the site. But a designer can never predict them all just as the card publisher does not know if their decks of cards will be used for poker or crazy-eights. 

[Top]

Create a sturdy framework

Reading on the Web is similar to reading a comic book: frames, borders, fonts and graphic or iconic illustrations of actions and emotions are as effective as words. For younger or reluctant readers their most pleasurable reading experiences come from reading comic strips and books and adults still recognize these reading conventions. 

Look at how text, pictures and images are arranged on the page of a comic book. Frames vary in size; the story, told in images, moves left to right and, occasionally, up and down. Readers have no problem following the lopsided movement of the narration. You do not need to become a fabulous artist and create Marvel quality illustrations for your web pages. Consider using the comic style for the following reasons: 

• Comics are universal: every culture uses them for entertainment;

• Children and teenagers read comics and they view the newspaper model that so many adult designers impose on the Internet with the same condescension that adults turn on comics but;

• You can successfully mix the two styles using headings, borders, shading, images and alternating fonts--and this will satisfy most of the students who want both a fun and slick design; 

• Know your audience.

For ideas on how to use comic conventions on the web, such as layout, font and movement, take a look at Scott McCloud's Understanding Comics.

[Top]

Neatness Counts 

Some print reading conventions will work beautifully on the Web: North American and European readers start reading on the upper-left hand corner of a printed page. As naturally as breathing, every experienced reader will start at the upper left hand corner of every page. Their eyes do not stay there but the eyes always start there. Therefore the upper left hand corner of your screen is the most valuable piece of screen real estate on your web page. Take a look at Microsoft and Amazon: they use screen real estate expertly. Where do they place their logos and site sections? Upper left hand corner of the screen. Do not waste this space. 

Use other writing conventions on the web, such as punctuation marks, as icons and graphics. If you are looking for ways to emphasize information or draw attention, use stylized punctuation marks--without distorting the symbol--and place them on your web pages. The trick is to find universal pictures or icons to indicate your expression or emotion. This is not easy. For example, the exclamation point means "danger" or "look here" whereas the question mark indicates confusion or an offer of help. On the other hand, a period is a divot (or a button, a doughnut hole, a navel, etc.) on the screen: it is not an effective icon. 

[Top]

Provide a one-click escape to the home page on every page of the web site

To facilitate surfer control, provide a one-click escape to the home page on every page of the site. Closing the cover of a book takes you back to the beginning without flipping or floundering. The same principle should apply to web site design: provide a one-click escape to the home page on every page of the web site. Call it "home" rather than some cutesy name that the surfer does not expect. Place it in the same spot on every page so the user can find it easily. 

[Top]

Bland County History Archives.

Kingston: A Window to Our Past.

Building Bridges: It's a little old and has some flaws but it still a good example of collaboration amongst schools, students and generations. *Now offline, as of December, 2001.

[Top]

Content

Design

HTML: Code and Software

Resource List