HTML commands are incredibly numerous. Each special character alone has its own HTML code with which it is displayed. So it can happen that you lose the overview. In this article, we would therefore like to explain what HTML commands are, the different categories there are for classifying the commands and which of these commands are the most important ones.

What are HTML commands?

HTML is the short form for the English term “Hypertext Markup Language“, which in German means as much as “Hypertext Markup Language“. It is a platform-independent document language that can be used to design websites. A HTML document contains not only the usual text but also commands that format web page content, set links, create tables, insert images and much more. The browsers then execute these formatting commands from the HTML document and display the desired result. However, this is only possible if the website operator did not make any mistakes during the creation, because HTML commands follow a strict order. If you forget a command or part of a command, the result is usually incorrect. An HTML command always consists of the brackets < and >. The command is then typed in between. These commands are always at the beginning and end of the desired formatting. At the end, the character: / is placed after the first bracket and before the command. An example: The HTML command for the main heading (h1) of this post:

These are the most important HTML commands

In the example heading, it is normal that there are no spaces between the commands and the content to be displayed. However, this is not always the case: There are also commands that can be defined further and where spaces are used for creation.

The categories and their HTML commands

Structure of the document

Each HTML document starts with the command and ends with , to mark the beginning and end of the document. The command is also added at the beginning of the header and at the end of the header. Between these two commands, information such as tags and scripts is stored. Metatags>/strong> contain important information for the search engines, whereas scripts, such as the Java-Script, enhance the web page. When the header is finished, you get to the actual content of the page. This is framed by the commands and . In between, all the information about the page design like text content, font, colors, tables, graphics and much more. The basic structure of an HTML document then looks as follows:

Set hyperlinks

Hyperlinks, or also backlinks, are integrated into the website by means of an anchor text in the text or by means of an image. These then redirect you to other websites when you click on them. Such a link is usually set to provide the user with further thematic information on other websites. The basic structure of such an HTML command, which is used to insert links into a text via anchor text, is as follows: . The link to our SEO lexicon then looks like this: SEO lexicon Inez Media. In the text the visitor sees then however only: SEO-Lexicon Inez Media

Create paragraphs

To structure a text in a meaningful way, paragraphs, line breaks, centering and horizontal separators are of course also necessary. These codes do not exist in duplicate, since they do not provide any content and only influence the text formatting.

• • paragraph:

• centering:

Set character formats

The design of the font is also important for the appearance of a website. It can be used to highlight individual words or parts of sentences or text to draw the reader’s attention to the corresponding content. The content is then entered between these commands. The different character formats are set in this way:

• <underlined, and li… li…

• ^{sup>highlighted}:and
• _lowered: and

• biggest headline:

and

• small headline:

and , in between are the heading sizes h2, h3, h4 and h5.

e.g;

Create lists

Lists are useful for enumerations, as you can see above, because they allow you to display a lot of content in a structured way. A distinction is made between ordered and unordered lists. In our article, you will discover only the unordered variant so far. The difference is that the ordered list is numbered, whereas the unordered list has no hierarchy. The general code for lists is

and . To define the corresponding lists further, insert another command before the first and the last list entry. ordered lists are framed with and and displayed like this:

1. 1. first list item
   2. second list item

…

This framework is so visible to the reader:

The basic structure of the unordered list, on the other hand, is framed with and looks like this:

For example..;

…

For the reader, this framework is only visible in this way:

Create tables

If you want to present several pieces of information to the visitor of a website in an orderly manner, tables are the best way to do this. This creation is somewhat more extensive than the setting options discussed so far. As is well known, tables consist of columns and rows and these are built up bit by bit.

The basic structure

The three most important commands required for this purpose represent the rough basic structure of the table.

• • By the codes and the browser is marked that the following is a table

• Columns are created by the codes and

Accordingly, the basic structure looks like this:

Insert content

To fill this table with content, the text must now be inserted into the corresponding columns. To do this, simply type it between the codes and . Repeat this code as often as you like for several contents. An example:

&nbsp

Content 1 Content 2

For the viewer, this is how this setting appears on the website:

Insert frame

The frame of this table is not very visible. In order to make it appear clearer and to make the table stand out better from the rest of the page, it can be defined more precisely. To do this, add more information to the command with border “1”. Accordingly, the first line of the table framework now reads

Then the remaining commands are inserted as before. In the end, the whole thing should look like this:

add columns

As already mentioned, the tags and are responsible for the columns of the table. To add more columns in a table, start with a new -tag after the tag of the first column and fill it with the commands and the corresponding content. You can repeat this step as often as you like until the table meets your requirements. The framework looks like this:

Content 3 Content 4

The website visitor sees the following table in front of him:

&nbsp

You can also find out more about this topic at a-coding-project.de.

Insert graphics

Pictures and graphics always make a good visual impression on a website. You can influence the orientation or position of these images in the browser window. The basic commands for images are: and and can be extended with the addition align=, which defines the position. After the tag align= you now add the desired position, i.e.: top, middle or bottom. If you want to position an image in the middle, the correct command combination is: align=middle. Then add the name of the file with src: align=middle src=garden.jpg and specify an alternative text with alt=. Thus the complete command with all three components is: align=middle src=garten.jpg alt=alternative text

Insert special characters

There are an incredible number of special characters that can be used when designing a web page or text. These include both umlauts and symbols. The often used angle brackets < and > are represented by the codes &lt; and &gt;. The so-called quotes ” “ appear when you enter &quot;. The codes for the umlauts are case-sensitive. Here are some of the most common special characters:

Ä: Ä ß: ß -: – @: @ ä: ä &: & =: = [: [ ] € ?: ? ]: ] ö: ö !: !                   $: $ ^ U: U #: # *: * {: { ü: ü +: + %: % }: }

For more detailed lists of special characters and their HTML commands, please visit sonderzeichentabelle.de or ewetel.net.

An overview of the most important HTML commands

Now it’s time to take a deep breath: Of course this was a lot about HTML commands. But there is also simply a lot that you need to know if you want to deal with them. With their help you can create your website according to your ideas and wishes. However, this also requires some work: But it will be worth it when you see the result! On your website everything is wonderfully staged and the visitor enjoys, among other things, the great design of the page and content. A look at our article should definitely help you if you have questions about the topic. We hope that you can take something from this article and use it for yourself and we are looking forward to your next visit with us. Until then we wish you all the best and much success with your HTML project!