The bulk of the content presented on the Internet is web pages. This is historically the very first type of documents intended for placement in a virtual network space, but which has so far remained relevant and has virtually no competing formats. What is the structure of web pages? What web development tools do they create?
What is a web page?
“List the basic elements of a Web page,” the examiner tells us in a computer science lesson. What can we say back to him? First of all, we will tell you about what a web page is in principle.
According to the generally accepted definition among IT professionals, this is a document that is intended to be opened in a specialized program - a browser, and which contains data for displaying various useful content - texts, links, graphics, video, music and etc. A web page is a text document. Relevant data for the browser are letters, numbers and special characters used as elements of the markup language - HTML. It is with the help of it that the creator of the web page "explains" to the browser how to display this or that content on the screen.
The place and role of web pages in the structure of sites
Can you say that a web page is the main component of a website? This is partly true. However, as we noted above, a web page is just a text document. The site, as a rule, also houses pictures, videos and other multimedia elements. A web page cannot contain them, but in its structure it may contain links to them. Thus, a web page can be called the main component of the site in terms of the dominant role in displaying virtual content to users.
In rare cases, of course, the document in question will be the only component of the site - if for some reason it does not provide graphics, video and other multimedia elements on it. In particular, the very first sites — when the markup languages for Web pages first appeared — did not include relevant content. Before the eyes of the user there was only text and links.
Hypertext Engagement Principle
So, a Web page is a document written in HTML, with the help of which hypertext markup is carried out. But what is this phenomenon? What is hypertext? Without delving deeply into theory, we note that this is text that in one way or another allows you to quickly access another - through links. In an ordinary book this is not possible - there is "plain text." To gain access to the desired page, the reader must make a few flips, before reading the contents or footnotes. In the "hypertext" mode, the computer does the bulk of the work - due to the information reflected in the HTML elements of the page.
If the computer science teacher tells us: “List the main elements of the Web page”, then we can correctly begin the story about the components of the corresponding document that are created using the HTML markup language. Therefore, to begin with, we consider some theoretical points regarding HTML.
HTML language structure: tags
How does the browser read the necessary data about the web page from a document compiled in HTML? Very simple.
The main elements of this language are tags. In most cases they are paired - there is an opener, but there is a closing one. The former are indicated using angle brackets only. The second ones are similar, but before the second bracket a slash is placed - the symbol /. The browser can recognize them, and therefore without any problems displays the contents of web pages in accordance with the algorithms created by the document developer.
The opening tag is usually written in capital letters, the closing - in small letters. This is a standard established among IT professionals. The browser, of course, recognizes the HTML command by any letters, but web developers are still advised to adhere to the marked tagging scheme. This will facilitate, for example, the completion of the web page by other specialists.
Attributes
Other essential elements of the HTML language are attributes. With their help, the creator of the web page can set the properties of the content - for example, font height, color, position relative to the page. The same goes for pictures, videos, and other multimedia components. Attributes are written within the opening tag.
Content
Between the opening and closing tags is the next key component of the web page - the content. This, in fact, is the very content that should be displayed in front of the user on the screen. This can be text, link, picture, video or other multimedia element.
Webpage Elements
“So list the main elements of a web page, finally!” - repeats the teacher. “With pleasure,” we answer him. What is included in the structure of the type of documents under consideration? We agree that we will consider this aspect in the context of the HTML elements of a web page. That is, their display in the browser - what the user sees on the screen - we will be less interested in. The fact is that the corresponding HTML algorithms, on the basis of which the program displays content the same way, can be different. And this is the peculiarity of the HTML language: the desired image on the Web page can be displayed in various ways. At the same time, they can be equivalent in terms of labor costs to the creator of a web page in ways that can also imply a different amount of effort and time for their implementation.
Webpage Elements: Header
The standard elements of a Web page, no matter how surprising it may sound, are presented in very small numbers. In fact, there are only two of them - the title and the main part of the document. At the same time, each of them can have a rather complicated structure.
What is the specifics of the header? It is located at the very top of the web page. In the HTML code that forms the title, as a rule, it is assumed that only text is “encrypted”, but if necessary, small graphic inserts can also be placed in the corresponding element. And that, in fact, is all that can be said about the headline. It would seem that its role in the structure of the corresponding document is insignificant. But this is not so. Web page headings are very significant in terms of indexing sites in search engines - Yandex, Google. This element should be fully relevant to the content of the web page, as well as the thematic specifics of the site.
How is the title of a webpage captured using HTML? Very simple. First, an opening tag is written, which always looks like a HEAD with angle brackets, then the contents of the header, then a closing tag. They are written, of course, at the very top of the web document.
The title of the web document may include a number of additional elements. Sometimes a web page format may require text to be displayed in a specific encoding. How can a web document meet this criterion? Very simple. HTML algorithms should be placed in the document heading structure, instructing the browser to use a specific language encoding - for example, Cyrillic. Corresponding teams are placed within the META tag, which, like the others, is opening and closing.
The main part of the web page
The main part of the web document is opened with the BODY tag, it is closed using the corresponding element, including the slash. In this case, between the opening and closing tags there can be a huge number of additional commands of the hypertext markup language. This is due to the fact that the main part of the web page contains its useful content - texts, links, graphics, videos, various forms for filling.
Each of the corresponding types of content has its own tags. HTML commands may be present in the structure of the main part of the web document with the help of which text is also formatted - for example, giving the font a certain color, size and other properties.
Consider the specifics of some commonly used HTML tags. Actually, they also form the basic elements of a web page.
Basic HTML tags
So, for the purpose of a detailed study of what constitute elements of a Web page, we will study in more detail the essence of basic HTML tags. We have already cited some of them above - in particular, those with which the browser reads the titles of web pages and determines where the main part of the document is located.
The P tag is fairly common. It, like other similar elements of the hypertext markup language, can be opening and closing. This tag allows you to format a single paragraph of a document. You can, for example, set a specific font type or color for it. However, this is done using an additional tag - FONT. At the same time, it will be placed inside the one that denotes the paragraph limits - this will allow not to spread the HTML command reflecting the type of the preferred font to other elements of the web page.
TABLE tags are used to create tables. Using the corresponding attributes, you can determine the required number of columns and rows, set their width, border specifics, font size and color of the text in the table.
The IMG tag is responsible for image processing by the browser. It can also place various attributes that regulate the size of the image, its position on the page.
Links to other web documents or files are indicated using the A tag. As a rule, there are attributes inside it that indicate the fact that the structure of the web page contains a hyperlink. This indicates the document, file or site to which it leads.
A tag like FRAMESET is common. With its help, you can divide the space of a web page into several areas - frames. In each of them, you can place links to individual web documents. That is, frames allow you to correctly place two or more pages on one screen simultaneously.
The story about the key elements of web pages and the subsequent story about the means of formatting them using the HTML language will be approximately the algorithm of our answer to the question that the examiner asked us. If he turned to us, saying “list the main elements of the Web page”, then we, using the appropriate methodology, will have every chance to reveal the topic. That is, by the term "elements" we can understand the key components of the structure of the web document, or the types of content - text, images, tables, frames, links, which the webmaster creates using a tool such as HTML.
Web Development Tools Specifics
In addition to the above, we can clarify that there are a lot of tags and attributes provided by the HTML standards. In addition to HTML, web developers can use additional formatting tools for hypertext documents. For example, using the JavaScript scripting language, you can create dynamic Web pages - that is, those in which the content is constantly updated (both due to the actions of the user himself, and in accordance with the algorithms previously prescribed in the scripts).
It will be useful to add that the web developer can use full-fledged programming languages, such as, for example, Perl, PHP, Java, Python, with the help of which the possibilities of working with hypertext documents become even wider. The need for this may be due to the fact that the areas of application of web technologies today are very different. The challenges facing modern developers can be quite complex. For example, sometimes it is required to translate Web pages written in Russian into English. In this case, the developer's tools will be the most diverse.