The Basics of HTML

What is HTML?

HTML is short for Hyper Text Markup Language which is used to build Web pages and applications. HTML documents are made up of text content and special codes known as tags that tell Web browsers how to display the content. HTML documents are identified by their .html or .htm file extensions.

HTML is platform independent, means Web pages can be viewed on any computer operating system, including Windows, Mac, and Linux.

Historical Back ground

In 1989, Sir Tim Berners-Lee published a memo proposing an Internet based hypertext system which later called HTML. The first publicly available description of HTML was a document "HTML", first mentioned on the Internet by Sir Tim Berners-Lee in late 1991. It describes 18 elements comprising the initial, relatively simple design of HTML. Eleven of these elements still exist in HTML 4.

HTML Tags

HTML consists of text interspersed with special instructions known as tags. Enclosed within the brackets, < >, HTML tags tell a browser how to perform different tasks like to organize and present text, images, and other Web page content. Many tags are written using an opening tag and a closing tag that surround content that appears on the page. While writing HTML tags, upper- or lowercase letters can be used. To make the coding easy to differentiate from other text in the page, tag names can be typed in uppercase.

Rendering HTML

When a browser displays a Web page, it retrieves the HTML file for that page from a server, analyses the HTML tags to determine how the content should be formatted, and renders the page. The HTML tags tell the browser what images, video, audio, and other content need to be downloaded and integrated into the page. The HTML may also tell the browser to download style sheets and interactive scripts to further enhance the page.

HTML Standards and HTML Versions

The World Wide Web Consortium, or W3C, is the primary group guiding the evolution of the HTML language. The standards developed by the W3C give developers of Web servers and browsers a set of common guidelines with which to develop their products. HTML 5 is the most recent version of HTML also known as Living Standard 2022. There are approximately 110 tags in HTML5 including 32 tags  which are newly introduced in HTML5. 

HTML Editors

As HTML documents are plain-text documents, therefor any text-editing program can be used to code HTML and create a Web page. There are also a variety of Web-specific coding environments that will write HTML code, validate it, and upload it to a Web server.

Simple Text Editors

Simple text editors, also called plain-text editors, are easy to find. Microsoft Windows all latest versions come with Notepad, while Apple Mac computers come with Text Edit. Simple text editors offer no-frills word processing and are often the best choice while learning to write HTML.

HTML Editors

There many HTML editors available, such as Adobe Dreamweaver, Microsoft Expression and Visual Studio Code etc, are dedicated programs for writing HTML code and managing Web pages. These programs can shield the user from having to write HTML code by offering a graphical environment for building Web pages as well as a text-based environment. Most HTML editors will also color the HTML tags for easier viewing, validate the code, and helps to upload finished pages to a server.

HTML Syntax

HTML is a language for describing Web page content. HTML rules, or syntax, govern the way in which code is written. In other words, HTML syntax is the arrangement of elements and attributes to create well-shaped document or In HTML, syntax is the purpose of elements and attributes, and the logical relationship (sense and reference) between elements and the attributes of those elements.

Writing HTML Syntax

In HTML, tags determine how page content is organized and formatted. Tags consist of words or abbreviations surrounded by angle brackets, < >. Tags can be written using upper- or lowercase letters. The names of tag can be typed in uppercase to distinguish the code from other text. This HTML code creates a paragraph in the page:

<P>Hello, world! </P>

Tag Structure

Certain structural HTML tags identify different parts of the HTML document. For example, the “<BODY> The Page </BODY>” tags surround the main body content that appears in the browser window. Many tags, such as the paragraph tags (<P> The Paragraph </P>), are written using an opening tag and a closing tag while others, such as the image tag (<IMG>), stand alone. Closing tags must always include a slash (/) before the tag name.                                                              

Attributes and Values

Specific attributes can be assign to each HTML tag to customize its behavior. Most attributes work by setting a numeric or descriptive value. For example, a paragraph’s alignment can be set on the page using the ALIGN attribute along with a type of alignment: left, right, or center. The code for creating a centered paragraph looks like this:

<P ALIGN= “Centre”> This code is used to centered a text. </P>

Attributes always go inside the opening HTML tag, and it is good form to enclose attribute values in quotation marks.

Entities

Special characters can also be added to a page, such as a copyright symbol or a fraction, by using special codes called entities. Entities represent characters not readily available on the keyboard. All entities are preceded by an ampersand (&) and followed by a semicolon (;). For example, the following code adds a copyright symbol to the page: &copy; (display in this form ©)

Avoiding Syntax Errors

To avoid HTML errors, always take the time to proofread the code. Most HTML editors have features that highlight bad or incorrect syntax. Make sure that the tags have brackets, the closing tags include a slash, and the attribute values are surrounded by quotation marks. Multiple HTML tags should be properly nested, means that the closing tags should be in the reverse order of the opening tags. For example:

<P ALIGN= “Centre”><B>The HTML Text. </B></P>

To help make the HTML readable, always use new lines to type code instead of running everything together on one long line. Doing this, will not affect how the page is displayed, because Web browsers ignore extra white space.

Retrieve HTML Documents in a Browser

A Web browser is software that can retrieve HTML documents from the Web, analyze the HTML instructions, and display the resulting Web pages. A simple browser can also be used to display HTML documents that save locally on a computer. When coding the HTML, a Web browser can be used to test the HTML work.

There are many Web browsers in use today, and numerous versions of each interpret HTML essentially the same way.