banner
Welcome to HTML.co.uk, the number one resource for all news, information, and happenings regarding HTML.

Updates: HTML.co.uk has just been relaunched. Subscribe to our RSS Feed to stay on top of HTML news and techniques.
May
12th

Meta Elements Part 5: Forwarding, PICS, and more

Author: Editor | Files under HTML Tutorials
Tags for this article: , ,

This element has become quite commonplace, which is why we are also describing it here in out tutorial. Automatic forwarding of this type is often criticized based on the argument the destination site is unreachable for some visitors. Most browsers support such forwarding, however, depending on the settings, some might ignore it. Likewise, many search engine robots do not follow the forwards either. Another problematic area is the amount of time the web surfer must wait before being forwarded to another site. If the site contains another explanatory instruction along with the forwarding, then the user requires a certain amount of time before they will be forwarded. In many instances without such additional instructions, the waiting time is set to zero, so that the forwarding occurs immediately. This is especially problematic, if the visitor tries to use the back button, as they will still only be catapulted forward. Then the user is stuck at the website.

In practice, automatic forwarding is often used to direct a visitor from the old site of a web project, to the new site. However, in most cases it is more advantageous to use a “real” forwarding with HTTP status codes, although this is only possible with server side technology.

An Example:

<head>
<meta http-equiv= “refresh” content= “5; URL=http://www.html.co.uk/”>
</head>

Explanation:

With <meta http-equiv= “refresh” content= “…”>, you prompt the forwarding to another address. With content= “5, you determine in how many seconds the forwarding should start. So the 5 in the example means that the current site, after it has been loaded, will be displayed for 5 seconds. Afterwards the web surfer is directed to the URL entered in url=…”. Write the entire element, including the somewhat unusual placing of the quotation marks, just like it is written in the example above. Enter your desired display time and forwarding address. With local addresses on the same server you can write absolute or relative paths without entering http:// and the domain. The file name alone suffices for forwarding to files in the same directory. With a waiting time of 0, the forward destination website will be loaded immediately.

Take Note:

Do not assume that these elements will always work. If you have forwarded to a new address, it is best to also include a link on the original site to the new address. That way, users, for whom Meta elements do not work, will also find their way to the new site. Also be sure not to enter a waiting time that is too short. Finally, forwarding via HTTP, instead of using these meta tags, is essentially the optimal method.

Elements for PICS

PICS stands for “Platform for Internet Content Selection”. It concerns a standardised method of describing internet content. The formula exists in order to distinguish adult internet content from the rest. There are so-called PICS labels for this purpose. Web site developers can either voluntarily use PICS labels, or – and this is the more reasonable alternative – they settle on a PICS service that distributes PICS certificates for content.

We will not go into details regarding PICS systems. For more information you may visit the W3 consortium’s page on PICS. Modern browsers can recognise PICS content. Certain software side settings can be undertaken in order to allow the browsers to do so, by parents wishing to oversee their children’s internet surfing, for example. By comparing the PICS label of a site to the current configuration, the browser can then decide whether or not to display a certain site.

An example:

<head>
<meta http-equiv= “PICS-label” content= ‘ (PICS-1.1 “http://www.gcf.org/v2.5″
labels on “2004.14.05T08:15-0500″
until “2005.12.04T23:59-0000″
for “http://w3.org/PICS/Overview.html”
ratings (suds 0.5 density 0 color/hue 1))’>
</head>

Explanation:

Through the meta element http-equiv= “PICS-Label”, you can write a PICS label for a HTML file. The PICS label follows after content. The entire label is placed inside simple quotation marks. The syntax of the PICS label is then included with the parenthesis. Then the necessary information detailing the PICS version and the URI, where the content categorisation is defined, is included therein. The elements on, until and for are all optional. The ratings element is definitely critical, in which the actual content categorisation is written. The categorisation is then again surrounded by parenthesis. The PCS service, that distributes the PICS certificates, must determine what information is entered for the categorisation inside the parenthesis.

Diverse Meta elements

The following Meta elements are various collector pieces. They are often elements, which function with certain web servers or browsers, or are incorporated with editing software. Sometimes they are only the inventions of people who believe their HTML files possess magical powers. Here is a small selection of such meta elements.

<meta name= “generator” content= “MS FrontPage 2000”>
<meta name= “generator” content= “Netscape Composer”>
This element is included by HTML editors, especially WYSIWYG editors, without the knowledge of the author. That way software manufacturers can easily search the web and determine who is using their software.

<meta http-equiv= “set-cookie” content= “cookiename=cookievalue; expires=Sun, 01 Jan 2008 00:00:00 GMT; path=/;”>
Let’s you set cookies.

<meta http-equiv= “cache-control” content= “no-cache”>
Instructions for the browser not to use a cache, but instead load from the original site.

<meta http-equiv= “pragma” content= “no-cache”>
Instructions to the proxy agents not to save the file on a proxy server.


May
12th

Meta Elements: Part 4

Author: Editor | Files under HTML Tutorials
Tags for this article: , , ,

Here we continue our section on Meta elements and the following topics more closely: using Meta elements for preventing your HTML file from being indexed by search engines, defining the file’s encryption, defining the script and style languages and ensuring files are loaded from their original address.

Allow or forbid your file from being searchable and indexed.

Most search engines take the following elements into consideration.

If you offer a HTML file online, but still want to prevent it from being reachable using public search engines, then you can note the necessary instructions for the search engine in the Meta elements. Of course, you can also signal to the search engine that you expressly wish for your site to be indexed and searchable.

An Example:

<head>
<meta name= “robots” content= “noindex”>
</head>

Explanation:

With <meta name= “robots” content= “noindex”> you forbid a search engine from transferring content from your HTML file to a search databank.

The following elements are also additionally possible.

<meta name= “robots” content= “index”>. With this you expressly allow the search engine to transfer content from your HTML file to its search databank.
<meta name= “robots” content= “nofollow”>. With this you forbid the search engine from visiting other files that you link to in your project. In order to forbid this as well, you could write <meta name= “robots” content= “noindex, nofollow”>.
<meta name= “robots” content= “all”>. With this you expressly allow the search engine to visit other files that you link to, and index them accordingly.

Take Note:

For those interested in the controlling of robots, we will dedicate a separate section to the topic later.

Elements for Encryption.

With the help of Meta elements, you can determine what encryption the HTML file uses. This piece of information is especially important for web browsers, because it tells the browser which encryption should be used to transfer the bytes into characters.

An Example:

<head>
<meta http-equiv= “content-type” content= “text/html; charset=ISO-8891-1”>
</head>

Explanation:

The element for the encryption is defined with http-equiv= “content-type”. This verifies that a designation is being made that normally is sent from the web server to the web browser in the HTTP header Content-Type. Then enter the MIME type for content, which is in the form text/html for HTML files. Then the information regarding the encryption follows, separated with a dash, in the formula of charset together with the unique encryption name. In the upper example we give the ISO-8859-1 encryption for West European languages. Encryption values are allowed as they are defined on the following web address: http://www.iana.org/assignments/character-sets.

Take Note:

You might ask why the element for encryption is actually charset. For historical reasons, in many technical standards, including HTTP, the term “Character Set” is used instead of “Encryption”.

Elements for the Default Languages for Scripts and Style Sheets

HTML offers the possibility to directly note formatting and script codes in single elements with the event handler and style attributes. Even if CSS is the usual style language and JavaScript is the usual script language, the HTML standard leaves it open which complementing languages can be noted in these attributes. So that a web browser knows exactly which script language you use, you can specify what languages you use within the HTML file.

An Example:

<head>
<meta http-equiv= “Content-Script-Type” content= “text/javascript”>
<meta http-equiv= “Content-Style-Type” content= “text/css”>
</head>

Explanation:

The elements for the default script language and default style language have a uniform construction. You introduce the information for the preferred script language with <meta http-equiv= “Content-Script-Type”, and the information for the preferred style language with <meta http-equiv= “Content-Style-Type”. With the content attribute you have to enter the MIME Type of the desired language. For example, text/css is for style sheets and text/javascript is for Javascript.

If the elements for the style language are missing and you still use the style attribute, then the browser must assume CSS is the style language. So specifically stating the style language is not usually necessary. The browser behaves differently with script languages and event handler attributes: a browser may strictly not accept Javascript, unless it has been instructed to. The default script language must be given, according to the HTML standard, as soon as you use event handler attributes.

Loading Files from Original Addresses

Any website that is frequently visited online is saved in between a so-called proxy server. That is then a so-called proxy cache. Browsers also save loaded internet websites on the user’s computer. This is termed a browser cache. In many instances the cache storage saves resources and time. There is one disadvantage; namely, the user can likely be shown information that’s no longer up to date, because new data exists on the original site in the meantime. With the help of Meta elements you can force the data not to be loaded from a cache, but instead from the original server. This element is recommended if you frequently change content in your HTML file and load it online.

An Example:

<head>
<meta http-equiv= “expires” content= “0”>
</head>

Explanation:

With <meta http-equiv= “expires” content= “0”>, you ensure the HTML file will always be loaded from the original address.

With content, instead of a 0, you could also enter a specific date or time. Doing so ensures the file will be always be directly loaded from the server after the entered time period. The date and time must be entered in the international format. For example, as content= “Sat, 5 May 2008 12:00:00 GMT”. Mon, Tue, Wed, Thu, Fri, Sat, and Sun are allowed as abbreviations for the day, while Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, and Dec are acceptable abbreviations for the months.

Instead of 0, you could also enter a number. This number then refers to the number of seconds, after which the browser loads a file in its cache from the original address. With content= “43200” you enter a value of 12 hours.


May
9th

Meta Elements: Part 2

Author: Editor | Files under HTML Basics, HTML Tutorials
Tags for this article: , , , ,

This section is a continuation of the previous section on Meta Elements. Here we will go over multilingual Meta elements, Meta element profiles in separate files, and a scheme for Meta elements.

Multilingual Meta Elements

You can notate multiple Meta elements of the same type and only differentiate between them by language. Keywords, or short descriptions, especially, can be written in multiple languages.

Here is an Example:

<head>
<meta name= “keywords” lang= “en-us”content= “vacation, Greece, sunshine”>
<meta name= “keywords” lang= “en” content= “holiday, Greece, sunshine”>
<meta name= “keywords” lang= “fr” content= “vacances, Grèce, soleil”>
</head>

The example shows the same keywords being defined in American English, British English, and French. The attribute lang is used in order to define the language. An abbreviation for the language is allowed as a value, for example, en for English, fr for French, es for Spanish, it for Italian, and so on.

Take Note:

The lang is one of the universal attributes in HTML. If you work in XHTML, then you will have to add the xml universal attribute like so: xml:lang.

A profile for Meta elements in a separate File

You can enter an external profile or formula for Meta elements, which you then follow. It could be a well known public profile, with certain internet addresses as its homepage. But it is also possible to enter your own profile with your own Meta definitions.

An Example:

<head profile= http://example.org/profile.html>
<meta name= “Category” content= “A.1.B.”>
</head>

Explanation:

In order to draw in a profile, you need to notate the profile attribute in the introductory <head> tag. Enter the URI for the profile file as the value. It is not prescribed how exactly this profile should look. Typically, a HTML file is entered that lists and defines the Meta attributes in a table. The W3 consortium would prefer to think of the entered address as a unique global name. In this manner, web browsers or search engines that already recognise the corresponding profile, do not need to read anything, as they already know how the following Meta elements should be interpreted according to the profile.

In this example we define a profile that is saved at the http://example.org/profile.html internet address. We assume that a Meta attribute, with the name category, is defined in this profile. This attribute can be used with <meta name= “category” content= “…”>

Take Note:

You cannot actually outsource the Meta elements themselves, only the scheme the elements follow.

A Schematic for Meta Elements

So that your Meta elements can be automatically processed, the values that notate the content attribute of a Meta element should be written in an established format – assuming of course a fitting format exists. You can enter such a scheme with help of an additional attribute.

An Example:

<head profile= “http://example.org/profile.html”>
<meta name= “Type” scheme= “MIME-Type” content “image/svg+xml”>
</head>

Explanation:

A profile is given, that is loaded onto the http://example.org/profile.html internet address. We assume that an attribute with the name Type exists in the profile. This attribute can be characterised in a Meta element with name= “Type”. The scheme attribute presents the attempt to give the reading software instructions on how values, belonging to the content attribute, should be read. In the example, the scheme= “MIME-Type” attempts to tell the software the value for content is a MIME Type.

Take Note:

This way of linking to a scheme is not strictly defined. The problem, which the scheme instructions should solve, actually arises from the scheme attribute itself. Modern Meta data profiles, such as the Dublin Core, do not only define attributes, but also give descriptions for possible schemata at the same time. We will go over the Dublin Core in more depth in our following section.


May
8th

General Information regarding Meta Elements: Part 1

Author: Editor | Files under HTML Tutorials
Tags for this article: , , ,

You can notate various types of useful information for web servers, web browsers and search engines using Meta elements. Meta elements can include information regarding the file’s author and content. They can also include HTTP orders, such as automatically forwarding to another address, for example.

Meta elements are not designed for personal commentary on the source text of a HTML file. Commentaries already exist for such information.

Since the HTML standard version 4.0, no one writes concrete Meta elements, instead they only define the fundamental construction of a Meta element. The W3 consortium is working on a language entitled Resource Description Framework, for standardising Meta elements. More information regarding the Resource Description Framework is found on the consortium’s website.

Be sure to note a Meta tag in the HTML file’s header for every Meta element. It is no problem whatsoever to notate multiple Meta tags.

Examples:

<head>
<meta name=“author” content=“John Smith”>
<meta http-equiv=“expires” content=“Sat, 01 Dec 2007 00:00:00 GMT”>
</head>

Explanation:

A Meta element exists in a standalone tag named Meta. Every Meta tag has two attributes. The attribute is either the name or http-equiv, while the second is always content. The two attributes produce typical configuration data of the type “attribute=value”. In the above example, the name was given the attribute “author”, while the content was given the value “John Smith”. In the second Meta example, the attribute named expires was given the value Sat, 01 Dec 2007 00:00:00 GMT. However, in the second example the attribute was defined with a http-equiv.

Attributes that are defined with name, are directed primarily towards reading client programmes, as in web browsers, but also towards search engine robots, which scan websites to feed their search engine data base.

On the other hand, attributes that are defined with http-equiv, were originally thought out for web servers. The idea behind it is when the web server receives the request from a web browser to transfer a HTML file, the web server first reads the Meta tags and information defined with http-equiv, before sending the file to the browser. This makes it possible for the file author to influence the communication between the web server and web browser. However, instructions of this type rarely achieve their desired effect, because most web servers do not read the data before sending the file to the browser. So it is then the web browser’s responsibility to interpret Meta instructions, such as the HTTP header.

Take Note:

Unfortunately, many people misuse Meta elements. Because most Meta elements have no apparent effect on the screen and are also involved with search engines, there are many ambitious people who feel they can somehow tweak with the Meta elements to get their site at the top of a search engine’s search results. After website developers used paradoxical and misleading Meta elements, the major search engines decided to no longer give any special attention to Meta elements. They instead place value on content and calculate the relevance of the site in terms of how many foreign sites link to it. Therefore, a homepage will not become successful through misleading Meta elements. A clean homepage includes the reasonable use of Meta elements.

If you work in the XHTML standard, then you must characterise the Meta elements as content less. To do so, notate them in a standalone tag in this form: <meta name=“Attribute” content=“Value” />.

Description, Author, Keywords, and Date

The Meta elements described here are the most prevalent, and they are read by nearly every search engine. Today’s popular search engines even still take them into consideration to a certain degree. The information is still important, especially for internal search programmes that need to rely on the accuracy of Meta elements.

You can notate your authorship, briefly describe the content, specify keywords and the date of publication. The short description, especially, is displayed by many search engines in the search results. It is therefore wise to include these Meta elements in all relevant HTML files and produce them just as carefully as you would the full bodied text to be displayed in the web browser.

An Example:

<head>
<meta name=“description” content=“this description should appear to a user when finding this website as a search result.”>
<meta name=“author” content=“Jim Jones”>
<meta name=“keywords” content=“HTML, meta information, search engines, HTTP protocol”>
< name=“date” content=“2008-5-8”>
</head>

Explanation:

With <meta name=“description” content=“description text”>, you determine the description text.

With <meta name=“author” content=“Author Name”>, you show who the HTML file author is.

With <meta name=“keywords” content=“list of keywords”, you determine the file’s tags or keywords for a search engine. A user, who searches using the same keywords as the ones specified in the Meta element, should have this website appear as a preferred result. Separate the keywords with a comma. A keyword can consist of two separate words or one word. However, entire sentences, or even half sentences, do not belong here, because that is what the descriptive text you notate using the name= “description” is for.

With < name=“date” content=“the date”>, you enter when the file was published. The time entry should follow a specific formula. In this case it begins with the year, 2008, followed by the month, May, and finally the date, the 8th. We have still only scratched the surface of Meta elements, but in the interest of organisation, we have decided to separate the tutorial of Meta elements into multiple parts. The next section follows after this one.