Upcoming Engineer Logo

HTML: An Introduction To HyperText Language

What is HTML?

HTML (Hypertext Markup Language) is a text-based approach to describing how content contained within an HTML file is structured. This markup tells a web browser how to display text, images, and other forms of multimedia on a webpage.

HTML was first created by Tim Berners-Lee, Robert Cailliau, and others starting in 1989. It stands for Hyper Text Markup Language. Hypertext means that the document contains links that allow the reader to jump to other places in the document or to another document altogether. The latest version is known as HTML5.

Most pages on the Web today were built using either HTML 4.01 or XHTML 1.0. However, in recent years, the W3C (in collaboration with another organization, the WHATWG), has been working on a brand new version of HTML, HTML5. Currently (2011), HTML5 is still a draft specification and is not yet an official standard. However, it is already widely supported by browsers and other web-enabled devices and is the way of the future. Therefore, HTML5 is the primary language taught in this course.

Tim Berners-Lee

You can use any text editor to write the HTML code, such as  Notepad (PC) or TextEdit (Mac).

What Are The Basic Elements Of HTML?

Using HTML, a text file is further marked up with additional text describing how the document should be displayed. To keep the markup separate from the actual content of the HTML file, there is a special, distinguishing HTML syntax that is used. These special components are known as HTML tags. The tags can contain name-value pairs known as attributes, and a piece of content that is enclosed within a tag is referred to as an HTML element.

HTML elements always have opening tags, content in the middle, and closing tags. Attributes can provide additional information about the element and are included in the opening tag. Elements can be described in one of two ways:

1. Block-level elements start on a new line in the document and take up their own space. Examples of these elements include headings and paragraph tags.

2. Inline elements do not start on a new line in the document and only take up the necessary space. These elements usually format the contents of block-level elements. Examples of inline elements include hyperlinks and text format tags.

HTML Basic Elements:

  • A text header, denoted using the <h1>,<h2>,<h2>,<h4>,<h5>,<h6>tags.
  • A paragraph is denoted using the <p> tag.
  • A horizontal ruler is denoted using the <hr>  tag.
  • A link is denoted using the <a> (anchor) tag.
  • A list is denoted using the <ul>  (unordered list), <ol> (ordered list), and <li> (list element) tags.
  • An image denoted using the <img> tag
  • A divider denoted using the <img>  tag
  • A text span, denoted using the <spam> tag

What Are HTML Tags?

Tags are used to mark up the start of an HTML element and they are usually enclosed in angle brackets. An example of a tag is: </h1>

HTML Attributes:

HTML attributes are the modifier of the HTML elements or tags. Simply put, attributes are special words that provide additional information about the elements or attributes.

1. Href Attribute

We use the <a> tag to define a hyperlink. In the <a> tag, the href attribute specifies the URL of the page the link goes to. The href attribute consists of two components: the URL (actual link) and the anchor text or clickable text that appears on the page.

2. Src Attribute:

We use the <img> tag to add an image to an HTML page. The src attribute specifies the image path. We can specify the address of the image inside the double quotes.

3. Height And Width Attribute:

The <img> tag also contains the width and height attributes. As the name suggests, these attributes specify the width and height of the image in pixels).

4. Alt Attribute:

The alt attribute is used with the image <img> tag. It helps us to specify the alternative text in case, the image cannot be displayed on the website. The alt attribute should reflect the image content so that users can understand what the image contains.

5.Style Attribute:

The style attribute helps us set the style, such as font, size, color, etc. of the HTML element.

Is HTML Not Case Sensitive?

HTML, being case-insensitive language, means whether you write a tag or an attribute in lowercase letters or uppercase letters or both, it will be treated as the same. We can also mix the cases in a single tag or attribute name as well. But as already discussed above, XHTML is case-sensitive, and the important thing to remember is that XHTML has a strict rule for writing all elements in lowercase letters.

You Might Also be Interested In Reading, Building Your First AI Application: A Step-by-Step Guide