The <meta> tag has a wide variety of applications, but is primarily used to include information about a document, such as the creation date, author, or copyright information. The data included in a <meta> tag is useful for servers, web browsers, and search engines but is invisible to the reader. It must always be placed within the <head> of the document.
A document may have any number of <meta> tags. There are two types of <meta> tags, using either the name or http-equiv attribute. In each case, the content attribute is necessary to provide a value (or values) for the named information or function. The examples below show basic <meta> tag syntax. In the following sections, we will look at each type of meta tag and its uses.<META HTTP-EQUIV="name" CONTENT="content"><META NAME="name" CONTENT="content">
The http - equiv Attribute
Information provided by an http-equiv attribute is processed as though it had come from an HTTP response header. HTTP headers contain information the server passes to the browser just before it sends the HTML document. It contains MIME type information and other values that affect the action of the browser. Therefore, the http-equiv attribute provides information that will, depending on the tag description, affect the way the browser handles your document.
There are a large number of predefined http-equiv types available. This section will look at just a few of the most useful.
Meta tags for client-pull
Client-pull refers to the ability of the browser (the client) to automatically request (pull) a new document from the server. The effect for the user is that the page displays, and after a period of time, automatically refreshes with new information or is replaced by an entirely new page. This technique can be used to automatically redirect readers to a new URL (for instance, if an old URL has been retired). Be aware, however, that the W3C strongly discourages the use of this method for automatic forwarding in favor of server side redirects.
If you string documents with client-pull instructions and set very short time intervals, you can create a sort of slide show effect. Client-pull uses the refresh attribute value, first introduced by Netscape. It tells the browser to wait a specified number of seconds (indicated by an integer in the content attribute) and then load a new page. If no page is specified, the browser just reloads the current page. The following example instructs the browser to reload the page after 15 seconds (we can assume there's something fancy happening on the server side that puts updated information in the HTML document):<META HTTP-EQUIV="refresh" CONTENT="15">
To reload a different file, provide the URL for the document within the content attribute as shown below:<META HTTP-EQUIV="refresh" CONTENT="1; URL=http://doc2.html">
Note that there is only a single set of quotation marks around the value for content. Although URLs usually require their own quotation marks, these are omitted within the context of the content attribute.
To create a slide-show effect, add a meta refresh tag in the <head> of each document that points to the next HTML document in the sequence. You can set the time interval to as many seconds as you like; setting it to 0 will trigger the next page as soon as the current page has downloaded. Bear in mind, however, that the actual amount of time the page takes to refresh is dependent on complex factors of file size, server speed, and general web traffic.
In the following example, three files are coded to loop endlessly at five-second intervals.
Document 1.html contains:<META HTTP-EQUIV="refresh" CONTENT="5; URL=2.html">
Document 2.html contains:<META HTTP-EQUIV="refresh" CONTENT="5; URL=3.html">
Document 3.html contains a tag which points back to 1.html :<META HTTP-EQUIV="refresh" CONTENT="5; URL=1.html">
Here are some other uses of the http-equiv attribute:
Indicates the date and time after which the document should be considered expired. Web robots may use this information to delete expired documents from a search engine index. The date and time format (as shown below) follows the date/time standard for HTTP headers (rather than the recommended date/time format for HTML) since the http-equiv attribute is intended to mimic an HTTP header field.
The content-type text/html is automatically added to the HTTP header for HTML documents. This attribute can be extended to include the character set for the document by specifying "text/html; charset=character set identifier".
This causes the browser to load the appropriate character set before displaying the page.
This is part of the HTML 4.01 measures to internationalize the Web.<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=SHIFT_JIS">
This may be used to identify the language in which the document is written. Like the character set extension just mentioned, it is part of the ongoing effort to internationalize the Web. The browser can send a corresponding AcceptLanguage header, which causes the server to choose the document with the appropriate language specified in its <meta> tag. This example tells the browser that the document's natural language is French:
Inserting Meta-Information with the name Attribute
The name attribute is used to insert hidden information about the document that does not correspond to HTTP headers. For example:
You can make up your own <meta> names or use one of the names put forth by search engine and browser companies for standardized use. A few of the accepted and more useful <meta> names are discussed in the following sections.
Meta tags for search engines
The popular search engines Infoseek and AltaVista introduced several <meta> names that aid their search engines in finding pages. Note that not all search engines use meta data, but adding them to your document won't hurt. There is a blurry distinction between name and http-equiv in this case, so most of these meta names also work as http-equiv definitions.
This provides a brief, plain-language description of the contents of your web page, which is particularly useful if your document contains little text, is a frameset, or has extensive scripts at the top of the HTML document. Search engines that recognize the description may display it in the search results page.Some search engines use only the first 20 words of descriptions, so get to the point quickly.
You can supplement the title and description of the document with a list of comma-separated keywords that would be useful in indexing your document.
Identifies the author of the web page.
Identifies the copyright information for the document.
This tag was created as an alternative to the robots.txt file, and both are used to prevent your page from being indexed by search engine "spiders." This tag is not as well supported as the robots.txt file, but some people like to include it anyway.
The content attribute can take the following values: index (the default), (prevents indexing), (prevents the search engine from following links on the page), and none (the same as setting ", "). The advantage of using this attribute instead of the robots.txt file is that it can be applied on a page-by-page basis (whereas robot.txt applies to an entire site if it's located in the root directory).<META NAME="robots" CONTENT=", ">
Other uses of the name attribute include the following:
This provides a method of rating the content of a web page to indicate its appropriateness for children. The four available ratings are general, mature, restricted, and 14 years.
generator (or formatter for FrontPage)
Many HTML authoring tools add an indication of the name and version of the creation tool. This is used by tools vendors to assess market penetration and has little or no value to individual users or page creators.
Web Designing Related Interview Questions
|HTML Interview Questions||HTML 5 Interview Questions|
|Flash Interview Questions||Graphic Design Interview Questions|
|Illustrator Interview Questions||Dreamweaver Interview Questions|
|UI Developer Interview Questions||Dreamweaver CS3 Interview Questions|
|CSS Advanced Interview Questions||Web Developer Guide Interview Questions|
|Log Shipping Interview Questions||Spring Boot Interview Questions|
|UI Designer Interview Questions||Bootstrap 4 Interview Questions|
Web Designing Related Practice Tests
|HTML Practice Tests||HTML 5 Practice Tests|
|Flash Practice Tests||Graphic Design Practice Tests|
|Illustrator Practice Tests||Dreamweaver Practice Tests|
|UI Developer Practice Tests||Dreamweaver CS3 Practice Tests|
|Web Developer Guide Practice Tests||Advanced jQuery Practice Tests|
Web Designing Tutorial
Designing For A Variety Of Browsers
Designing For A Variety Of Displays
Web Design Principles For Print Designers
A Beginners Guide To The Server
Printing From The Web
Structural Html Tags
Adding Images And Other Page Elements
Specifying Color In Html
Cascading Style Sheets
Server Side Includes
Designing Graphics With The Web Palette
Audio On The Web
Video On The Web
Flash And Shockwave
Introduction To Smil
Introduction To Dhtml
Introduction To Xml
Wap And Wml
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.