HTML lists: definitions and explanations

What is an HTML list?

HTML Lists are used in HTML to present information and text elements in list form structured and clear. Depending on the needs, the content can be presented in the form of an ordered list with numbering or an unordered list. Since HTML5, there has been a third variation, definition lists, which are specially adapted for assigning terms and describing them.

HTML lists are an essential element for designing clear and varied websites, and help convey information clearly and effectively. This applies equally well to a simple enumeration, to an increasing numbering of information or to definitions presented in detail.

What are the different types of HTML lists?

As we already mentioned, lists can be presented in different ways in HTML documents. While the ordered and unordered lists are used very often and are practically present on all Internet sites, definition lists (also called description lists) are used much less often. In the following sections, we'll take a closer look at the different types of HTML lists and their syntax.

Ordered lists (Ordered Lists)

An ordered HTML list is characterized by content and listed elements that you organize and structure according to a desired hierarchy using a ascending alphanumeric order. The advantage lies in the clear and thoughtful sequence of information. To do this, we use the opening HTML tag on the one hand

the closing tag et plusieurs points
1. ...

for the different entries in the list. Ordered lists are suitable, for example, for presenting rankings, step-by-step instructions or lists of questions.

There ordered list syntax looks like this:

Premier élément de la liste
Deuxième élément de la liste
Troisième élément de la liste
Quatrième élément de la liste
...

html

The output looks like this:





Close

Advice

In a separate article, we'll go into a little more detail about how ordered lists work and what they can do.

Unordered lists (Unordered Lists)

In an unordered HTML list, you do not use alphanumeric order of list items. Instead, they use enumeration symbols such as ellipses, dashes, arrows, or checkmarks. In this way, content can be presented in a structured way without being hierarchical. Typical contents are for example recipe ingredients, cities and countries or lists of names. To create an unordered list, the opening HTML tag , la balise de fermeture et plusieurs points

2. ...

are used.

There unordered list syntax looks like this:

Premier élément de la liste
Deuxième élément de la liste
Troisième élément de la liste
Quatrième élément de la liste
...

html





Close

Advice

You will also find additional information about unordered lists in this article.

Definition lists (Description Lists)

A list of definitions allows you to list selected terms and their definitionexplanation or description associated in a structured way. This type of HTML list is particularly used for glossaries, technical glossary pages, product specifications or explanations in tutorials. To create a list of definitions, use the following three components:

• ...

  : means “ Definition List » ; identifies the start and end of the list item.

• ...

  : means “ Definition Term » (dt); identify the term to be explained.

• ...

  : means “ Definition Description » (dd); indicates the description, definition or explanation of the associated term and immediately follows the tag

  .

HTML definition lists are created based on the syntax following:

Terme 1
Description ou définition du terme 1
Terme 2
Description ou définition du terme 2
Terme 3
Description ou définition du terme 3
...
...

html





Close

Application areas of HTML lists

Here is an overview of the areas of application and possibilities of using the different tags for an HTML list:

Ordered list	Unordered list	Description list
Step-by-step instructions	Advantages or disadvantages	Glossaries
Tutorials	Drop-down or context menus	FAQs
Rankings	Link Collections	Product Lists
Comparisons	Sources and references	Categories

Web Hosting

State-of-the-art web hosting at the best price

• 3x faster, 60% savings
• High availability >99.99%
• Only at IONOS: up to 500 GB included

See the offer

Why use HTML lists?

Using an HTML list helps improve the efficiency and structure of web page content. The advantages of lists include:

• Better structure, clarity and organization of information
• Better ranking by search engines thanks to varied page elements
• Optimized accessibility and clear semantic structure of pages for better readability
• A personalized visual presentation of page content, particularly in combination with CSS styling

Advice

In our HTML tutorial for beginners, you will learn all the important information for a smooth start in this web programming language.