CIS133: Internet Development Week 2

Agenda  Homework Review  MYSCC  FTP  HTML Code  In-class  Lab / Homework

The “A” labs

Using mySCC Use your desktop credentials

Using mySCC CIS-BPC folder contains Filezilla applications. My_Documents contains the contents of the student H: drive.

Hosting  Need a domain name  Need a tool to allow access to remote server  Provides tools and resources to manage how the site interacts with users and administrators

What to look for in a host  Server Type (Windows/UNIX)  Disk Space  Bandwidth / Month  Accounts  Metrics  IP/HTTPS/FTP  Included Applications

Pick a domain!  acrossthemiddle.com(1301)  akbarcommand.com(1302)  bowlofmarbles.com(1303)  bustthecurve.com(1304)  credass.com(1305)  designporch.com(1306)  druidtemple.com(1307)  fadedhistory.com(1308)  frinkster.com(1309)  fumbledball.com(1310)  galaxyclass.com(1311)  kneescrape.com(1313)  loyalpenguin.com(1314)  nimbledesigns.com(1315)  poorchimp.com(1316)  rancidcheese.com(1317)  reekingonion.com(1318)  rockinggranny.com(1319)  rustednails.com(1320)  sharperthoughts.com(1321)  shouldabeen.com(1322)  slantroute.com(1323)  sometimeswhen.com(1324)  squishybread.com(1325)  swezzer.com(1326)  weekoldbread.com(1327)  wipedmemory.com(1328) keystone-kops.com(1312)

Interacting with a server  Use FTP (File Transfer Protocol)  Send files across the Internet  The computer you are at is the CLIENT  You PUT files on a remote SERVER  You GET files from a remote SERVER Filezilla

Connecting to your domain via FTP  Tool: Filezilla  Host:.com  Username: sccspring  Username: sccspring  Password: SpringScc13 All files need to be in the folder “.com” to be visible on the web

GIF v JPG v PNG GIF  255 Solid colors  Best for logos and cartoons  Control file size by numbers of colors  Allows transparent backgrounds  Allows animations JPG  16M colors  Best for photographs  Control file size by “quality” and size PNG  Handles  Control size by “quality”  Allows transparent backgrounds  Maintains layers

Getting an image  Browse to any web page  Right-Click and image  Select “Save Image as…”  Find a spot on your computer to save it. NOTE: If you do not see “Save Image as…” it might be a flash file or a background image. Some browsers will have a different option that “Save Image as…”

attributes attributes  align=“right|left” Will wrap text around the image  title=“my family vacation” Tool-tip pop-up message  width=“100” height=“100” resize the image, but does not change the filesize

Web Colors

HTML TAGS  More Info  More Info Tag Name attribute Name attribute Value Closing Tag Tag Content

Basic HTML Tables  = Table definition  = Table header  = Table row  = Table data (column) <table><tr> Column 1 in row 1 Column 1 in row 1 Column 2 in row 1 Column 2 in row 1 </tr></table>

Table attribute examples    Title  Title  Label  Label

HTML / CSS  CSS = Cascading Style Sheets <style> body {background-color:#ff0000}; </style><style> body {font-family:arial}; </style>

HTML / CSS inline  This will show green text.  This will show green text.  Cell content  Cell content

Nesting <ol> Items numer 1 Items numer 1 </ol> Opening and closing one tag within another tag Can put inside another

IN-CLASS  Image  Table  CSS  Useful site for content:

LAB #2  Create folder called “ week2” on your assigned domain.  Create THREE pages “index.html”, “index2.html” and “index3.html” and use all of the following tags on each page: SPAN, BLOCKQUOTE, TABLE, TH, TR, TD  The pages need to all link together and look like the image in the PPT.  Upload all the files using FTP to your domain.  Send the “index.html” link to by Jan 6:00pm.

Sample page for homework

Homework #2  For each URL below - write a paragraph on your first impressions. Discuss design, navigation and creditability  URL:  URL:  URL:  Send the 1-2 page.DOC file to to by Jan 6:00pm

Contact  (c)  (w)  Work at Henkel (101 & Scottsdale Rd)  Live in Scottsdale

Web Resources    