HTML just happens

HTML just happens


Minmally mark regions of a document for an alternate view of it, while keeping its plain and simple view. One document, two views, compatible with any computer system and without need of special software.

Hypertext Markup Language is simply a means for creating hypertext in addition to the basic markup for plain text. Hypertext is when various contents (f.e. texts) reference each other and each are instantaneously ("hyperly") retrievable from the point of reference. The destination and the point of reference are each an "anchor". The destination anchor is within the same document or within another document.

In other words, the term "hypertext" refers to the interconnectedness of the various parts of the document or with other documents. The term "markup" means it can be added as easily as typing. The term "language" simply means it can be interpreted somewhat consistently.

# requirements

Typically, the only requirements for a document to be interpreted as HTML is having an ".html" extension on its filename and using it with an HTML viewer, f.e. a web browser. The suffix is an artificial requirement usually insisted upon by the computer program or some operating systems.

Every computer since before the turn of the century (pre-2001) has had a basic text editor and an HTML viewer, straight out of the box, no extra costs. An HTML document is plain text, as plain as the keys on the keyboard, and can be typed and viewed without a website or a webserver.

Essentially, HTML documents are backwards-compatible, forwards-compatible, and cross-platform compatible with any operating system on any computer.

Start typing something, and then mark it up when helpful. Perhaps indicate the beginning of a new paragraph, or markup a numbered list or an unordered list. Maybe mark some text as a heading for a section. Or nothing at all, just leave it unmarked.

# basic markup

Marked regions of a document will be shaped with pre-defined spacing and drawn with pre-defined line thickness. Therefore, the whole point of markup is to mark regions of the document when helpful, such as a paragraph or a list.

For example, a paragraph is commonly drawn with margins before and after it, and each list item of a list is commonly drawn with indentation. Handwriting is sometimes drawn with thicker lines or slanted, characteristics commonly known as bold or italic, and regions can be marked with HTML to be drawn similarly by a computer.

In other words, an HTML viewer draws lines of various characteristics at various locations, such as text, and places those drawn lines according to the type of regions marked within the document, such as paragraphs.

Marking a document when helpful keeps it readable in a plain text viewer without the need for an HTML viewer. The latter merely provides an alternative for viewing the document.

The markup of HTML is written with the angle brackets < and > encapsulating the name of the markup, just like using parentheses, f.e. <p> for beginning a paragraph region. In that way, the markup is easily identified from the written text, there's no confusion what is text and what is markup. Technically, the names of the markup are case-insensitive, and can be typed as uppercase, lowercase, or a mix. Therefore the SHIFT-lock can be active for easily typing the angle brackets and the name in between.

Perhaps obviously from the aforementioned pre-defined spacing, an HTML viewer ignores extra spaces and blank lines in the document. Any group of text characters inserted by the SPACE bar, the RETURN key or ENTER key, and the TAB key will be reduced to just a single space character in the HTML viewer. Therefore, extra spacing helpful for viewing as plain text can usually remain while still benefiting from the alternate HTML view of the document.

# a paragraph region

Mark the beginning of each paragraph with <p> in order to have an HTML viewer display separated paragraphs of text.

Notably, any spacing characters at the beginning or ending of a paragraph will be ignored completely by an HTML viewer rather than be displayed. Specifically, no indentation will appear from any spaces typed after the beginning <p> mark and before the first word.

Optionally, the ending of a paragraph can be marked with </p>. However, there typically is no need because an HTML viewer will automatically assume a paragraph ends at the mark beginning the next paragraph, or at the mark beginning a heading, or at the mark beginning a list.

Notably, the mark for ending a paragraph works only when there is a mark for beginning that paragraph. In other words, the ending means nothing without declaring a beginning, and that goes for any mark that can have an ending.

# six sizes of headings

There are six sizes of headings, the first is the largest and the sixth is the smallest. The fourth heading is usually the same size as the document text. They are named "h1" to "h6", f.e. <h1>. Headings must have their endings marked, f.e. </h1>.

# a list and its list items

A numbered list is an ordered list, therefore its mark is the abbreviated name "ol", t.i. <ol>. A list with bullets beginning each list item is an unordered list, marked as <ul>.

A list item is marked with the abbreviated name "li", t.i. <li>. A list item is assumed to end at the mark beginning the next list item, or at the mark for the ending of the list itself.

Optionally, the ending of a list item can be marked, but it's very unnecessary. A list itself must have its ending marked, f.e. </ol>, and that is also enough to signal its ending of the final list item.

# thicker lines or slanted lines for text

Sometimes handwritten text iis drawn with thicker lines or slanted lines, whenever it is helpful or more comfortably legible or desired.

Similarly, a computer draws lines thicker for text within a marked region beginning with <b> and ending with </b>, commonly known as "bold". Text is drawn with slanting lines when within a marked region beginning with <i> and ending with <i>, for "italicize".

Of course, their ending marks are required because there is no reliable way for the computer to guess when to stop using thicker or slanting lines.

# an image

An image is referenced with a mark with the abbreviated name "img", and has no ending mark because it is simply removed and replaced with the image itself (when available). The source location of the image is recorded within the mark as a file path, or as a URL address.

<img src="an-image.jpg">
The source of this image is located relative to the document itself, t.i. in the same directory.
<img src="http://example.com/another-image.jpg">
The source of this image is a URL address.

# hypertext markup

A location mark is named "a" for anchor. An anchor is an id for a destination, or it has a hypertext reference to a destination. Technically, an anchor can do both at the same time, but conventionally it's either one or the other.

The difference between being a destination and referencing a destination is declared within the beginning of the anchor mark. An anchor must have an ending mark.

<a id="a-name-for-this-anchor"> optional text or image </a>
The id can be any text without spacing characters. Conventionally, there is nothing between the beginning and ending marks of an anchor as a destination.
<a href="#a-name-for-some-other-anchor"> text or image </a>
A hypertext reference (a link) to some other anchor within the same document, often referred to as a fragment link. The octothorpe "#" indicates the name after it is of an anchor.
<a href="a-document-name.html"> text or image </a>
A hypertext reference (a link) to a document located in the same directory. Conventionally, the document name is for a different document.
<a href="a-document-name.html#a-name-for-an-anchor"> text or image </a>
A hypertext reference (a link) to a document, and then to a specific anchor within that document.

An hypertext reference can link to any document of any type on any computer, therefore it also can be a URL address. The octothorpe "#" indicates an anchor within an HTML document.

# formalities

A document can be described at its very beginning, before any of its content. Many of the special marks for describing a document are without endings because they contain information about the document within the mark, after the name between the < and >. Some of the special marks do have endings, however, the text in between is never shown in the document.

<meta charset="utf-8">
Ensure Unicode characters formatted as UTF-8 are interpreted correctly by the HTML viewer. The <meta> mark has no ending mark, only attributes.
<title>name or subject of document</title>
Declare a title for the document, used as the name of the HTML view for the document. However, it is never shown within the document. The document <title> region requires an ending mark.
<link rel="stylesheet" href="site-stylesheet.html">
Provide the filepath of a CSS stylesheet for declaring the preferred characteristics of the HTML marks. The rel attribute declares the referenced document is a "stylesheet", and the href attribute has the filepath, potentially a URL. The <link> mark has no ending, only attributes.

If desired, an HTML document can be clarified with the optional <head> and <body> marks. The <head> marks the region for describing the document, with special marks exclusively for that pupose as aforementioned. After that, the <body> mark begins the region for the document content. Though, usually an HTML viewer can deduce those regions because all the types of marks that are for describing a document, if any are used, are conventionally placed before the actual content of the document.

Furthermore, an <html> mark can be inserted as the first mark, therefore before the head region, and its ending mark inserted at the very end of the document, therefore after the body region. In that way, the <html> mark is said to mark the whole document. However, it's completely optional because it's already assumed.

Before everything, at the very beginning of the document, even before the <html> mark (if any), there can be the <!DOCTYPE html> mark. There is no ending mark for it. The HTML standard declares a doctype is used only as a hack compensating for HTML viewers that intentionally fail to abide by the HTML standard. In other words, a page might be interpreted differently in some HTML viewers when without it, but will probably look fine anyway because that mark officially has no defined implications.


More in:
hybrid CSS+HTML stylesheet
begin