Assignment 1 for Jamesblent
Web Development Assignment Instructions
Web Development Assignment 1: PHP Introduction
Develop an XHTML, PHP driven website that meets the following requirements:
1. Each page should be W3C compliant, CSS compliant, and use strict XHTML. Each page should have the appropriately linked validation images at the bottom of the page that verify compliance.
2. Start with the proper XHTML header lines.
3. Develop an appropriate title, description, and meta tags so that search engines can find the page.
4. Define at least 3 custom CSS classes.
5. Write a 2-paragraph report that explains the advantages and disadvantages of the selected web host.
6. Establish a link to a second page that displays the hosting PHP configuration using PHP info.
7. On a third page, print the 2-paragraph report using PHP.
8. Proper PHP functions should be used to automatically show the last time each page was modified. The date and file time functions are examples.
** See this tutorial for your includes: http://www.w3schools.com/php/php_includes.asp
I would recommend a header, menu, and footer include at the minimum. In other words, do not go through the trouble of having navigation links on every single web page. Instead, code: <?php include 'menu.php'; ?> Then, in your menu.php file, code the navigation links. This allows one file to control navigation for your entire website.
This is what I have thus far however I am getting the following error messages:
“element “header” undefined [XHTML 1.0 Strict]
“element “nav” undefined [XHTML 1.0 Strict]
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="description" content="Yahoo Web Hosting Review and PHP Tutorial"/>
<meta name="keywords" content="Web,Hosting,Yahoo,PHP, configuration, advantages, disadvantages, how to, instructions"/>
<title>Yahoo Web Hosting Reviews and Tutorial</title>
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
</head>
<body>
<div class="container">
<div id="header">
<header>Yahoo Web Hosting Reviews and PHP Tutorial</header>
</div>
<nav>
<a href="../index.html">Home</a> <a href="../PHP.html">PHP</a> <a href="../Reviews.html">Reviews</a></nav>
</div>
<div class="main-content">
<h1>Yahoo Web Hosting</h1>
<p class="definition">Is it a good fit for you?</p>
<h2>PHP Configuration How-To</h2></div>
<div id="footer">
<div class="footer-content">Copyright 2014 Carol Brown. All rights reserved.</div>
</div></body>
</html>
CSS:
#header {
background-color: #000;
border-top-color: #6CF;
border-right-color: #6CF;
border-bottom-color: #6CF;
border-left-color: #6CF;
height: 120px;
width: auto;
margin-top: 5px;
padding-left: 5px;
top: auto;
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
color: #FFF;
font-size: xx-large;
font-weight: bold;
}
.main-content {
text-align: center;
height: 500px;
position: relative;
padding: 100px;
}
.footer-content {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size: 90%;
background-color: #6CF;
padding: 10px;
position: relative;
bottom: 0px;
width: auto;
}
.container {
background-color: #6CF;
margin-right: auto;
margin-left: auto;
height: auto;
color: #000;
}
.content {
position: relative;
margin: 0px;
padding: 0px;
height: 500px;
}
#footer {
background-color: #6CF;
height: 50px;
position: relative;
width: auto;
margin-right: auto;
margin-left: auto;
padding-top: 10px;
padding-bottom: 10px;
bottom: 0px;
}
h1 {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
color: #000;
text-align: center;
background-color: #FFF;
}
#nav {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size: 100%;
font-weight: bolder;
color: #000;
text-align: left;
height: 50px;
padding-top: 5px;
padding-bottom: 5px;
width: auto;
}
Page 1 of 5