Skip to content

Structure

The basic structure of the HTML file looks like this:

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Page title</title>
</head>
<body>
    Content displayed on the website
</body>
</html>

  • The DOCTYPE declaration tells us about the version and type of the HTML document. In the example above, we have the information that the page will be created in the latest version of HTML5.

  • All code of our website is placed inside the <html> </html> tag. The lang attribute specifies the language in which the web page is written.

There are two main sections inside the <html> tag:

1) The <head> section, in which we will place the so-called metadata which is important information for the browser, but not displayed directly as the content of the website.

  • We set the page encoding by adding the charset attribute to themeta tag. If we want the page to have Polish characters, set the attribute to UTF-8, i.e.:
<meta charset="UTF-8">
  • To help display the page, on mobile devices we set the name attribute to viewport in the <meta>tag. The content attribute sets the display of the content of our page, adjusting it to the width of the mobile device, and also sets the zoom value when the page is first loaded to1.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  • We use the <title> tag to specify the page title, which is usually visible on the top bar of the browser as the tab title, and in the page search results.
<title>Page title</title>

2) The <body> section contains everything that is to be displayed directly in the browser after entering the website. That is, e.g. articles and their content, links, pictures, tables, etc.

NOTE: The DOCTYPE declaration and the html, head, and title tags should appear in every HTML document.