Pages

Wednesday, September 8, 2010

Home Screen of Online Fresh Food Store





Home Screen


The home screen is the main page of the Fresh fruits and vegetables store. It contains links to all product pages and the shopping cart.

Below is the code for the above home screen shot:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="classification" content="" />
<meta name="subject" content="" />
<meta name="copyright" content="copyright(c)" />
<meta name="creator" content="Nishu Chhabra" />
<meta name="author" content="nishu_chhabra1986@hotmail.com" />
<meta name="audience" content="all" />
<meta name="robots" content="index,follow" />
<meta name="revisit-after" content="7 days" />
<meta name="Rating" content="General" />
<meta name="distribution" content="GLOBAL" />
<meta name="language" content="Spanish" />
<link href="_css/screen.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="favicon.ico" />
<script src="_js/language-en.js"></script>
<script src="_js/mycart.js">
</script>

<title>Online Fresh Food Store!</title>
</head>
<body>
<div id="container">
  <div id="header">
    <h1><a href="index.html">Online Fresh Food Store</a></h1>
    <div id="navcontainer">
      <ul>
        <li><a href="index.html">Home</a></li>
        <li><a href="products/fruit.html">Fruits</a></li>
        <li><a href="products/vegetable.html">Vegetables</a></li>
        <li><a href="products/meat.html">Meat</a></li>
        <li><a href="pages/managecart.html">Shopping cart </a></li>
        <li><a href="#">Contact us </a></li>
      </ul>
    </div>
  </div>
  <div id="content">
    <noscript>
    <p>We detected that your browser does not have JavaScript, or it is disabled.
      Our product catalog requires that you have JavaScript enabled to order products.
      <a href="http://www.netscape.com">Netscape</a> and <a href="http://www.microsoft.com/ie">Microsoft</a>
      offer free browsers which support JavaScript. If you are using a JavaScript
      compliant browser and still have problems, make sure you have JavaScript
      enabled in your browser's preferences.</p>
    </noscript>
    <div id="main">
      <div class="mainCenter">
        <h2>Fresh Food Store</h2>
        <p>A New World of Flavour in Every Bite</a>. </p>
      </div>
      <div class="mainLeft">
        <h3>&nbsp; </h3>
        <p><img src="_img/images/grapes.jpg" width="180" height="180" /> </p>
      </div>
      <div class="mainRight">
        <h3></h3>
        <p>This website is an online food store. Here you can buy </p>
        <p>Fresh Fruits and Vegetables<br />
          Meat<br />
          <br />
          The food will be delivered at your door step within 24 hours.</p>
      </div>
      <div class="clear"></div>
      <div class="mainCenterGreen">
        <p><img src="_img/images/tomato.jpg" width="180" height="180" /> <img src="_img/layout/bowl.gif" width="111" height="83" />
        </p>
      </div>
      <div class="clear"></div>
    </div>
    <div id="sideContent"> <img src="_img/layout/logo_s.gif" alt="The World's finest foods" width="150" height="96" />    <p> </p><p></p>
         <div class="sidecontentbox"> <a href="products/fruit.html"><img src="_img/images/feature3_s.jpg" alt="i" width="128" height="100" border="0" /></a>   
      </div>
      <div class="sidecontentbox"> <a href="products/vegetable.html"><img src="_img/images/feature1_s.jpg" alt="Veggies" width="128" height="100" border="0" /></a>
      </div>
      <div class="sidecontentbox"> <a href="products/meat.html"><img src="_img/images/roast_s.jpg" alt="Meat" width="128" height="100" border="0" /></a>   
      </div>
    </div>
    <div class="clear"></div>
  </div>
  <div id="footer">
    <div id="mc"><b class="mis"></b><span class="chunches"></span></div>
  </div>
</div>
</body>
</html>