This section discusses some advanced tags, which empowers the author to enhance the web page further.
Meta Tag
The <meta> tag provides some unusual information about the web page. This information includes description and keywords for search engines and refresh rates. The meta tag is placed inside the head tags of an HTML document. This tag has to be closed by putting a backslash (/) at the end of the tag.
Attributes of Meta Tag
Content
Content defines the information to be associated with other attributes like http-equiv or name. It takes up some text as its value.
Example: |
| <meta name=”keywords” content=”HTML, XHTML” /> |
| |
Http-Equiv
Http-equiv connects the content attribute to an HTTP header. It takes up the values- content-type, expires, refresh.
Example: |
| <meta http-equiv=”refresh” content=”5” /> |
| |
Name
Name connects the content attribute to a name. It takes up the values- author, description, keyword, generator, and revised.
Example: |
<meta name=”description” content=” Web based tutorial on HTML” /> |
|
This is a variable |
Note: The reason meta tags used to be so important was because search engines relied on them to build a profile of a web page. |
The following example illustrates a web page using the meta tag:
(This web page is the same registration web page shown in the forms chapter. It just includes the meta tag.)
Example: |
<html> |
| <head> |
<title> My list of jokes </title> |
| <meta name="description" content="Free Web tutorials on HTML, CSS, XML, and XHTML"> |
| </head> |
| <body background ="myimage.jpg" text = “blue”> |
| <h1 align=center> My Registration Page </h1> |
| <form name="registration" action="http://expertrating.com/registration.html"> |
| |
| First name: <input type=text name="realname" /> <br/> |
Last name: <input type=text name="sirname" /> <br/> |
Password: <input type=password name="pass"/> <br/> |
Re-Type Password: <input type=password name="repass"/> |
<h2 align=center>Additional Information </h2> |
| |
SEX<br/> |
<select name="sex"> |
<option value="001"> Male </option> |
<option value="002"> Female </option> |
</select><br/> |
| |
SELECTION OF JOKES<br/> |
<select name=”jokenumber”> |
<optgroup label=”Game jokes”> |
<option value=”001”> Cricket jokes </option> |
<option value=”002”> Golf jokes </option> |
</optgroup> |
| |
<optgroup label=”Other jokes”> |
<option value=”111”> Classic jokes </option> |
<option value=”112”> Short jokes </option> |
</optgroup> |
</select><br/> |
| |
<label for=”moreinfo”> Do you want more information on jokes? </label> |
<input type=checkbox name=”moreinfo” id=”moreinfo” /><br/><br/> |
| |
Enter your comments:<textarea name=”comments” cols=40 rows=3 wrap=soft> |
</textarea><br/><br/> |
| |
<button type=reset> Reset </button><br/> |
<button type=submit>Send This </button> |
</form> |
| |
</body> |
</html> |
| |
This is how the web page looks:
|
