Week #2
4 & 6 Feb.
* Take Attendance *
WWW History
How the Web Works
Uploading to a Server
FUGU (FTP) Free Download
Step by step FUGU instructions (UMBC)
1) Save your homework as
index.html, then save it in a 382 folder in a umbc directory
2) Upload the 382 folder (with your images, and index.html page) to UMBC's server
3) Check to make sure it worked:
http://userpages.umbc.edu/~username/382/index.html
*4) Email me a link to the URL address (now), and if you can't get it uploaded email me your photo, and your HTML code
ryansmithstudent@aol.com
XHTML not HTML
(information from
PHP for the web , by Larry Ullman)
1) all tags are written in lowercase.
Example: <html>
Not: <HTML>
2) Nested tags must be "well formed"
Example:
<div><p> some text </p> </div>
Not: <div><p> some text </div></p>
3) All tag attributes must be quoted.
Example: <table border="0">
Not: <table border=0>
4) All tags must be closed.
Example: <br /> or <img src="image.jpg" />
Not: <br> or <img src=image.jpg>
A valid XHTML document begins with these lines:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
"They tell the web browser what type of document to expect."
"The head of an XHTML page includes the content-type meta tag."
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
UTF-8 is short for 8-bit Unicode Transformation Format
"Unicode is a way of reliably representing
every symbol in in every alphabet"
"The current version supports over 99,000 characters."
Other Meta Tags:
<meta name="Keywords" content="ryan, smith, art, photography, video, baltimore, towson, MICA">
<meta name="description" content="Welcome to the official Ryan Smith Art site. ">
<!-- this is an HTML comment -->
Hexadecimal System (RGB)
This is HTML code:
<body bgcolor="#00FF00">
What is CSS?
CSS Syntax
This is an example of how to put CSS in the head of your html code (don't do it this semester) :
<style type="text/css">
p{ background-color:#FFF; padding: 2em; color:#999; width:500px; }
</style>
Instead, in the head of your html code, put a link to a separate .css file:
<link href="382.css" rel="stylesheet" type="text/css" />
*view page source*
Some Work Time?
Home Work :
Remember you will be introducing yourself to the rest of the class this week.
Please have your HTML page uploaded to a server.
I will be asking you the following questions:
What are you studying? Why are you studying it? What else do you do for fun?
What experience do you have with Interactive Media, Flash, ActionScript, and/or web design?
What do you want to learn this semester?
This is what's due on Monday, 11 Feb. 2013 :
1) Create a separate .css file, and link the .html page from week 1 to your new css code.
-
What you did last week -
What you should have uploaded before next class -
Here's my CSS
2) Be creative, use at least 1 other color aside from black, white, or gray.
Pick appropriate colors, change the size & style
of your fonts.
Do not use the default link colors from now until the end of the semester.