Learning HTML

Table of contents:

Learning HTML
Learning HTML
Anonim

In this article, you will learn how to use HTML to write your first website! The article will provide illustrative examples for a better understanding. Let's make a reservation right away that the article was originally designed for those who are just starting to learn HTML. In addition, we promise that by the end of reading this article, you are guaranteed to create your first website.

HTML stands for HyperText Markup Language, that is, a language for organizing text.

Unlike programming languages (JavaScript, PHP, etc.) that use scripts to perform actions on websites, the sequencing language (HTML) uses tags to mark up website content.

Let's start learning HTML from scratch

Just as English is made up of letters A, B, C, etc., so HTML is made up of peculiar "letters":,,

etc. These peculiar "letters" of the HTML language are called tags by webmasters.

The following is an example of an HTML tag.


Tags Create an underline around the edges of this text.

HTML tags paired with CSS language styles allow you to quickly and efficiently create websites.

The place of HTML among other languages

As you know, a good websitebuilt in at least 5 languages.

Modern website is built in languages:

  1. HTML (structure and ordering).
  2. CSS (style content).
  3. JavaScript (browser actions).
  4. PHP (server action).
  5. SQL (data storage).

HTML is the main fundamental language on which others are based. Therefore, learning HTML should be the first step for anyone learning how to build websites on the web.

Tag

The HTML language has changed over the years since its inception. At the moment, most Internet sites are moving to the latest version of the language - HTML5. But even in HTML5, the fundamentals of the language remain unchanged.

The structure of an HTML page is like a sandwich. Just like a sandwich has two slices of bread, an HTML document has an opening and closing HTML tag.

These tags, like the bread in a sandwich, surround everything inside.


Tag

As you continue learning about HTML, you should definitely become familiar with the tag. Directly inside the parent tag is all the content of the site, including the tag. This tag is required and contains all the settings of the site page for which it is written. These settings are not visible to site visitors, only browsers (Google Chrome, Mozilla Firefox, etc.) see them.

The webpage settings block contains all the "non-rendered" elements that help the browser display your site correctly on the web.


All options thatcan be configured inside the tag, we will look at it, but a little later - when the time comes.

Tag

The tag, like the tag, is inside the tag.

This tag is needed in order to display on your site all the information that you want to display.

Headings, paragraphs, tables, pictures and links are only a small part of the elements that can be contained inside the tag.

Basic structure of an HTML document:


… …

Your first site

Now you know that you can create websites using HTML and that basic tags are used for this:

  • . Outlines the boundaries of a web page.
  • . Contains settings for displaying a web page in a browser.
  • . Contains all web page elements (images, videos, text, and so on) that you want to show to site visitors.

Other tags like,,, we'll talk about soon.

It would be great if the reader not only read this article, but also immediately ran to hone their skills. To hone your HTML skills, you will need to create your first website, which will serve as a testing ground for your new abilities.

It is known that mobile operators ("MTS", "MegaFon" and so on) provide us with mobile services. In the same way, hosting operators provide us with services for creating and managing websites. To create your website, go to the site of any free hosting operator.

Verified hosting providers include BEGET orreg, for example. You can choose anyone.

After a short registration, after 24 hours, your first website on the Internet will be automatically created, which will be visible to the whole world, and you can start practicing!

Modern site structure

Now that you have your site, check out what tags a tag contains and how they organize information on sites.

The structure of a modern site
The structure of a modern site

The picture above is a schematic representation of the structure that came with the latest version of the HTML language - HTML5. Along with HTML5 came not just new tags, but also the meaning of building websites. All the tags you see in the picture are contained within the main tag. These tags help you "outline" the structure of your site and give it meaning.

For example, inside tags … it is convenient to place the site title (tags) and site description (tags).

It is convenient to place the menu (links) of the site (tag) inside the tags.

It is convenient to place any large block of information related in meaning inside the tags. It can be several articles, each of which is "wrapped" in tags, or photos (tag), or tables (tags

) and more.

It is convenient to place any information inside the tags that does not fit the meaning of.

Inside the tags, it is customary to place additional information such as contact information, additional sections of the site, and so on.

So now you're a bit more adept at what modern websites are made of. Let's take an example tothe turmoil in my head was replaced by awe from insight.

So, when you open the file manager on the site of your hosting operator and find a document called index.php, feel free to write in it, as if from scratch, the structure of your site.

My first website

Page title

Page description

Link 1 | Link 2 | Link 3

Title of some article

This is a block that contains any information, and with the help of CSS you can color this block, and the whole site with all its content, the way you want. © All rights reserved

Remember we said that there are different settings for the site? Well, here it is:

  1. Using we show browsers that the site can contain both Russian and English characters (otherwise, when you open the site, you will see terrible krakozyabry).
  2. is used to indicate the page name, which will be displayed in the browser tab and in the search engine ("Yandex", Google and the like).

Of course, without CSS styling, your site will look stingy (black letters on a white background), but be sure to try writing your first page in HTML first.

Congratulations! You have just created your first web page on your own website! It will be more interesting!

Recommended: