Web Authoring
Class Resources
[Class 1]
Online Textbook - 12 Webdesign Hours
File we created in class
( In a NotePad file we typed in this code and then saved our file as index.htm )
<HTML>
<HEAD>
<TITLE> Al's Great Homepage </TITLE>
</HEAD>
<BODY>
<H1> Homepage</H1>
<HR>
This is my <STRONG><EM>first</EM></STRONG> webpage.
</BODY>
</HTML>
Class 1 Files 
index.htmlcontact.html
[Class 2]
Image File for Class
Get Menu Images from AMTRAK website for practice
New Starting File from 2/4/09 class
---CODE for aboutus.html file -----
</HEAD>
<BODY bgcolor="aqua">
<FONT color="red" face="arial" size="7">About Us Page</FONT>
<HR>
This is my <EM><STRONG>first</STRONG></EM> webpage.
</BR>
I live in Lancaster. <A href="http://www.google.com">Take me to google</A>
<BR>
<!-- Start of topmenu -->
<HR>
<CENTER><A href="index.html">Home</A> | <A href="aboutus.html">About</A> | <A href="contact.html">Contact</A></CENTER>
<HR>
<!-- END of topmenu -->
<P>My favorite fruits are:</P>
<OL>
<LI>Apples
<LI>Pears
<LI>Beats
<UL><LI>Tomatos</UL>
<LI>Grapes
</OL>
<IMG src="logo.gif">
index.htmphone-list.htm
[Class 3]
File we created in class the following two files. There was also an image stored in an "images" folder (I don't have a way of creating a folder inside this system) I have attached the two files we created.
class3-index.html
[Class 4]
Forms... HTML code example
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<body>
<form name="form1" method="post" action="nwl/example_form_process_mail.php">
<p>Name
<input type="text" name="textfield">
</p>
<p>Email:
<input type="text" name="textfield">
</p>
<p>Phone number:
<input type="text" name="textfield">
</p>
<p>
<label>
<input type="radio" name="Best contact" value="Phone">
Phone</label>
<br>
<label>
<input type="radio" name="Best contact" value="Email">
Email</label>
</p>
<p>
<input name="Things I Like" type="checkbox" id="Things I Like" value="Cars">
Cars
<input name="ThingsILike" type="checkbox" id="ThingsILike" value="checkbox">
Dogs </p>
<p>
<textarea name="textarea" cols="45" rows="15"></textarea>
</p>
<p><br>
<input type="submit" name="Submit" value="Submit">
<input type="reset" name="Reset" value="Reset">
</p>
</form>
</body>
</html>
----------------------------------------------------
Forms... this page should be saved with a .php format (our example will be named"example_form_process_mail.php" without the quotes of course)
<?php
$recipient = 'test@test.com';
$body = '';
$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .= "From: The Page Header <test@test.com>\r\n";
$subject = 'From: Email Subject Line';
$htmlbody = "<table border='1' bordercolor='#000000' cellpadding='3' cellspacing='0' width='80%'>";
foreach($_POST as $key=>$value) //prints each variable name and value
{
if($key != "submitform")
{
if(is_array($value))
$value = implode("<br />", $value);
$key = ucwords($key); //ucwords capitalizes first letter of each word
$body .= "$key = $value <br />\n";
$htmlbody .= "<tr><td width='20%'><strong> ".$key." </strong></td><td>".$value."</td></tr>
";
}
}
$htmlbody = str_replace("_"," ",$htmlbody);
$body = str_replace("_"," ",$body);
$htmlbody .= "</table>";
mail($recipient,$subject,$htmlbody,$headers); //mails it out
?>
Thank you for submitting your information
<a href="http://www.athinker.com"> Back to Athinker</a>
----------------------
stylesheet
.css
h1{
font-family: Verdana,Arial,sans-serif;
font-size: 14px;
color: #334d55;
}
body{
font-family: Arial,sans-serif;
size: 12px;
color: #333333;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
padding: 0px;
background-color: #FFFFFF;
}
a{
color: #a90533;
text-decoration: underline;
}
a:link{
color: #a90533;
text-decoration: underline;
}
a:visited{
color: #333333;
text-decoration: underline;
}
a:hover{
color: #a90533;
text-decoration: none;
}
----------------------------------------------------
Document Object Model (DOM)
http://www.w3.org/DOM/#what (will open in new browser window)
Comments (0)
You don't have permission to comment on this page.