How to Create page in XHTML

**Rebeccak** · 07-07-2009

A tag always begins with the <and ends with the character>. Between these two characters, it shows the tag name and attributes. Here's how is usually a tag without attributes:

<Tag>

And here's an example of tag with attributes:

<Attribut1 tag = "value" attribut2 = "value">

The tags are only visible to the browser, they are invisible to the visitor. These tags allow the browser to say "here, this is an important" or "the following paragraph is a quote", etc. ... Not used to perform the formatting (for example, say "this text is blue" or "This paragraph will be highlighted in yellow), the CSS are used for that.

You should know that there are two main types of tags:

The tags used together: there is an opening tag and closing tag. They come in this form:
<Tag> Here your text affected by the tag </ tag>

As you can see, it closes an open tag by adding a slash. All text that is between these two tags will be affected by them. If your tag is a tag quotation and would like to quote the text "Here is the text quoted, you use the following code:
<Quote> Here is the text quoted </ quote>

The tags alone: they do not have a closing tag. However, we have seen that the character used to indicate a closing tag is the slash. This rule does not change for tags alone, however, the slash is placed differently:
<Tag />

If you need to place attributes, the tag used as follows:
<Attribut1 tag = "value" attribut2 = "value" />

The space between the slash and the last attribute (or the name of the tag if you do not attribute) to ensure compatibility with old browsers (generally used). It is not mandatory, but it is best to add it.

**Rebeccak** · 07-07-2009

The DOCTYPE (document type)

The browsers do not interpret as XHTML. They can also read HTML, display images, videos, etc ... So that the browser knows what kind of document it should open, it uses what is known of the headers. You see it in the PHP if you want to design a dynamic website: p

Meanwhile, in (X) HTML, there is no access to this type of header. It must specify in which language the code (and its version and / or method) was used to design the webpage. This is called the doctype. Each code to create a web page should begin with this doctype. Here's how it looks like:

Code:

<! DOCTYPE html PUBLIC "- / / W3C / / DTD XHTML 1.0 Strict / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Do not hold it by heart, know only that this line should be the first of your XHTML document. We only learn to code in the "strict", but there are two other versions:

Transitionnal
Frameset

Both versions are in my opinion not to be used educationally as they can make things easier depreciated.

construction of an XHTML

Any page that we should start designing with the doctype followed by the opening tag <html> which will be provided with the required attribute xmlns and xml: lang. Do not worry about that line, just know that it is mandatory, do not learn it by heart.

<Html xmlns = "http://www.w3.org/1999/xhtml" xml: lang = "en">

This tag must be closed. As you can see, there is no slash at the end of the code that I showed you, the tag is closed, therefore using a </ html> (the attributes should not be included in the closing tag) . If we take everything we have done since the beginning, you should find a document like this:

<! 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">

</ Html>

**Rebeccak** · 07-07-2009

The header of the page

The header page contains key information such as page title, or information on the character encoding. It begins with a <head> and ends with the closing of this tag (</ head>). The heading is placed right after the opening of the <html>. Until then, you should have this code:

Code:

<! 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"> 
<Head> 

</ Head> 
</ Html>

It's all well and good, but where does it the title, what should we put in this header?

For the page title, it goes between the <title> and </ title>. If you want to give your page the title Welcome to my web page, you must use this code:

Code:

<! 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"> 
<Head> 
<Title> Welcome to my web page </ title> 
</ Head> 
</ Html>

As you can see, this is not very complicated. Another mandatory, it is the character encoding of your webpage. Simply put, there are different character encodings, and the one we use is ISO-8859-1 (with the notebook at least). In short here is the code to add:

<Meta http-equiv = "content-type" content = "text / html; charset = ISO-8859-1" />

Do not learn this line by heart, it means that your page was saved using encoding ISO-8859-1. This is a tag <meta>. We will see later in the annex to what may well serve this tag, remember at the moment it has many uses. Your code should now look like this:

Code:

<! 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"> 
<Head> 
<Title> Welcome to my web page </ title> 
<Meta http-equiv = "content-type" content = "text / html; charset = ISO-8859-1" /> 
</ Head> 
</ Html>

The title will be displayed in the browser window, everything else is invisible to the user.

**Rebeccak** · 07-07-2009

Body of the page
The body of the document will be the only party (with title) visible by the user, it will be the page itself. The page body is between the <body> and </ body>. It places the body of the page just after the header. Needless to develop this part as we will see what can be put in the body of the document in the next chapter. Here is the template you must have for any web page that you will build later (only the title will change):

Code:

<! 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"> 
<Head> 
<Title> Welcome to my web page </ title> 
<Meta http-equiv = "content-type" content = "text / html; charset = ISO-8859-1" /> 
</ Head> 
<Body> 

</ Body> 
</ Html>

You can save the resulting text file by setting the extension well. "Html" or ". Htm". Once the file is saved, open it. You'll get a blank page with the title Welcome to my webpage.