ryanSmithART.com/courses/2016


week_12


Who looks at letter grades?

talk about "Project B
" (due last week) & GRADES:
A
A- & B+
B
B- & C
"Work In Progress"
"Wasn't turned in on due date"
"Have not seen the project yet?"
C-, D & F
* Student Presentations ( anyone not go yet ? )


- talk about : "Project C" : promotional website (due next week).
- branding, identity, & logo design
- examples:
christhurman.com , studioix.com , whirlpool.com
Student Work:
Neck Basket | Game Boy | ??? | Dream Catcher | "Man-Stache" | STICK





Smooth Scrolling : EXAMPLE

* Source
Also: " floating nav"

[ see Week #11 for code ]



WWW History

what's a favicon?



Things to study for the test/quiz :

File management:
What should you save the first page of your website as?
What's a server?
What's a directory?
What's an IP Address?
What's a DNS?
What's FTP?
In the following URL, what's the domain name, and what's the file name?
http://ryansmithart.com/photos/other/Philly.html

What's the difference between a web browser & a search engine?

HTML:
<html>
<head>
<title> my title </title>
</head>
<body>
stuff
</body>
</html>

Paragraph tags

Line Breaks
Emphasis tags
Strong tags


What's "z-index" ?

Inserting an image
<img src="images/flower.jpg" />

How to create a link
<a href="http://www.npr.org"> NPR News </a>

CSS:
CSS Syntax
p {color:red; font-family: Arial, Helvetica; }

How to Change the color of your links
a:link {text-decoration: underline; color: #000;}
a:visited {text-decoration: underline; color: #000;}
a:hover {text-decoration: none; color: #FFF; background-color:#0F0}
a:active {text-decoration: none; color: #000;}

CSS styles can be applied to:
general page elements, CSS Classes, and specific items (ID values).

How do you code them?
p{color:red; }
.title{font-family:Arial Black; background-color:#CCC; }
#footy{height:20px; position:fixed; bottom:0px; width:100%;}

<span class="title"> This is the title </span>
<p>Red Text</p>
<div id="footy"> Footer </div>

What's the difference?
position:fixed;
&
position:relative;

other web design stuff:

What's a favicon?

What's the hexadecimal code for:
red, green, blue, yellow, magenta, cyan, white, black, light & dark grey



JavaScript / jQuery :


Another jQuery Slideshow

fadeshow1 :


the code :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- optional touchswipe file to enable swipping to navigate slideshow -->
<script type="text/javascript" src="jquery.touchSwipe.min.js"></script>
<script type="text/javascript" src="fadeslideshow.js">
/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Please keep this notice intact
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [550, 425], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["images/11.jpg","http://ryansmithart.com", "_new", "photo, by ryanSmith"],
["images/12.jpg", "http://ryansmithart.com", "_new", "photo, by ryanSmith"],
["images/13.jpg", "http://ryansmithart.com", "_new", "photo, by ryanSmith"],
["images/14.jpg", "http://ryansmithart.com", "_new", "photo, by ryanSmith"] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})
</script>





HOME WORK

FINISH "Project C" before next class
Due dates : April 20 & [fri] April 22