Art 128 Interface Programming 1 In-class Presentation Week 2B

:: in-class example VTwelve Design Studio http://www.vtwelvedesign.com

:: in-class lesson Quick review from last class: Setting styles in the header Using external style sheets: Making a new style sheet Linking the style sheet to your html document Controlling the spacing (margins and padding) CSS: selector {property: value;}

:: in-class lesson Setting up your UH personal web site before we set up your account, let’s create some pages to post first. We will create three pages: index.html (your root level UH personal home page) art128/index.html (your Art 128 home page) art128/week2b_linked.html (your 1st in-class assignment)

:: in-class lesson Setting up your UH personal web site (con’t): Set up your sub-folders public_html Art 128 css images Create your root level index.html page Include the following: A header example: “Chris Gargiulo’s UH home page” A link to your Art 128 Home Page example: “Go to my Art 128 Home Page”

:: in-class lesson Setting up your UH personal web site (con’t): 3. Create your Art 128 index.html page Include the following: A header example: “Chris Gargiulo’s Art 128 home page” An assignments section A link to your week 2 linked style sheet assignment example: “week 2 linked style sheet assignment” 4. Post your Art 128 linked style sheet page name it: week2b_linked.html

:: in-class exercise Set up your UH personal web site http://www.hawaii.edu/personalhp/ https://sunsys.its.hawaii.edu/acctmgmt/ Use an FTP program ftp address: uhunix.its.hawaii.edu programs: PC: Filezilla MAC: Fugu Post your three pages online.

:: homework due next class :: 01.24.06 If you didn’t finish in class, finish setting up your UH personal web site. OPTIONAL: design your UH web site however you wish. Keep your content and presentation separate! How? Use style sheets! Have fun with this – you can do whatever you want (add images, change font, color, etc.) Next week we will learn about DIV elements (generic block-level containers) Until then, check out these links: http://www.w3schools.com/tags/tag_div.asp http://www.htmlhelp.com/reference/html40/block/div.html