MAT 125: Web Design 1: Fundamentals : DEMOS

<< .. Go to .. Home .. Exercises .. CLASS DEMOS .. >>

All Demos in Order of Complexity

1. Exercise 1 : Basic HTML & Text Styles

• Demo 1a
• Demo 1b
• Demo 1c
• Demo 1d

2. Exercise 2 : Lists & CSS Styles

• Demo 2a
• Demo 2b
• Demo 2c
• Demo 2d
• Demo 2e

3. Exercise 3 : Images & Graphics

• Demo 3a
• Demo 3b
• Demo 3c
• Demo 3d
• Demo 3e
• Demo 3f

4. Exercise 4 : Linking

• Demo 4a
• Demo 4b
• Demo 4c
• Demo 4d

5. Exercise 5 : Tables

• Demo 5a
• Demo 5b
• Demo 5c
• Demo 5d

6. Exercise 6 : Frames

• Demo 6a
• Demo 6b
• Demo 6c - IFrames

Project One: Midterm Website

• Use Demos 1 - 6
• Simple Table Template

7. Exercise 7 : Forms

• Demo 7a
• Demo 7b
• Demo 7c
• Demo 7d
• A Simple Form

8. Exercise 8 : CSS External Style Sheets

• Demo 8a
• Demo 8b
• Demo 8c
• Demo 8d
• Demo 8e
• Demo 8f

Project Two : Working with CSS

• Use All Demos, But Focus on Ex 8

9. Exercise 9 : Javascripts

• Demo 9
• Popup Window
• Rollover Buttons
• DropDown Menu
• Slideshow
• Slideshow with Captions

Project Three: Final Website

• Use All Demos

Extra Demos

• DIVs
• Lightbox
• Replace H1 tag with an image
• Center a Page in Internet Explorer 8.
• Absolute Positions
• Go Back Javascript Link
• Rounded Corners and Transparent Backgrounds