As we know, HTML files consist purely of text. Nevertheless, many websites contain graphics, background graphics, multimedia elements, java applets, flash animations and more. In HTML, such elements are noted in the form of a reference to a specific data source. Even a link to your own website, or another site, is only executable if you name the link destination. Referencing is required in HTML for all these purposes.

There are also places in complement languages such as style sheets or JavaScript, where other data sources must be referenced.

The rules for referencing always stay the same. The reason for this is the central and universal web address system, which functions independently of the syntax from single operating systems and allows one to exactly specify any web address they desire.

Referencing with complete URIs

You must reference with fully complete URIs if you are not referencing data sources from you own website.

A URI (universal resource identifier) is something like http://www.html.co.uk/ or http://www.html.co.uk/12/defining-colour-in-html.html. Both web addresses are also simultaneously URLs (uniform resource locaters). And then there are also – in order to make the confusion complete – so-called URNs (uniform resource names). The last is conceived for distinctly naming data sources that do exist, yet are not accessible online through any known internet protocol. A URI describes both URLs and URNs, where URIs and URLs are typical web addresses, behind which concrete data is contained. URIs and URLs are also technically the same. However, in standard HTML the talk is of URIs.

Examples of URIs:

http://www.html.co.uk/
http://www.html.co.uk/about
http://www.html.co.uk/category/html-tutorials
http://www.example.com:8000/blah/
http://www.example.org/cgi-bin/search.cgi?expression=referencing

Explanation:

A complete URL consists of an internet protocol designation, for example either http or ftp, followed by a colon. Afterwards – depending on the protocol – additional information concerning the network name can be included. This designation is enclosed within two forward slashes “//”. Most addresses do not include such designations, which is why the two forward slashes simply stand there without any content in between.

The online address for the host’s computer, where the data source is located, follows thereafter. This can either be a domain name or a numerical IP address. The domain name in the above example is html.co.uk. The www before is typical for the internet and web servers can adjust the pre-setting for sub domains. A so-called port number can follow the domain name after a colon. This is always necessary when the data source isn’t reachable over the standard port of the entered protocol, such as http, but instead via another port. Port numbers are seldom used, but it is still good to know about them.

Then the local path designation to the data source follows. Regardless of the operating system – directory paths are always separated with a simple forward slash. It is the task of the server software, located on the computer, to correctly produce the path designation. As a result, you need not worry about what operating system the computer you are accessing is running.

One can access as many files and data sources as desired from the computer. The only requirement is that they are accessible from the protocol entered, such as http. Files are not necessarily the only accessible data. With a “#” followed by a name, one can access a specific destination anchor within a HTML file. We will describe later how to define such destination anchors. URIs can also be the execution of CGI scripts with parameters, like in the above search.cgi?expression=referencing example.

Characters, that aren’t contained within the ASCII table code or have a meaning in URIs (such as the forward slash, colon or percent character), must be masked within an URI. This occurs by entering a “%” with the hexadecimal value for the character.

Take Note:

The descriptions above are directed towards HTML learners and make no claims whatsoever to completeness. The concept of URIs is much more complex than has been presented here. If interested in learning more, you can read here for more information on URIs in a World Wide Web context, or here to learn more about the general syntax of URIs.

Reference to a base URL relatively with absolute path designations

You can opt for this form of referencing if the desired data source is located on the same host computer, and if it is accessible via the current protocol and the standard port. This sounds more complicated than it is. Within the complete URI http://www.html.co.uk/category/html-tutorials, the /category/html-tutorials part is an absolute path designation relative to the base http://www.html.co.uk URI. You can work with such path designations within your own website and domain or sub-domain.

An Example:

/
/index.htm
/index.htm#about us
/background.gif
/presentation.pdf

Explanation:

The first forward slash following the base URI stands for the internet service’s root directory. Typically it is not the same as the actual root directory on the computer or hard drive, from which the data is extracted. With web servers, for example, one can determine which actual directory the web directory should correspond to. Everything can follow after the base URI that we just discussed above.

HTML includes the possibility to enter commentary anywhere you please inside a HTML file. The commentary is then ignored by the web browsers and not shown in the presentation. Commentaries make sense to give internal information regarding the author and date, or to make internal notices next to certain areas of text, or to comment on which HTML tags were used.

An Example:

<h1>Welcome!</h1>

<!– Commentary: the above element is a heading –>

<A lot of text</p>

<!–and that is a multi-lined commentary on the text with <p>…</p>
The last line of commentary –>

Explanation:

Commentaries are entered using the <!– order of characters. Afterwards one can enter as much commentary as they desire. You can also notate HTML elements inside a commentary. Everything in between the introductory character combination and the ending –> combination will be ignored by the browser. However, specially marked commentaries, such as so-called conditional comments, are interpreted by Internet Explorer.

Take Note:

The character combination - - already starts and ends the commentary. When you strongly wish to accentuate a commentary and wish to use special characters as a dividing line, then it is best not to use the minus sign -, and instead to use another character, such as the equal sign = or the star *.

While tinkering with your HTML file you will inevitably experiment with and test many different variants. Sometimes it is helpful to not erase previous solutions with a new solution before testing, and instead save the old solution inside a commentary. This area is then deactivated for the browser, but can also easily be reactivated. Then you don’t have to get upset when you overwrite something that was actually better than what you just replaced it with.

Credits

You should pay attention to the following tips if you wish to produce HTML files for the web.

• Declare yourself responsible as the website producer:
  Make sure to note who produced the website. Users have the right to know who is responsible for producing a website.

• Display the date of production:
  Write the date of production in a suitable place in the text. This is especially important with information that quickly becomes obsolete. For example, a price list for PC hardware that hasn’t been updated for over two years, will quickly reveal its usefulness with a clearly displayed date of production.

• Declare your copyrights:
  Declare your copyrights or clearly state what can and cannot be done with your text. You can hardly forbid the copying of text, but you can stop the further dissemination of your text even with changes made to it. Be sure to also specify your copyrights for all graphics, logos etc.

• Allow for the possibility of feedback:
  You could include your email or a feedback form, for example.

Colours can be defined in many different contexts in HTML, for example:

• File wide background colours
• Font colours for blocks of text
• Background colours in tables

Although all these designations have since been characterised as deprecated by the W3 consortium, which means they should no longer belong to the language standard in the future. The reason is that all of these colours can be defined with the help of style sheets. CSS, not HTML, is now the language for graphics. Nevertheless, it is worth learning how to define these colours in HTML, because although the same functions exist in CSS, the language also has many more possibilities. We will discuss the subject from a CSS viewpoint in a later section.

There are fundamentally two possibilities for defining colour in HTML:

• Choose the desired colour in hexadecimal form through designations of RGB values (RGB= red/green/blue)
• Through the designation of a colour name

If you enter hexadecimal inputs, then you work independently of the browser, and you have the total freedom of choosing from 16.7 million colours.

If you choose to simply the enter the colour name, then you bypass the somewhat complicated method of defining a colour in the hexadecimal mode. However, there are currently only 16 standardised colours. Additional colour names exist, but they are browser dependent.

The hexadecimal entry of colours

If you wish to define colours directly in the hexadecimal mode, then you must select the desired colour from designations for the three base colours, red, green and blue.

An Example:

<body bgcolor= “#808080”> <!– dark grey file background –>
<table bgcolor= “#00C0C0”> <!– blue green table background –>
<hr color= “#CC00CC”> <!– violet divider –>

Explanation:

Every hexadecimal colour definition has six digits and follows the formula: #RRGGBB

First notate a “#”. Six characters then follow and define the colour. The first two define the red value of the colour, the second two define the colour’s green value, and the final two define the colour’s blue value.

Hexadecimal Digits:

0 (corresponds to the decimal 0)
1 (corresponds to the decimal 1)
2 (corresponds to the decimal 2)
3 (corresponds to the decimal 3)
4 (corresponds to the decimal 4)
5 (corresponds to the decimal 5)
6 (corresponds to the decimal 6)
7 (corresponds to the decimal 7)
8 (corresponds to the decimal 8 )
9 (corresponds to the decimal 9)
A (corresponds to the decimal 10)
B (corresponds to the decimal 11)
C (corresponds to the decimal 12)
D (corresponds to the decimal 13)
E (corresponds to the decimal 14)
F (corresponds to the decimal 15)

Therefore, a hexadecimal digit can have 16 different conditions.

Take Note:

There are 16 base colours that can be displayed by every VGA compatible screen

There are also 216 colours, which have developed into the internet’s standard colour palette. We will discuss these colour palettes in greater detail in a separate section.

In order to make defining colours easier, colour selectors also exist.

Names for the basic 16 colours

An Example:

<body bgcolor= “black”> <!– black file background –>
<table bgcolor= “aqua”> <!–light blue table background –>
<hr color= “red”> <!– red divider –>

Enter the desired colour names in the place where colour designations are allowed.
In order to get an overview of the available colours, you can enter the example above. The hexadecimal values, that correspond to colour names, will then be shown.

If you simply type your text into a HTML editor, structure the text with help of HTML elements and then view the entire thing in your web browser, the entered text will typically be displayed correctly. This might sound self apparent – but it isn’t. The HTML file does not include letters and the other characters you entered, but instead only bytes; that is, ones and zeros.

When saving the characters, your HTML editor only needs to use a specific algorithm in order to transform the characters into bytes. The web browser must use this same method to transform the bytes back into characters, in order to correctly recognise all the characters in the HTML document. This method is known as character encryption. It has many different variations, such as for saving Western European, Cyrillic, or Arabic characters. We will address the topic of character encryption more closely in a separate chapter.

Such a character encryption references a translation table, which assigns a number or code to every character that can be entered. For example, in the Latin alphabet, the letter “a” in the Unicode character table has the number 97, “b” is 98, “c” is 99, and so on. The amount of characters in such a table is known as the character set.

Because countless encryptions can be used for HTML files, it is absolutely essential the browser uses the same encryption in which the HTML file was saved. You should then choose an editor where you can choose the type of encryption when saving. The HTML file should also specify which character encryption it uses or at least convey it through the web server in the HTTP answer. If such information is missing, then the HTML file is defective in terms of HTML standards. The web browser should not have to “guess” which character encryption is being used.

Nevertheless, web browsers are especially tolerant in this aspect and typically fall back on their preinstalled encryptions. ISO 8859-1 (Latin-1), the codification for West European countries, will likely be set as the default by your browser. The editor you use will probably also save files in ISO 8859-1, so it seems as if there is no problem. However, it might come to pass that people from Asia, Eastern Europe, or elsewhere with different character encryptions, will visit your website. If these people use their own character encryption to read a HTML file in a different encryption, then the result will be an incoherent and garbled mess.

Therefore, HTML gives you the opportunity to tell the browser which character codification you happen to be using. In the heading, within the so-called meta tag, you can provide information on the character encryption. Providing such information is definitely recommended, because it makes it easier for the browser to decide how the bytes from the HTML file should be transferred into characters. Then it is up to the browser to show the characters in such a way as was intended, to a visitor from Asia, for example.

The prevalent ISO encryptions work with a character set of 256 characters. This has the advantage of always displaying a character with exactly one byte. With such encryptions only 256 different characters can be saved. Nevertheless, the character set of HTML – by which we mean the amount of usable characters, independent of how they are saved – is not limited by the encryption being used. All characters from Unicode can fundamentally be used in a HTML document. Advanced encryption, such as UTF-8, can directly encode all the Unicode characters into bytes.

If you want to enter specific characters into the text, that aren’t included in the character set of the encryption you are using, then you can choose between two possibilities: either use a special numerical notation. Or use so-called labelled characters that HTML makes available for frequently used special characters. You should occupy yourself with the HTML character reference table to find out more about both possibilities.

Masking HTML specific characters

If you happen to use characters in your text that have a certain meaning in HTML, then you have to mask them. The following characters have to be masked as follows:

Replace & with &amp;
Replace < with &lt;
Replace > with &gt;
Replace ” with &quot;

Take Note:

The most dangerous is the left arrow (<). If you don’t mask this character, then you can throw the web browser into a lot of confusion, as it believes it is following a HTML tag. Failing to mask the other characters has much tamer consequences, although it is still recommendable.

If you use a text editor or source text oriented HTML editor to produce HTML files, then you should know and pay attention to the following rules:

• Always first note the fundamental framework of a HTML file in a new file.

• Pay attention to the masking regulations for HTML unique characters, special characters and the entire character set.

• Order line breaks and blank lines in such a way as to provide an optimal overview for the source text. Also make sure that line breaks and new paragraphs aren’t displayed the same way by the web browser, as they are entered into the source text. For line breaks and paragraph breaks to appear in the internet browser, you have to use the corresponding paragraph or line break HTML elements. If for some special reason you wish for everything entered in the source code to be displayed in exactly the same way by the web browser, you may use the HTML element for pre-formatted text.

• Remember that there are no tabs in HTML. A tab entered in the source code will be changed into an empty space by the web browser. Line break characters, tab characters and space characters in HTML make up the so-called white space characters. The browser typically interprets a tab or line break in the HTML source text as an empty space. Multiple consecutive white space characters are ignored and fused together as only one single empty space character. Instead of actually pressing the space bar, you may instead enter the &#160; character combination into the source code to produce an empty space; and do so as many times in a row as desired.

A typical HTML file consists of the following parts:

• The document type declaration (information on which form of HTML is being used)
• Header (Containing the title, for example)
• Body (displayed content, text with headings and references)

The formula:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
<html>
<head>
<title>Site description< /title>
</head>
<body>
</body>
</html>

Explanation:

The first line looks especially confusing for beginners. This somewhat complicated piece of information is a document type declaration. We will describe it in more detail later on.

The HTML file’s entire remaining content is contained within the <html> and </html> tags. The html element is also described as the core element of a HTML file. The introducing tag for the header, <head>, follows the introductory <html> tag. The header information is included in between this tag and the closing </head> tag. The most important header information concerns the title and is marked with <title> and </title> tags. The body text, defined through the <body> and </body> tags, follows below. The file’s actual content, as in what is displayed by the web browser, is notated in the body.

Take Note

If you want to use multiple frames, then the framework in files, where a frameset has been defined, looks different. We will discuss these complexities and advise you only to involve yourself with framesets after becoming more familiar with the basics of HTML.

The fundamental framework of a XHTML file

If you wish to correctly write XHTML, then the fundamental framework looks quite similar. Only the beginning is slightly different.

The formula:

<?xml version=“1.0” ?>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
http://www.w3.org/1999/xhtml>

<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<title>Site description</title>
</head>
<body>
</body>
</html>

Explanation:

The relationship to XML should be defined even before the document type in XHTML files. The first line with the question marks inside the arrows serves to make this distinction. Notate this line just like in the example. It concerns a so-called XML declaration.

A valid document type for XHTML files must be given with the document type declaration.

In the introductory <html> tag, the XML naming space must be given with an attribute named xmlns. Use the information as shown in the example above.

The file is declared as a XHTML using these methods. The following source text is technically only normal HTML, although you still have to pay attention to the differences between standard HTML and XHTML. However, you only need to occupy yourself with these differences after first becoming familiar with standard HTML.

Document Type Declaration

HTML is only one from many in the family of markup languages, although it is the most prominent. HTML itself has a long history and has been developed into many different versions. The document type declaration determines which version and which markup language you are using. A type of reading software, such as a web browser, can then orient itself based on this information.

The rules for HTML have been formulated with the help of SGML, while the rules for XHTML were formulated with help of XML. According to the rules of a SGML or XML based markup language, a HTML or XHTML file is only first valid if it provides a specific document type and then if its source code completely adheres to the document type’s regulations. Every document type declaration comes with document type definitions. These define which elements a HTML document type may include, which elements may be interlocked with other elements, what attributes belong to each element, whether entering this attribute is necessary or not, and so on.

As an HTML novice, you might fail to see the point behind all the attention given to declaring the document type. But it is exactly these document types that precisely define the rules of various languages, and have proved to be a major advance in programming. The concept of files independent from software, that also adhere to rules, is only made viable through document types. Without official rules to fall back on, languages like HTML would quickly fractionalise into various dialects and splits. The same is true with natural languages: without certain grammatical rules, the same written language would eventually diverge in various directions, and be indiscernible from one group to the next. Because software is much less intelligent than humans, and requires much more exact information in order to understand what it is receiving, adhering to rules and standards is all the more important.

An example of document type declaration:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
http://www.w3.org/TR/html4/loose.dtd>

Explanation:

Notate the document type at the beginning of the HTML file before the tag in capitalised letters, as shown above. The exclamation mark follows the first arrow. The information DOCTYPE HTML PUBLIC follows afterwards. This means that the file is referenced to the publicly accessible HTML-DTD type. The information included in quotations marks can be interpreted as such:

W3C is the publisher of DTD. Information such as DTD HTML 4.01 Transitional means that you are using the file in the “HTML” document type, version 4.01 and its transitional variant. The EN indicates the language, in this case English. The piece of information concerns which language will be used to define the elements and attributes, not for the file’s contents.

The document type declaration then includes the web address of the document type definitions. This information is not mandatory. Simply entering:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
is also acceptable. Reading software can use the rules noted in the document type definitions to check the HTML file. However, most of today’s browsers already come equipped with the main document types, so that this isn’t necessary. Because browsers also have to deal with worst language disfigurations imaginable, they also possess the ability to display even mistake ridden HTML pages halfway decently. But with XML document files, it is very common that a parser stops loading the website if rules are broken, and instead only loads an error message. This is already the case with XHTML sites that are completed with the application/xhtml+xml MIME type.

The strict variant for HTML:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
http://www.w3.org/TR/html4/strict.dtd>

Use this entry if you do not wish to use certain elements and attributes that were used in earlier HTML standards, and have since become replaceable. The interlocking regulations for HTML elements in the strict variant are naturally stricter, and structured more cleanly. For example, in this variant one cannot simply notate text in between the <body> and </body> tags. All content must be included in so-called block elements, such as headings, paragraphs, graphs, etc.

The transitional variant for HTML:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>

You can use this entry if you need to use some of the elements or attributes not allowed in the strict variant. The rules for element interlocking are somewhat milder in the transitional variant. One is allowed to include naked text outside of any element in between the <body> and </body> tags. Moreover, this variant is necessary in order to edit links with target attributes, and correct direct framesets, for example.

The variant frameset for HTML:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”
http://www.w3.org/TR/html4/frameset.dtd”>

This entry is envisioned for special HTML files, in which framesets are defined.

Older document type declarations:

It can become reasonable to refer to older HTML versions in some certain instances. However, this should only be done if the technical circumstances demand it. The following older entries are available:

<!DOCTYPE HTML PUBLIC “-//IETF//DTD HTML 2.0//EN”>

Use this document type if you wish to refer to HTML 2.0

<!DOCTYPE HTML PUBLIC “-//IETF//DTD HTML 3.2//EN”>

Use this document type to refer to HTML 3.2.

Some tips for using different document types

If you have become somewhat bewildered through the whole chaos of HTML and XHTML, HTML language variants, XML and document type declarations – you don’t have to be. The clutter has resulted from the large amount of development within the language.

For your first foray into the HTML language, you should only use the first presented fundamental framework as it is notated above. Then learn how to work with additional elements and attributes, as well as style sheets. After becoming a little more familiar with the language, it will make much more sense which document type to choose.

Anyone with extensive HTML experience can easily skip this tutorial. However, novices, and even those who wish to brush up on their basic HTML knowledge, could stand to gain from this section. We will go over and define the various pieces that make up HTML code, including elements, tags, attributes and their uses.

Elements and Tags in HTML

HTML files only consist of text. There are certain characters, all from the regular character supply, for distinguishing parts of the text.

The content of HTML files is placed inside HTML elements.

Here is an Example:

<h1>HTML – the language of the web</h1>

This is how it actually looks:

HTML – the language of the web

Explanation:

The example shows a first order heading. The introducing <h1> tag signals that a first order heading is going to follow. The closing </h1> tag signals the end of the heading. A closing tag begins with a left arrow and a forward slash, like “</”.

Pay Attention to the Following:

With standard HTML, it doesn’t matter if tags are notated in lower- or uppercase. Therefore, <h1> and <H1> mean the same thing in standard HTML. However, in the new HTML variant, XHTML, element names must be written in lowercase. So it is recommendable to always write the element names in lower case, regardless if writing HTML or XHTML.

Another Example:

One line and a manual line break<br>
The next line

Here is what it looks like:

One line and a manual line break

The next line

Explanation:

The <br> at the end of the first line signifies that a manual line break will be entered at that point. (br=break).

Take Note:

If you want to write elements in XHTML correctly, then elements with standalone tags must be notated differently: instead of <br>, they must be notated as <br />. The element name must be written with a closing forward slash. Alternatively, you could also notate the element as <br><br/>, with an introducing and ending tag, but no content. We will go over this more in depth later on in some of our other chapters.

Interlocking Elements

Elements can be interlocked with one another. A hierarchical structure then results from this technique. Complex HTML files contain many interlockings. This is why many experienced HTML programmers talk of structured markup.

An Example:

<h1><i>HTML</i> - the language of the internet</h></p>

Explanation:

The i Element stands for italics. The text between <i> and </i> will be displayed in italics, depending on the font and size of the first order heading.

Attributes in Tags

Introducing and standalone tags can include additional information.

An Example:

<h1 align=“center”>HTML – the language of the web</h></p>

Explanation:

The align=“center” attribute makes it so that text is centred.

There are the following types of attributes present in HTML elements:

• Attributes with value allocation, where only certain values are allowed. Like with <h1 align=“center”>, for example. Here only the values, center, right, left and justify are allowed.
• Attributes with free value allocation, but where a certain type of value or convention is expected. Such as with <style type=“text/css”> (this defines the field for style sheets and MIME types are always constructed as type/type below). Or <table border=“1”> (This defines the pixel strength for a table border and a numerical input value is expected.)
• Attributes with free value allocation without any further conventions, like <p title= “Introduction to HTML”> - an entire text can be entered here if desired.
• Standalone attributes, such as <hr no shade> (a separator with no shade). Although standalone attributes only exist in standard HTML. If you wish to write in XHTML correctly, then you must notate the attribute as <hr noshade=“noshade”>. We will of course discuss more of the differences between XHTML and HTML later on.

Even though standard HTML allows certain attributes to be written without quotation marks, you should not use this option. It lowers the possibility of mistakes when you fundamentally and always place all values allocated to attributes in quotation marks. Either ‘ or “ can be used, it is only important not to use different types with the same value.

The same holds true for element names holds true for attribute: with HMTL it makes no difference whether you write in upper- or lowercase, but in XHTML all attribute names need to be written in lowercase. The difference in a lower or uppercase value can sometimes be important, depending on the type of value.

Next to attributes, that are only present in certain HTML elements, there are also so-called universal attributes that are allowed in nearly every HTML element.

An Example:

<p id=“Introduction”>Text</p></p>

Explanation:

The example defines a paragraph of text with <p> and </p> tags. A universal attribute is notated in the introducing tag, namely, the id attribute. This allows you to give distinct names for single HTML elements throughout the document. We will go over universal elements in more detail in a separate section.

HTML Parser

A HTML parser is understood as software that recognises HTML and transforms it into structured text. Every web browser possesses a HTML parser in order to even understand HTML to begin with. Unfortunately, such parsers are often confronted with HTML coding mistakes in most websites. Usually the mistakes are small and not too tragic, but some websites’ HTML source code so horribly disfigures the rules of HTML that insufficient is not strong enough of a word. Strong parsers, which check exactly how much a website adheres to the rules, should not display such insufficient websites and instead provide an error message. However, such a parser would hardly have any chance on the open market, because it would barely display a single prevalent website. As a result, today’s parsers are all fairly accepting and most simply digest everything. Internet Explorer has taken this loose parser type the furthest. This allows them to proclaim they “command” HTML the best, while many experts feel their practice is only furthering sloppy and mistake ridden HTML coding.

It has become more and more important to adhere to the rules of HTML in the face of increasing complexity resulting from numerous languages, such as HTML together with embedded CSS, Javascript, PHP, etc. We will describe these important rules in more detail in a separate section.

If you want to see for yourself if your HTML website conforms to all the rules, then a so-called validator is a very useful tool. A validator reads an entire site, determines which document type is given for the site, and then strongly checks how well the site adheres to the corresponding rules.

The oldest offered validator comes from WC3: validator.w3.org. There you have the possibility to either upload a file from your computer, or give the validator a web address to check.