Understanding HTML attributes

Photo by LUM3N on Unsplash

Understanding HTML attributes

A simplified explanation of HTML attributes

What is HTML?

HTML is an acronym for Hypertext Markup Language. It is quite interesting to know that HTML is NOT a programming language: this is because it only determines the structure of a webpage but doesn't include functionality like other programming languages. An HTML file contains the structure of a webpage. It is stored in a standard text format and contains tags that define the page layout and content of the webpage, including the text, tables, images, and hyperlinks displayed on the webpage. Think of HTML as a house being built from the foundation, with just blocks, cement, sand, and woods. No painting and no furniture. Think of the text format as the layers to the house and tables as the rooms, hyperlinks and the connecting door to each room, etc. This is just creating a mental picture of the HTML structure. To understand an attribute then, we first need to know what an HTML element is.

The HTML Element.

An HTML element is an individual component of the HTML document, it consists of an opening tag, enclosed in an angle bracket also known as a less-than and greater-than sign, the content, and a closing tag consisting of the same angle brackets but with a forward slash input. Written as: <(tagname)> content < (/ tagname)>

The HTML element is a building block or structure of an HTML document. Some examples of a basic element include:

  • Head tag used to contain metadata about a webpage

  • Body tag that defines the body of a webpage

  • Paragraph tag used to define a paragraph in a webpage

  • Image tag used to embed an image in a webpage

    • Unordered list to create a bulleted list in a webpage

  • Divider tag used to create a section in a webpage

HTML Attributes:

Html attributes are additional characters given to an element; an attachment of some sort to give additional properties to an HTML element. Attributes are written in name/value pairs like: name="value"

It is important to note that attributes are always included in the start tag of an element. Some basic examples of an attribute :

  1. Href is used in the Anchor tag for inputting links to a document <a href="hashnode.com.
    a is the anchor tag, href is the name, hashnode.com is the value.
  2. Source attribute is used to specify size and used in the image tag written as img src="value".

Below is an alphabetical list of some attributes often used in HTML:

Attribute Description
- alt Specifies an alternative text for an image
- href Specifies the URL (web address) for a link
- id Specifies a unique id for an element
- src Specifies the URL (web address) for an image
- style Specifies an inline CSS style for an element
- title Specifies extra information about an element (displayed as a tooltip)

Hope you found this valuable, thanks for reading.

Resources - fileinfo.com/extension/html - w3schools.com