ACCESS TO CVU

WEBSITE DESIGN

Duncan Wardwell (duncan@cvuhs.org)

Did you hear that we're using code words!

DESIGN REVIEW
WEB ELEMENTS SPIN THESE THOUGHTS
LINKS Relate purpose of web to types of links.
AUDIENCE Identify structures of web designed to attract specific audiences.
MESSAGE Say it loud, proud, and simple with tables, bullets, and formats.
STATIC CONTENT Which pages will remain the same?
DYNAMIC CONTENT Which pages will change or need updating?
MAINTENANCE Let's K.I.S.S. and decide what really works.
  1.     Create an index page that provides a gateway to the other static and dynamic content in your website.
  2.     Inset hyperlinks to create the roads between pages of your website and outside sources.
  3.     Post pictures in thumbnail galleries to provide quick viewing and links to high quality pictures.
  4.     Generate a good navigation structure on your index and other pages.  Do it quickly by using software templates in Publisher, PowerPoint, or CoffeeCup Sofware (http://www.coffeecup.com/freestuff/templates/).  Or do it manually with tables and hyperlinks.

POST YOUR SITE ON THE WEB

    Don't get too complicated before you post your website to allow you and other controlled users to analyze its intended effectiveness.

   You need to register for a DOMAIN NAME and choose a WEB SERVER.  Check out:
http://www.findmyhosting.com/
http://www.networksolutions.com/
http://smallbusiness.yahoo.com/domains/
http://www.godaddy.com/
 

CAN YOU CRACK THIS DYNAMIC CODE?

You can borrow the structure and code of basic websites by viewing and then File>Save As to a folder.

Sometimes it is helpful to view and edit your HTML code if things are not working as they should.  The World Wide Web Consortium provides lots of HTML tips & tutorials.

Standards for HTML:  www.w3.org/TR/html4

HTML Tutorial:  www.w3.org/MarkUp/Guide/  

Advanced HTML Guide:  www.w3.org/MarkUp/Guide/Advanced.html

You may also insert dynamic html (.dhtml) and other java script effects by utilzing on-line resources like:

http://www.dynamicdrive.com/dynamicindex14/image4.htm

CSS (Cascading Style Sheets) also offers other ways to layer content that simulates our use of tables.  This often requires an advanced type of software or more expertise with code.  Early on, stick with the less is more model and then test out some advanced features once you feel comfortable.

Image Maps provide hyperlinks within one image.  These often require another piece of software to help set up the linked "hotspots" which generates the html code.  Or with a little practice you can edit the code on your own.  
Check out these links for image maps.:
http://nvu.wikispaces.com/FAQ+image+map
http://www.coffeecup.com/image-mapper
http://www.w3schools.com/js/js_image_maps.asp

Don't forget to frequently post and test before you design too many new options!

 

THANKS FOR JOINING US

Please provide feedback via

http://www.cvuhs.org/access/