Building your web site...

You have a couple of choces...

Revise your existing web site.
Build one from scratch using your own design ideas!
Modeling from layouts and styles you like from existing web sites...
Use templates.

Planning Your Website

Type of site? - What kind of content do you want on your web pages?

News?
Information?
Education/Teaching/Reference?
Galleries?
Products?
Shopping Cart?
Social Networking?

Blogging?
Face Booking

How Big A Screen Size?

Computer monitors are rapidly converging to a wide screen format with an aspect ratio of 16: 9 to 16: 10

A Screen Size template

Screen Size Stats

Pencil Out A Sketch of Your Web Site!

The Golden Ratio/Rule of Thirds

What number is next in this sequence?

0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55...

And, What in the world has that to do with web design?

Fibinacci the Golden Mean and the Rule of thirds (0·61803)

Always Use the Rule of thirds to aid your layout.

A visual collection of very sucessful web sites....

What are the 7 main elements that make a web page useable???

Before you take a peek, write down what you think they are...

Okay you can peek now...

Some home page Layout ideas..
Get out a pencil and some paper and draw your own
Remember, people read web sites! "Of users' first three eye-fixations on a page, only 22% were on graphics; 78% were on text. In general, users were first drawn to headlines, article summaries, and captions." --Jakob Nielson

Color schemes

Use a color wheel to determine complementary colors. Don't make your web page hard to read by putting text over clashing or similar colors.

The color wheel

Before you click the pic below

Turn your sound down!!

(here's a good example of what NOT to do on your web page) There is some good info about color at this web site... Even if it's a bit noisy!

For help in choosing color schemes and readable backgrounds
and using colored text check out this web site http://www.colorsontheweb.com/

Here's a color generator with a lot of information about "seeing" color
http://www.wellstyled.com/tools/

Color Theory and More...

Ever wonder why some color schemes work better than other? Or what colors mean to other cultures?

This link was suggested by Sarah at teachersguild.org Check out these color tips at printerinks.com!

Now... Sketch out your ideas

Now, Sit down with a pen/pencil and paper and sketch out ---block it out--- layout, design elements, colors and links.

Make it simple, the eye is attracted to groupings of 1, 3, 5 ie, odd numbers of elements. Make it clear what the visitor is to do when they open your web page. Don't make them guess, don't make it hard for them to contact you.

Use ideas from other web sites, including your competitors and sites you like. If there is something you don't like list those too.

Collect Stuff for your web page.

Make a file folder called "Web Stuff" in it put a file folders called graphics, bars, photos, backgrounds, buttons, snippets, interfaces, dividers, templates, etc

Include research and articles and links to related web sites. You can find web page templates, graphics, buttons for free or for pay...

Here are some places for you to check out.

If you are having a hard time trying to figure out what your web site content should be, try the following links as suggested by the text book's author Steve Johnson