Week #10
DESIGN FOR THE WWW
ART 365
fall 2018
webpage:
ryanSmithArt.com/courses/fall2018/art365
Instax Photo |
socks
| PIXI soap
| Fidget Spinner
**Talk about Grades
- site structure and a wire frame
Class work:
* Branding, identity, & logo design
examples:
- christhurman.com
-
studioix.com
-
whirlpool.com
some review...
CSS positioning & other fun stuff
* Source
Also: "
floating nav"
<!-- **********************CSS goes in the <head> ********************* -->
<style>
*{
margin:0px;
padding:0px;
}
#nav{
padding:10px;
position:fixed;
top:0px;
width:100%;
height:100px;
background-color:#FFF;
}
#home{
padding:10px;
padding-top:150px;
height:250px;
background-color:#FC6;
width:100%
}
#div1{
padding:10px;
padding-top:150px;
height:750px;
background-color:#6FC;
width:100%
}
#div2{
padding:10px;
padding-top:150px;
height:750px;
background-color:#F9C;
width:100%
}
</style>
HTML:
<div id="nav">
<a href='#top'class="smoothScroll">HOME</a>
<a href="#div1" class="smoothScroll">div1</a>
<a href="#div2" class="smoothScroll">div2</a>
</div><!-- END NAV -->
<a name="top"></a>
<div id="home">
Home / 'top'
</div>
<a name="div1"></a>
<div id="div1">
div #1
</div>
<a name="div2"></a>
<div id="div2">
div #2
</div>
JavaScript:
*JavaScript & link to jQuery
Homework :
"project_c"
This week:
- Keep working on the project
- Practice uploading files to your server space