Jump to content

I Am Exhausted About Html


fisher
 Share

Recommended Posts

Hi , guys I want you to explain me this site http://www.hamidosatellites.nl/. I am realy trying to experience this site how it has been made But some times i wonder.all the categries at the left navigation almost 23 must have a link and it is own page .And if it is so, how many pages does this site contains?I also see,when i click a category (php.path=25).can anyone explain to me plz

Link to comment
Share on other sites

Hiya. It's hard to enumerate the pages, because database driven sites use pagination to generate pages. What this means is that when you enter a search term in a box, there is only one search results page written and it uses the results of a database query to fill that page with results. When you click an item to view it, there is only one product view page that takes the product id and uses that to fetch the info about that product from a database. So, there are as many product view pages as there are products, but it only has to be written once. The information after the '?' is the data used to find the appropriate database information.

Link to comment
Share on other sites

You should know that this wasn't made using just html. That would be suicide. It uses PHP. Check out the tutorial if you're interested.PHP generates things dynamically. That site would have a database holding all those items, and the PHP would display them on the page. Whoever made that page did not type out line after line in just html.When you say 'How many pages does this site contain?', if you only count the links on the side, and the products on the main display, only 2 pages.If you look at the link in the status or address bar, the name of the page is the part before the question mark '?'.index.php?cPath=32 (index.php)The part after the question mark is as chibineku said, information sent to the server to allow it display the correct information from the database.and the other page is..product_info.php?products_id=120 (product_info.php)This is a link for an individual item, and once clicked you see product information (product_info.php) about product number 120 (?products_id=120).Changing that single number changes the product you will be looking at, but the page is actually the same, it just displays different information dynamically.If you are interested in this stuff, learn php and ask some questions on the PHP forum.

Edited by Reiyan
Link to comment
Share on other sites

You should know that this wasn't made using just html. That would be suicide. It uses PHP. Check out the tutorial if you're interested.PHP generates things dynamically. That site would have a database holding all those items, and the PHP would display them on the page. Whoever made that page did not type out line after line in just html.When you say 'How many pages does this site contain?', if you only count the links on the side, and the products on the main display, only 2 pages.If you look at the link in the status or address bar, the name of the page is the part before the question mark '?'.index.php?cPath=32 (index.php)The part after the question mark is as chibineku said, information sent to the server to allow it display the correct information from the database.and the other page is..product_info.php?products_id=120 (product_info.php)This is a link for an individual item, and once clicked you see product information (product_info.php) about product number 120 (?products_id=120).Changing that single number changes the product you will be looking at, but the page is actually the same, it just displays different information dynamically.If you are interested in this stuff, learn php and ask some questions on the PHP forum.
Right,but if u look de documetn type,it is <!-- doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" -->Is that normal?
Link to comment
Share on other sites

Yep. Let me show you my product view page as code, and then the source once it's been decoded by your browser:Before:

<?php session_start(); ?><!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" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>Aromatherapeutics</title><?php include_once("aromajscssinclude.php5");?></head><body onload="prep()">	 <?php include_once("menu.php5"); ?>	 <div id="wrapper">	<div id="container">  <div id="center" class="column">  <?php  include_once("db_include.php5");  doDB();  if($_GET["id"]) {	//make query	$display_sql = "SELECT * FROM aromaProducts1 WHERE id='".$_GET["id"]."'";	$display_res = mysqli_query($mysqli, $display_sql) or die(mysqli_error($mysqli));	if(mysqli_num_rows($display_res) > 0) {	  $info = mysqli_fetch_array($display_res);		$id = $info["id"];		$title = $info["title"];		$imgsrc = $info["imgsrc"];		$imgthumb = $info["imgthumb"];		$price = $info["price"];		$category = $info["category"];		$size = $info["size"];		$shortdesc = $info["shortdesc"];		$longdesc = $info["longdesc"];		$ingredients = $info["ingredients"];		$keywords = $info["keywords"];		echo '		<img src="images/'.$imgsrc.'" alt="'.$title.'"/>		<p class="product"><strong>'.$title.'</strong>		<br />		<br />		<strong>Price: </strong>£'.$price.'		<br />		<br />		<strong>Size: </strong>'.$size.'		<br />		<br />		'.$longdesc.'		<br />		<br />		<strong>Ingredients:</strong> '.$ingredients.'</p>		<br />		<br />		<form method="get" action="do_additem.php5">		<select id="qty" name="qty">		';		for($i=0;$i<10;$i++) {		  echo '<option value="'.$i.'">'.$i.'</option>';		}		echo '</select>		<input type="submit" name="add" id="add" value="Add To Basket"/ >		<input type="hidden" name="productid" id="productid" value="'.$id.'" />		</form>';	}	  } else { echo 'No product selected'; }	echo $search_res;	?>  </div>  <div id="left" class="column"></div>  <div id="right" class="column"></div></div><?php include_once("footer.html"); ?></div></body></html>

After:

<!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" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>Aromatherapeutics</title><script type="text/javascript">function prep() {var CurRaw;var Cur;var CurPage = "/searchresults.php5";CurRaw = CurPage.substr(1);Cur = CurRaw.split(".")[0];if(document.getElementById(Cur)) {var oldNode = document.getElementById(Cur);var newNode = document.createElement("li");newNode.id = "cur";newNode.className = "sub unclick";var innards = oldNode.children;while(innards.length > 0) {newNode.appendChild(innards[0]);}var innardsContent = oldNode.innerHTML;newNode.innerHTML = innardsContent;oldNode.parentNode.replaceChild(newNode, oldNode);}  var getEls = document.getElementById("menu").getElementsByTagName("LI"); var getAgn = getEls; for (var i=0; i<getEls.length; i++) { getEls[i].onclick=function() { for (var x=0; x<getAgn.length; x++) { getAgn[x].className=getAgn[x].className.replace("unclick", ""); getAgn[x].className=getAgn[x].className.replace("click", "unclick"); } if ((this.className.indexOf('unclick'))!=-1) { this.className=this.className.replace("unclick", "");; } else { this.className+=" click"; } } } document.getElementById("search").focus(); }function checkChars(el) {  el.value = el.value.replace(/[^a-zA-Z0-9 -]/g, "");}function checkCharsEmail(email) {  email.value = email.value.replace(/[^a-zA-Z0-9@_.-]/g, "");}function checkCharsUsername(username) {  username.value = username.value.replace(/[^a-zA-Z0-9_.-]/g, "");}function checkCharsMailto(username) {  username.value = username.value.replace(/[<>#~|*{}]/g, "");} </script><link href="aromastyle.css" rel="stylesheet" type="text/css" /><link href="aromaformstyle.css" rel="stylesheet" type="text/css" /><link href="aromafooterstyle.css" rel="stylesheet" type="text/css" />	 </head><body onload="prep()">		  <a href="#center" class="skip">skip to main content</a>  | <a href="#altnav" class="skip">alt nav</a>	 <div id="header">			   <div id="loginbasket"><a href="loginform.php5">login</a> |  <a href="form.php5">register</a> | basket</div>		  <h1>AromaTherapeutics</h1>		  <a href="index.php5"><img src="images/aromalogopng.png" width="239px" height="87px" alt="Aromatica Logo" /></a>	 </div>	 <noscript>* JavaScript / ActiveX content on this page has been disabled by your browser.  Some features will not be available to you.  JavaScript poses no threat to your safety and no information will be stored by it on your computer.  Please enable it for a fuller experience.  If you choose not to enable JavaScript, there is alternative navigation at the bottom of the page. *</noscript><div id="outer"><ul id="menu"><li id="home" class="sub">Home </li><li class="sub ">Products<ul><li class=""><a href="#nogo6">Psoriasis</a></li><li class=""><a href="#nogo7">Excema</a></li><li class=""><a href="#nogo8">Anti-Bacterial</a></li><li class=""><a href="#nogo9">Bespoke Products</a></li></ul></li><li id="custom" class="sub unclick">Custom Products<ul><li class=""><a href="#nogo10">FAQ</a></li><li class=""><a href="#nogo11">First</a></li><li class=""><a href="#nogo12">Repeat Order</a></li></ul></li><li id="myaccount" class="sub unclick">My Account</li><li id="aromatherapy" class="sub unclick">Aromatherapy<ul><li class=""><a href="#nogo10">Origins</a></li><li class=""><a href="#nogo11">Science</a></li><li class=""><a href="#nogo12">Links</a></li></ul></li><li id="contact" class="sub unclick">Contact</li></ul></div><div id="breadcrumb"><div id="bclogin"><form action="searchresults.php5" method="get"><input type="text" maxlength="16" size="10" name="search" id="search" onkeyup="checkCharsMailto(this)" /><input type="submit" value="search"/></form></div><a href="index.php5">Home</a> ><a href="/searchresults.php5">Searchresults</a></div>	 <div id="wrapper">	<div id="container">  <div id="center" class="column">  <ul><li><a href="productview.php5?id=1">		<img src="images/bottlethumb.jpg" alt="Chamomile Skin Cream" /></a>		<a class="productLink" href="productview.php5?id=1&category=psorisis&title=Chamomile Skin Cream">Chamomile Skin Cream</a>		£17.50  350ml  		<br />		<br />Soothing skin cream made with German blue chamomile<br /><br /><form method="get" action="do_additem.php5">		<select id="qty" name="qty">		<option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option></select>		<input type="submit" name="add" id="add" value="Add To Basket"/ >		<input type="hidden" name="productid" id="productid" value="1" />		</form></li></ul>  </div>  <div id="left" class="column"></div>  <div id="right" class="column"></div></div><div id="footer"><ul id="altnav"><li><a href=#>home</a></li> | <li><a href=#>products</a></li> |<li><a href=#>custom products</a></li> |<li><a href=#>aromatherapy</a></li> |<li><a href=#>contact</a></li></ul><a href="http://validator.w3.org/check?uri=referer"><img		src="http://www.w3.org/Icons/valid-xhtml10-blue"		alt="Valid XHTML 1.0 Strict [ - if you ignore the JavaScript! ]" height="31" width="88" /></a>All content, scripts and images © J Scott 2009 |<a href="mailto.php5">Contact the webmaster</a><a href="http://jigsaw.w3.org/css-validator/check/referer">		<img style="border:0;width:88px;height:31px"			src="http://jigsaw.w3.org/css-validator/images/vcss"			alt="Valid CSS!" />	</a></div></div></body></html>

See, beforehand there are loads of <?php ?> scripts. These are evaluated by the browser. include_once finds a file by the name in the bracket and copies its contents into the page. In the second, you can see what the browser makes of my PHP. PHP generally is used to either process information, like database queries, or to generate HTML.

Link to comment
Share on other sites

Yep. Let me show you my product view page as code, and then the source once it's been decoded by your browser:Before:
<?php session_start(); ?><!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" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>Aromatherapeutics</title><?php include_once("aromajscssinclude.php5");?></head><body onload="prep()">	 <?php include_once("menu.php5"); ?>	 <div id="wrapper">	<div id="container">  <div id="center" class="column">  <?php  include_once("db_include.php5");  doDB();  if($_GET["id"]) {	//make query	$display_sql = "SELECT * FROM aromaProducts1 WHERE id='".$_GET["id"]."'";	$display_res = mysqli_query($mysqli, $display_sql) or die(mysqli_error($mysqli));	if(mysqli_num_rows($display_res) > 0) {	  $info = mysqli_fetch_array($display_res);		$id = $info["id"];		$title = $info["title"];		$imgsrc = $info["imgsrc"];		$imgthumb = $info["imgthumb"];		$price = $info["price"];		$category = $info["category"];		$size = $info["size"];		$shortdesc = $info["shortdesc"];		$longdesc = $info["longdesc"];		$ingredients = $info["ingredients"];		$keywords = $info["keywords"];		echo '		<img src="images/'.$imgsrc.'" alt="'.$title.'"/>		<p class="product"><strong>'.$title.'</strong>		<br />		<br />		<strong>Price: </strong>£'.$price.'		<br />		<br />		<strong>Size: </strong>'.$size.'		<br />		<br />		'.$longdesc.'		<br />		<br />		<strong>Ingredients:</strong> '.$ingredients.'</p>		<br />		<br />		<form method="get" action="do_additem.php5">		<select id="qty" name="qty">		';		for($i=0;$i<10;$i++) {		  echo '<option value="'.$i.'">'.$i.'</option>';		}		echo '</select>		<input type="submit" name="add" id="add" value="Add To Basket"/ >		<input type="hidden" name="productid" id="productid" value="'.$id.'" />		</form>';	}	  } else { echo 'No product selected'; }	echo $search_res;	?>  </div>  <div id="left" class="column"></div>  <div id="right" class="column"></div></div><?php include_once("footer.html"); ?></div></body></html>

After:

<!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" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>Aromatherapeutics</title><script type="text/javascript">function prep() {var CurRaw;var Cur;var CurPage = "/searchresults.php5";CurRaw = CurPage.substr(1);Cur = CurRaw.split(".")[0];if(document.getElementById(Cur)) {var oldNode = document.getElementById(Cur);var newNode = document.createElement("li");newNode.id = "cur";newNode.className = "sub unclick";var innards = oldNode.children;while(innards.length > 0) {newNode.appendChild(innards[0]);}var innardsContent = oldNode.innerHTML;newNode.innerHTML = innardsContent;oldNode.parentNode.replaceChild(newNode, oldNode);}  var getEls = document.getElementById("menu").getElementsByTagName("LI"); var getAgn = getEls; for (var i=0; i<getEls.length; i++) { getEls[i].onclick=function() { for (var x=0; x<getAgn.length; x++) { getAgn[x].className=getAgn[x].className.replace("unclick", ""); getAgn[x].className=getAgn[x].className.replace("click", "unclick"); } if ((this.className.indexOf('unclick'))!=-1) { this.className=this.className.replace("unclick", "");; } else { this.className+=" click"; } } } document.getElementById("search").focus(); }function checkChars(el) {  el.value = el.value.replace(/[^a-zA-Z0-9 -]/g, "");}function checkCharsEmail(email) {  email.value = email.value.replace(/[^a-zA-Z0-9@_.-]/g, "");}function checkCharsUsername(username) {  username.value = username.value.replace(/[^a-zA-Z0-9_.-]/g, "");}function checkCharsMailto(username) {  username.value = username.value.replace(/[<>#~|*{}]/g, "");} </script><link href="aromastyle.css" rel="stylesheet" type="text/css" /><link href="aromaformstyle.css" rel="stylesheet" type="text/css" /><link href="aromafooterstyle.css" rel="stylesheet" type="text/css" />	 </head><body onload="prep()">		  <a href="#center" class="skip">skip to main content</a>  | <a href="#altnav" class="skip">alt nav</a>	 <div id="header">			   <div id="loginbasket"><a href="loginform.php5">login</a> |  <a href="form.php5">register</a> | basket</div>		  <h1>AromaTherapeutics</h1>		  <a href="index.php5"><img src="images/aromalogopng.png" width="239px" height="87px" alt="Aromatica Logo" /></a>	 </div>	 <noscript>* JavaScript / ActiveX content on this page has been disabled by your browser.  Some features will not be available to you.  JavaScript poses no threat to your safety and no information will be stored by it on your computer.  Please enable it for a fuller experience.  If you choose not to enable JavaScript, there is alternative navigation at the bottom of the page. *</noscript><div id="outer"><ul id="menu"><li id="home" class="sub">Home </li><li class="sub ">Products<ul><li class=""><a href="#nogo6">Psoriasis</a></li><li class=""><a href="#nogo7">Excema</a></li><li class=""><a href="#nogo8">Anti-Bacterial</a></li><li class=""><a href="#nogo9">Bespoke Products</a></li></ul></li><li id="custom" class="sub unclick">Custom Products<ul><li class=""><a href="#nogo10">FAQ</a></li><li class=""><a href="#nogo11">First</a></li><li class=""><a href="#nogo12">Repeat Order</a></li></ul></li><li id="myaccount" class="sub unclick">My Account</li><li id="aromatherapy" class="sub unclick">Aromatherapy<ul><li class=""><a href="#nogo10">Origins</a></li><li class=""><a href="#nogo11">Science</a></li><li class=""><a href="#nogo12">Links</a></li></ul></li><li id="contact" class="sub unclick">Contact</li></ul></div><div id="breadcrumb"><div id="bclogin"><form action="searchresults.php5" method="get"><input type="text" maxlength="16" size="10" name="search" id="search" onkeyup="checkCharsMailto(this)" /><input type="submit" value="search"/></form></div><a href="index.php5">Home</a> ><a href="/searchresults.php5">Searchresults</a></div>	 <div id="wrapper">	<div id="container">  <div id="center" class="column">  <ul><li><a href="productview.php5?id=1">		<img src="images/bottlethumb.jpg" alt="Chamomile Skin Cream" /></a>		<a class="productLink" href="productview.php5?id=1&category=psorisis&title=Chamomile Skin Cream">Chamomile Skin Cream</a>		£17.50  350ml  		<br />		<br />Soothing skin cream made with German blue chamomile<br /><br /><form method="get" action="do_additem.php5">		<select id="qty" name="qty">		<option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option></select>		<input type="submit" name="add" id="add" value="Add To Basket"/ >		<input type="hidden" name="productid" id="productid" value="1" />		</form></li></ul>  </div>  <div id="left" class="column"></div>  <div id="right" class="column"></div></div><div id="footer"><ul id="altnav"><li><a href=#>home</a></li> | <li><a href=#>products</a></li> |<li><a href=#>custom products</a></li> |<li><a href=#>aromatherapy</a></li> |<li><a href=#>contact</a></li></ul><a href="http://validator.w3.org/check?uri=referer"><img		src="http://www.w3.org/Icons/valid-xhtml10-blue"		alt="Valid XHTML 1.0 Strict [ - if you ignore the JavaScript! ]" height="31" width="88" /></a>All content, scripts and images © J Scott 2009 |<a href="mailto.php5">Contact the webmaster</a><a href="http://jigsaw.w3.org/css-validator/check/referer">		<img style="border:0;width:88px;height:31px"			src="http://jigsaw.w3.org/css-validator/images/vcss"			alt="Valid CSS!" />	</a></div></div></body></html>

See, beforehand there are loads of <?php ?> scripts. These are evaluated by the browser. include_once finds a file by the name in the bracket and copies its contents into the page. In the second, you can see what the browser makes of my PHP. PHP generally is used to either process information, like database queries, or to generate HTML.

To be honest ,you know i am confused whether i follow htm, php or asp.everyday i read a bit of hier and there .anyway wich way is the best to learn these codes? Edited by fisher
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...