What is HTML?
HTML is similar to a programming language and used to create web pages. It stands for Hyper Text Markup Language.
A single HTML document is called a web page, while a collection of web pages that link to each other is called a website or a web presence.
A link from one page to another was originally called hyperlink. This is what the 'H' and 'T' of 'HTML' refer to.
You write HTML code to describe the content and structure of a web page. The processed result will be displayed in a browser and is called an HTML document. Writing in HTML is similar to writing a text document like an essay and mixing in a little bit of programming code. Below is an image of a simple web page and its corresponding HTML code, so you get an idea what it looks like.
The HTML code (on the left) is processed and displayed by the browser (on the right). Do you already have an idea which parts of the code represent the headline and which parts represent the two paragraphs? (Shows example.org; slightly modified for demonstration purposes)
A browser needs to know the type of content and its meaning to process it and display it with a default styling. This is similar to a text editor application like Microsoft Word or Google Docs, where you can define whether a piece of text is a headline, a paragraph, or an image description to change the appearance of the text. Below is an image that compares text documents and HTML documents.
Text documents are written in Word processors, while HTML documents are written in code editors. The former are saved as .odt, .doc, .docx or .pdf files, the latter as .htm or .html files.
To create an HTML document, you don't click buttons in a word processor application. Instead you are writing HTML code in a code editor. You define the type of each piece of content by wrapping special characters and keywords around it. Such a piece of content is called an HTML element and consists of three parts: an opening tag, the actual content in between, and a closing tag. Below is an image that shows a typical HTML element and its surrounding HTML tags (h1 tags).
Shows an heading element as an exemplary HTML element. The element consists of a <h1> tag (opening tag), the text 'Largest Heading' and the closing tag </h1>.
Some HTML elements only consist of a single tag, a so called self-closing tag. For example the line break element looks like this (more about this in Tags and Elements):
Choosing the correct tags to describe your content does not only influence the default appearance of a web page. There are two further important aspects!
- HTML elements also define a scaffold or structure into which the content can fit. For example, in addition to the main content area, you can create a header navigation, a sidebar, and a footer. You can also set metadata for better search engine rankings.
- It is important that you choose the semantically correct HTML elements. Otherwise the overall experience of your website visitors will be negatively affected. For example, tools like translators or screen readers won't work properly. So, people with limited language skill or with disabilities will have a difficult time using your site.