Skip to content

Web Design

 

 Web Design Resources

Unit 1: HTML and CSS


Lesson 1: [Sept 6 & 10] Topics to be covered include the difference between HTML and CSS, viewing a web page vs. editing a web page, and the concept and structure of an HTML tag.  Over the next few classes we will learn and use the following tags: doctype, head, title, link, body, html, headers, paragraphs, links, lists, images, embedding YouTube videos.


Assignment:  Make a simple HTML page about yourself that uses all of the tags discussed in class (see above for a complete list).

Resources:


Lesson 2: [Sept 10 & 12]  Topics to be covered include the advantages of CSS, how to create and link a CSS file, and several CSS properties.

Assignment:  Convert your simple web page you made last class into a valid HTML5 document, including a doctype, header and body.  Then, create and link your web page to a style sheet and begin experimenting with the CSS properties we learned in class.

Resources:

 


First Project:  Create a four page website to promote an organization that makes a positive difference in the world.  You should have 1 css file that styles the entire website.  One of your pages should be a reference page that gives credit to the sources where you found your images and content.

Example:

Download the Run With Terry example


Lesson 3: Layouts!  In this lesson we’re going to learn about creating column-based layouts with css.

Assignment: Download this broken website and use what you learned about css layouts from class to recreate the following layouts:
site2site1

 

 

 

 

 

Resources:

Lesson 4: Cool CSS Tricks 

Gradient Backgrounds:


gradient backgrounds

 

 

 

 

 

Transparent Divs:

screenshot

 

 

 

 

 

Lesson 5: Javascript and JQuery

Final Project:

Literature Arts Site Description:

LitArts

 

 

 

 

 

Theatre Company Site

TheaCo

No comments yet

Leave a Reply

Note: XHTML is allowed. Your email address will never be published.

Subscribe to this comment feed via RSS