Computers, Programming
HTML: Basics for Beginners
HTML is the hypertext markup language that made the Internet the way we know it and love it. It is thanks to this wonderful tool that the sites look beautiful and modern, and also provides convenience of their use. The HTML language simply composes the elements of the web page into a user-friendly option. His work is comparable to what text editors like MS Word or OpenOffice do. They turn a faceless mass of letters into a document in which there are paragraphs, bold text, italics, tables and even images. About the same thing does the HTML language, with the only difference is that its documents are displayed in the browser, and the capabilities of this tool are much wider than in the text editor. For markup, tags are used - special commands that describe the structure of a web page. They are enclosed in angle brackets -
Visual Editors
Beginners, who have just set foot on the path of learning HTML, often begin their work with programs that allow you to create websites without any knowledge. In them, you can simply arrange the items on the screen as they will be displayed in the browser. It would seem, here it is - a source of eternal grace, allowing to get rid of most web developers. But not everything is so simple, as visual editors have a lot of flaws that make it impossible to use them in serious projects.
All these programs create a lot of unnecessary tags that make the final page version cumbersome and suboptimal. Of course, in our age of high-speed Internet this is less important than before, but there are a number of reasons why a concise and competently written site is more practical than its counterpart created in a visual editor. A web page made in such a program will be poorly handled by search robots, since each kilobyte of code is important for them, and a cumbersome and illogical code with a bunch of semantic errors will hardly have to them to taste. In addition, the editors often lag behind the times, becoming irrelevant, and it is not advisable to spend resources on their development, since no professional uses these products. Therefore, anyone who wants to work in the creation of sites, must know the basics of HTML.
Tags
As mentioned above, the tags describe the structure of the web page to the browser. Most of them have an opening and closing tag, but not all. For example,
There are also single tags that do not need to be closed. In them, the content is inside, as well as the attributes. An attribute can be registered for most HTML tags and specifies the properties of an element. It is denoted in the opening tag and looks something like this: attribute = "...", where instead of points there is an attribute value. Knowledge of tags is the first and most important step for mastering HTML. The basics of this art also mean understanding the structure of a web page.
Document structure
Each HTML document has a corresponding extension, for example, Index.html. So the browser can understand what it is dealing with, and display the page correctly. All the files used to create the site, it is desirable to store in one directory, which in the future will greatly facilitate your life. The fundamentals of the HTML hypertext markup language imply a clear understanding of the structure of the document. It starts with the tag that tells the browser the version of HTML that is used in this document. At the moment, the fifth version of the language is relevant, so there is nothing to invent, you can safely insert the above tag at the top of any page.
Then there are the main paired structures that make up the "skeleton" of the site. The first tag, in which all the rest are embedded - ... html>. Everything outside it is not recognized by the browser as a web page, so that it opens the document and closes it. This tag is required for any document. It also contains a few more mandatory tags, which will be discussed below.
Head
Inside the
... head> tag contains technical information that will not be displayed on the page, but, nevertheless, is an important part of the HTML document. The basics of the site are laid in this place, here the encoding is selected and the name of the page is entered. It is contained within the mandatoryLink
Knowledge of the basics of HTML also involves the use of cascading design styles, or css. They set the properties of the elements that will be displayed on the page. A modern approach to this task involves the rendering of characteristics such as color, height and location of the element, into an external file for greater convenience. The tag is used to connect the css file. In the finished form, it looks something like this: , where href indicates On the location of the file, and type - on its type.
Body
It is in this part of the HTML document that the visible part of the page is created. Everything that is done inside the "body" will be displayed by the browser. In
- - used to select the substring to which the special style described in css will apply;
- - creates a link to a web page; The jump address is specified by the href attribute;
- - one of the most popular tags of our time; Everyone who decided to learn the basics of HTMLl should pay special attention to it, since it is a block-based element based on which the lion's share of modern sites is made (parameters forblocks are set in css, and other blocks can be located inside this tag);
- selects a paragraph from the text; The contents of the paragraph are between the opening and closing tags;
- - numbered list, the elements of which are enclosed in the pair
- tag;
-
- is a bulleted list, in which, as well as in the numbered list , the elements are denoted by the
- tag;
-
-
- headers of the document (the number indicates the header level, that is,
is the main heading, and the subsequent versions are its subheadings, by the way, the headings of the levels
,
are almost impossible to meet on the Internet) , It's also important to remember that there can be only one
header on the page;
- - bold text;
- - italics;
-
- inserting a picture on a web page (this is a single tag, it does not need a closing tag, but it's necessary to specify the alt attribute, which specifies the text for the image);
This is not all the tags needed to create your own web page, but they are enough to lay the foundation of HTML for beginners.
CSS
The development of the HTML language has led to the fact that each tag has acquired a lot of attributes, and the requirements to the appearance of web pages have significantly increased. The code became cumbersome and inconvenient, it was difficult to read it, not that what to adapt or change. In addition, if there are ten pages on your website that have a lot of headings marked in green, and you suddenly want to make them red, you'll have to sweat, changing each manually. With the advent of cascading style sheets, this process has become simple and logical, and HTML code has become much more readable.
Applying CSS
To create web pages, you need to know the basics of HTML and CSS, since now without knowledge of cascading style sheets there is nothing to do in this sphere. They specify the attributes for any element that apply to the entire document. Thus, you can set the color at once for all
In order to connect the css file to the document, there is a link tag. A little above, the principle of its use was described, but it is not the only option combining all styles in one place. There is also a