Content

1 Format of an HTML page

Format of an HTML page

Its essential principle is the use of labels. The labels are reserved words of the language, enclosed in < >

Types of labels

There are three types of tags:

Paired
when a start and end tag appears, the blocks contained between start and close are elements, which in turn may contain other elements
```
<p>A text</p>
```
No match
when the label represents the insertion of an element, these tags end with a forward slash
```
<hr/>
```
With final optional
are the labels paired in the which it is not mandatory to use the end tag

<p>Paragraph who does not have close

The labels can include attributes modifying its behavior, specifying some unique characteristic of the element or including additional information

The attributes are specified as pairs attribute='value', separated by spaces within the home label

Values are not required to be enclosed in quotation marks, but it is recommended

Single or double quotation marks can be used interchangeably, as long as they match their opening and closing

<div id='box'>text</div>

The example has used the id attribute, which is generic for any tag and which will be useful to us when using CSS and Javascript, because it allows us to uniquely distinguish the element to which that particular tag belongs

There are more generic attributes, such as class, title or style, all very useful when we want to format or improve accessibility to our elements

When we introduce a label that does not exist, it will be ignored, we must pay attention to this issue because it makes it difficult to detect errors

The labels can be typed in uppercase or in lowercase

Line breaks and extra white space are not considered. The latter allows you to indent your code to make it more readable

Comments within the HTML

Sometimes it is very useful to write comments in the HTML document about the code we write, they can serve to remind us later what was done, and that we do not want it to be seen on screen

This is achieved by enclosing such comments between these two symbols:

<!-- This is a comment to the code will not be displayed -->

Comments can be used anywhere in the HTML document, but will not be displayed

<html>
    <head>
<!-- Inserted by miarroba -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-T2VG59');</script>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7294310421616689" crossorigin="anonymous"></script>
<!-- Inserted by miarroba -->
        <title>Sample web page</title>
    </head>
    <body>
<!-- Inserted by miarroba -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-T2VG59" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- Inserted by miarroba -->
        <h1><center>List of hobbies</center></h1>
        <!-- Example of three types of lists -->
        <h3><b>hobbies</b> (without a particular order)</h3>
        <ul>
            <li>Film</li>
            <li>Sport</li>
            <li>Swimming</li>
            <li>Music</li>
        </ul>
        <br/><br/>
        <h3><b>Priorities</b> in terms of music <i>(with order)</i></h3>
        <ol>
            <li>Rock</li>
            <li>Jazz</li>
            <li>Classic</li>
        </ol>
        <dl>
            <dt><tt>Rock</tt>
                <dd>Couple dance that is executed with this music</dd>
            </dt>
            <dt><tt>Jazz</tt>
                <dd>Music derived from African-American melodies</dd>
            </dt>
            <dt><tt>Classic</tt>
                <dd>Instrumental music for ensemble</dd>
            </dt>
        </dl>
        <br/><br/>
        <!-- Sample quote -->
        <blockquote>Not much to get up early dawns early</blockquote>
        <br/><br/>
        <!-- Example mathematical formula, the theorem of Thales -->
        a<sup>2</sup>=b<sup>2</sup>+c<sup>2</sup>
        <br/><br/>
        <!-- Example mathematical formula, symbol of water -->
        H<sub>2</sub>O
    </body>
</html>

Special characters

There are certain characters that a browser is not able to recognize in spite of using the correct encoding

Let's imagine that we want to write the text x > y within our HTML, however, the character > will not be recognized by the browser or will show us one wrong

This happens with a set of characters that are special and that the browser will recognize by using the particular label of this character with the following format &label;

In the example above, the label for the > is gt, starting with & and ending with ;

On the following website we can consult the complete list of the 256 universal characters HTML

Cookie	Duration	Description
CookieLawInfoConsent	Until the end of the browser session	Controla la visualización del consentimiento de Cookies, su gestión y visualización en la página web por parte del usuario
qtrans_admin_language	Until the end of the browser session	Permite al administrador gestionar la traducción de la página web a varios idiomas
qtrans_edit_language	Until the end of the browser session	Permite al administrador editar la traducción de la página web a varios idiomas
viewed_cookie_policy	Until the end of the browser session	Controla si la visualización del consentimiento de Cookies es visible actualmente en la página web para el usuario o por el contrario está oculta

Secarcam's Computer Science Web

Format of an Html page

Format of an HTML page

Types of labels

Comments within the HTML

Special characters

Web page of Sergio Cárcamo Garcia dedicated to the computing and related topics such as programming languages, statistics, mathematics, etc

Format of an HTML page

Types of labels

Comments within the HTML

Special characters

Web page of Sergio Cárcamo Garcia dedicated to the computing and related topics such as programming languages, statistics, mathematics, etc

Cookie policy