art466 (design_for_the_WWW_II)

instructor: ryanSmith
home | syllabus | contact | links | student work

Week 3

9:30am - 9:40

1) Save your homework in the 466 directory
2) Upload your homework to Towson's server
3) Test your webpages: http://tiger.towson.edu/~username/466/?????
*4) Make sure there is a link from your homework from last week, to this week's homework (check student work page).

9:45 - 10:30

Share homework


10:30 - 10:045

Ira Glass on Storytelling
http://vimeo.com/24715531


10:45 - 11:00

Talk about Project A



11:00 - 11:30(CSS)

.jpg or .gif or .png

More with CSS:

<!-- comments --> and /* comments */

changing the background with CSS

CSS styles can be applied to general page elements, CSS Classes, and specific items:

img { border: 0px; }
this applies to every image tag in the HTML document

.classy { color: red; }
this applies to a CSS class called classy.
<span class="classy" > Example of a paragraph with classy text </p>

#about { background-color: #ccc; }
This rule applies to just the specific element that has an ID value of about:

<p id="about"> About stuff goes here </p>


11:30 - 11:45 BREAK

11:45 - 12:15

http://www.csszengarden.com/

div tags:
<div id="title"> week 3 </div>
<div id="other"> most of stuff </div>
<div id="scroller">--scrolling div section-----------</div>

CSS:
#title{
background-color:#000;
color:#FFF;
top:0px;
height:50px;
left:0px;
width:100%;
}
#other{
top:70px;
background-color:#FFF;
color:#999;
width:500px;
}
#scroller{
padding-left:10px;
background-color:#000;
color:#FFF;
width:100px;
height:50px;
overflow:scroll;


12:15 - 1:15

Example of good CSS positioning
Here's the CSS code
by Larry Ullman

More CSS Positioning & other fun stuff

by rS


1:15 - 1:20
Talk about Homework


Homework:

Get started on Project A

this week:
-Familiarize yourself with HTML & CSS, start planning the website.
-Pick a client, and design a page.
- You can start coding, or come up with a great design for your website using Adobe Photoshop or Illustrator.