HTML (Hypertext Markup Language) is the code that is used to structure a web page and its content. For example, the content could be structured within a set of paragraphs, a list of bulleted points, or using images and data tables. As the title suggests, this article will give one a basic understanding of HTML and its functions.
So what is HTML?
HTML is a markup language that defines the structure of one’s content. HTML consists of a series of elements, which one uses to enclose, or wrap, different parts of the content to make it appear a certain way, or act a certain way or image hyperlink to somewhere else.
The main parts of the element are as follows:
- The opening tag: This consists of the name of the element (in this case, p), wrapped in opening and closing angle brackets. This states where the element begins or start to take effect – in this case where the paragraph begins.
- The closing tag: This is the same as the closing tag; except that it includes a forward slash before the element name. This states where the element ends – in this case where the paragraph ends. Failing to add a closing tag is one of the standard beginner errors and can lead to strange results.
- The content: This is the content of the element, which in this case, is just text.
- The element: The opening tag, the closing tag, and the content together comprise the element.
Elements can also have attributes that look like the following:
Attributes contain extra information about the element that one doesn’t want to appear in the actual content. An attribute should always have the following:
- A space between it and the element name (or the previous attribute, if the element already has one or more attributes).
- The attribute name followed by an equal sign.
- The attribute value wrapped by opening and closing quotation marks.
The elements have to open and close correctly so that they are clearly inside or outside one another.
Empty Element: Some elements have no content and are called empty elements. Take the <img> element that already have in HTML page. This contains two attributes, but there is no closing </img> tag and no inner content. This is because an image element doesn’t wrap the content to affect it. Its purpose is to embed an image in the HTML page in the place it appears.
Marking up text:
This section will cover some of the essential HTML elements one will use for marking up the text.
Headings: Heading elements allow one to specify that certain parts of the content are headings – subheadings.
Paragraphs: The <p> element contain paragraphs of text, one will use these frequently when marking up regular text content:
Lists: A lot of the web’s content is lists and HTML has special elements for these. Marking up lists always consists of at least 2 elements. The most common lists types are ordered and ordered lists:
- Unordered lists are for lists where the order of the items doesn’t matter, such as a shopping list. They are wrapped in an <u1> element.
- Ordered lists are lists where the order of the items does matter, such as a recipe. These are wrapped in an <o1> element.
There are many more that go into making a functioning, crawlable, and indexable webpage; however, the HTML elements are basics for every code written and executed.