Script Scrap

Exploring the languages in the web of technology

Hyper-Text Markup Language (HTML)

The most common language on the web is HTML. HTML is what web browsers understand best. If you right click any page and click View Source You can see what code the page is written in. It is almost always HTML.

HTML is based on XML and consists of tags and content. A tag is text inside of two angle brackets: <html>. Most tags have a closing tag which is the same except is is proceeded by a / for example: <html></html> Together these two tags and any modifiers on the opening tag create an element.

<p class="wide">This is a paragraph which is probably wide.</p>

As illustrated above each tag can have modifiers. The most common modifiers in newer pages are the id and class attributes they are set equal to a string containing whatever value the programmer wants them to have. for class and id attributes this usually corresponds to some class or id in the CSS page for the document.

HTML tags can be nested. That is, one can be inside of another as many as you like. In most documents the HTML tag has two tags inside it the head tag and the body tag. The head tag contains information about the page for browsers to understand how to display it. The body tag contains the information that is shown to the viewer.

Another kind of tag is a self closing tag. this tag does not have any content only optionally modifiers so it just ends with a / right before the closing caret: <meta http-equiv=\"content-type\" content=\"text/html;charset=utf-8\" />

At the very beginning of your page you need a doctype declaration. for HTML5 it is: <DOCTYPE html> This lets the browser know what kind of document it is and how to render it.

Here is a small sample HTML document:

<DOCTYPE html>
<html>
  <head>
    <title>The title of the page</title>
    <meta http-equiv=\"content-type\" content=\"text/html;charset=utf-8\" />
  </head>
  <body>
    <h1>A heading on the page</h1>
    <p>A Paragraph on the page</h1>
  </body>
</html>

You can copy this into your pages to use as a template to get started.