Examples of Web Design Techniques used in this Site
If you want to learn how I achieve certain effects, look at the following
pages, and click on "View", then "Page Source" in your browser. Note:
"Page Source" in Netscape is equivalent to "Source" in Internet Explorer.
Links to my column (for more information) are provided where appropriate,
or use this page of links.
- Image Link: Making an image a link. This link is to
a protected directory (which requires a password).
Example - my photo.
- Image Map: An image with several areas defined as links.
Example - the two blocks beside my photo.
How
to Implement
- Cycling Image: Several images which sequently show, each having
a link to another page or web site.
Example - the cycling block below my photo.
How
to Implement
- Mouse-over Image Change: Making an image change when the mouse
is passed over the image - usually used to highlight an image link.
Example - the red image near the bottom of the page.
How to
Implement
- Frames: Dividing the window into several portions (called Frames)
which can be used to retain a menu (without reloading) in one frame while
changing the content in another frame.
Example - the index to pages of links in the
left frame, and the pages of links displayed in the right frame. A top frame
is used to display a title.
How to
Implement
- Forms/Dropdown Boxes: Form tags used to create dropdown boxes
containing several link selections
Example 1 - compacting the display of links in the
index. Example 2 - a similar use but not used in
conjuction with frames.
How to
Implement
- Forms/Submiting Information: Form tags used to create an e-mail
message containing the information which has been entered into the form
fields (boxes or button selection).
Example - a request for information with
required identification of the person making the request.
How to
Implement
- Pop-up Windows: Creating a new window of any size, positioned
where you want it, and with a variety of characteristics.
Example 1 - displaying a small window
containing a graphic or a table - click on any of the links in the left
frame - you can not see the content of this window because the directory is
password protected.
Example 2 - a set of example pop-up
windows.
How to
Implement
- Password Protection:
Example - same as Example 1 under
pop-up windows.
How to
Implement
|