Each site has a different appearance and functionality, but what is the reason for this and what language is the page written in? For all this, Cascading Style Sheets and the HTML language are used. You can take a look at the code of this language for yourself if you inspect the objects in the browser. Specifically, what is the HTML language, we will talk in this article.
Our article is aimed mainly at beginners, so we hope for the understanding of regular readers of the blog!
The post will be divided into the following sections:
What is an HTML page
A markup language called HTML is used to style all page elements, including tables, images, and text. You can look at the code and try to understand it if you use any modern browser, just right-click on the page and in the menu click on the line "source code of the page" or "HTML code". After that, you will see something like an editor, in which there are a lot of incomprehensible inscriptions and symbols, this is the HTML language code.
Each WWW document has richly formatted and beautifully designed text, as well as hyperlinks and images chosen by the site owner. In order to work with these elements, programmers have created a language called HTML (Hyper Text Markup Language), which means hypertext markup language. Each browser works and renders HTML differently, so it renders differently in different browsers, especially in older versions. Internet Explorer.
All HTML documents are similar - this is the standard text file, which has markup tags for that language along with texts that site visitors will read. The tags are used to create a page, and it is them that the browser reads when it loads it. Thanks to the definition of tags and their design, you can place an article or other material in a specific place on the page, add graphic files and photos, as well as hyperlinks to other pages of the site. Initially HTML file is not a web document, it becomes one only after being read by the browser.
Of course, standard HTML code has its drawbacks and disadvantages. You will have to try hard to arrange paragraphs with text on the page, because for markup and everything else, you need to prescribe certain properties for the entire text, and for each individual paragraph. If your site has 50 pages and each has 10-20 paragraphs, it will take a very long time to format the text, and insert the same tags every time. This not only tires the site owner, but also negatively affects the weight of the site pages. It is for this reason that cascading style sheets were later created, they are briefly called CSS, which means Cascading Style Sheets, thanks to which you can quickly arrange text. You can assign one tag and give it certain characteristics, such as text color, size, font, and so on, and then apply it to paragraphs. In this case, the style sheet file is stored separately, it can be uploaded to one site or several at once. Next, the main elements of the page are written in HTML, and the text is inserted, and then CSS is connected and all the text gets the design you need. It also reduces the weight of the pages, which is very important. 
Using CSS it is advisable if the site has a lot of pages that will have the same design. You can set certain text formatting for all paragraphs if you write several lines in a document with CSS code. During the creation of the site, layout designers create the main layout in HTML, focusing on the layout created in Photoshop. But after that, the site looks unfinished, you need to create an attractive appearance, and this is achieved by cascading style sheets. This is easy to learn if you have a lot of free time, since the general appearance of all sites is about the same, you can have one layout with several blocks and "adjust" the rest of the sites to it. As a rule, cascading style sheets are much more complicated than CSS, and it is even more difficult to layout a site on blocks, and not on tables. In addition, at the initial stages, you may encounter such a problem as different display of the site in browsers. It is in order not to waste time and make money on sites that CMS were created - ready-made layouts sites that can be free or paid and have a certain management system.
What is HTML5. Differences and advantages
new standard HTML5 helps site owners and relieves them of the obligation to use the format Adobe Flash, as well as other programs. Thanks to this standard you can change the display of text on the pages and make it easier to enter information when filling out electronic forms. If we divide all the innovations of this language, we can distinguish the following points:
- After entering the site, people will be able to watch video and listen to audio through the browser, for this a separate button is created for playing.
- Uploading new photos through this language is much easier, you can even create image galleries. You don't even have to download additional software.
- You can locate text and mark text blocks. You can also fine-tune the text to make it easy to read.
- If earlier in HTML4 a person noticed an error after entering data only when they sent the form, now the browser immediately reports an error if a person fills out the form incorrectly. This is very convenient for users, because they do not have to fill in the same sections with data several times.
- No need to use software modules, because with the help of HTML5 you can realize any ideas regarding the site. Only if the site is unique and you need to come up with something special, install additional software modules.
- Previously, people could not view the site normally through a tablet or smartphone, since the HTML4 standard does not have browser compatibility for mobile devices and others operating systems. Using the HTML5 language, pages are created that are ideally read from all devices at high speed.
If you have any questions - write them in the comments, we will be happy to answer them!
What is HTML and what is it for? - 3.7 out of 5 based on 3 votes
Before proceeding with the study, I propose to consider what html is and what it is intended for.
HTML stands for Hyper Text Markup Language, which can be translated as Hyper Text Markup Language. With the help of this language, web pages are created.
HTML is not a programming language. It is intended for markup of text documents. That is, by and large, with the help of it, we carry out text formatting.
So how can we edit text using HTML? The matter is that the HTML language consists of tags (tags). Each tag defines how the text will look on your page.
To put it another way, each tag gives a specific command to your browser (the program with which you view web pages), the browser understands this command and displays ready-made text formatted in a certain way on your screen.
Therefore, you do not see the code itself, the browser displays the already formatted text and graphics on the screen of your monitor. If you want to see for yourself html code and tags that format the text you are currently reading, then go to your Internet browser Explorer to menu item > view and from the drop-down list select item > source. Look at the drawing.
This will open a window containing the code. Similar to the one you can see in the second picture. You can scroll and look at this code, it mostly consists of tags, inside of which in most cases there is text. Thus, without going into details, we can say that each tag determines where, how, what font, what color your text will look like.
But in fact, HTML tags can not only format text, you can use them to insert an image on a page, create tables, create links, and much more.
Each tag performs its own specific functions, and in order to learn how to create web pages, you need to know what this or that tag is intended for. I think that now you understand a little what html is.
First, let's look at what a tag is. To put it quite simply, tags consist of ordinary English characters or words, only these letters and words are designed in a certain way.
Each tag consists of angle brackets,< >within which certain characters are placed. Most of them consist of opening and closing.
For example tag - opening, and- closing. As you can see, they differ in the presence of a trailing slash / in the closing character. If any word is placed between them, for example, Hey then it will be displayed in bold. Everything that is enclosed in angle brackets, in this case, is not displayed on the screen, but is a kind of command for the browser that the word that is enclosed between these tags should be displayed in bold.
There are naturally many tags and each of them performs its own specific functions. Approximately according to this principle, all other tags and the entire HTML as a whole work. When you request any document from the Internet, your browser downloads the html code, interprets it properly and displays ready-formatted text, graphics, tables, etc. on your screen.
The purpose of this lesson was to give you an idea of what HTML is, in the following lessons we will begin the study of this markup language. In order to make it easier for you to learn the material, I recommend that you start studying the lessons from the simplest ones, smoothly moving on to more complex ones, for example, in the following sequence: at the beginning, study as a document, with which they are set and produced, learn to set, etc. to more difficult.
To create HTML pages, you can use special programs, such as , or you can create pages using a simple text editor that is available in any version of Windows.
HTML- stands for HyperText Markup Language, which is the most widely used language for writing web pages.
- Hypertext refers to the way web pages (HTML documents) are linked. Thus, a link available on a web page is called hypertext.
- As the name suggests, HTML is a markup language, which means that you use HTML to simply "mark up" a text document with tags that tell the web browser how to structure it for display.
HTML was originally designed to define the structure of documents, such as headings, lists, paragraphs, and so on, to facilitate exchange. scientific information between researchers.
HTML is now widely used to format web pages with the various tags available in the HTML language.
HTML document
The following example shows an HTML document in simplest form:
header
Here is the contents of the document...
Let's save the code in the HTML file document.html using your favorite text editor. And open the file with a web browser like Internet Explorer, Google Chrome or Firefox etc. It should show the following result:
Tags for creating an HTML document
As discussed earlier, HTML is a markup language and uses various tags to format content. These tags are enclosed in angle brackets. Most tags have corresponding end tags, except for a few tags. For example, tag has a closing tag and tag has a close tag other.
The example above uses the following tags to create an HTML document:
| Tag | Description | ||||||
| This tag defines the document type and HTML version. | |||||||
| This tag covers the complete HTML document and mainly consists of the title of the document, which is represented by the tags ... and the body of the document, which is represented by tags ... . | |||||||
| This tag represents the title of the document, which may contain other html tags such as We will explore all the head and body tags in later lessons, now let's see what a document declaration tag is. DeclarationTag declarationused by the web browser to understand the version of HTML used in the document. Current version HTML is 5 and it uses the following declaration:
There are many other types of declarations that can be used in an HTML document, depending on which version of HTML is being used. We will see more details about this when discussing the tagalong with other HTML tags. Hello!. The second lesson we will devote to the question - what is HTML and how to work with it. In it, you will learn about the features of the most popular web programming language and clearly understand its main essence. From how you learn it, it will be easier for you to move forward and then you can easily (although no, you still have to work hard) to take on the conquest of more complex website creation languages, such as PHP. So let's get down to business. What is HTMLHTML (hypertext markup language) is a hypertext markup language. The standard markup language for Internet documents on the World Wide Web. It is one of the most popular website development languages. It is also considered the easiest in terms of loading in browsers. It doesn't have any complicated “mutations” like PHP, which, before displaying the page in the browser, first makes a request to the MySql database, and then only displays the content to the user. I will not tell long verbal preludes about how it was created, because it is long and not interesting. For all these points - the great Wikipedia to help you. We want to learn how to quickly create websites, right? Fine! Then let's move on and comprehend all the subtleties of this web science. Fundamentals of the HTML language. Tag ConceptWithout knowledge of a solid base, you can’t get anywhere, no one has yet canceled the “mat.chast” (“foundation” of any subject). And we will not deviate from traditions and rules. The basics of the HTML language are tags, or to be more precise, a set of tags. They are labeled like this<тег>. Tags are always paired and displayed like this <тег>.
Each of them performs strictly certain function to display in browsers. Some display a picture on the screen, others a link, others are responsible for paragraphs, others make a table, and so on. We can write any text inside them. I like to call them containers, for clarity, so to speak. But there are also single ones, we will study them in the next lessons. And one more thing to understand important point. AT given language the Pareto principle applies, that is, as in any area of life, activity, and wherever else, there is the 80/20 rule. What does it say? This tells us that 20% (in our case html) of the language does 80% of the work. The logic is that it is not necessary to learn all the tags, since many of them are simply not used or are used very rarely. So in our lessons we focus on the most frequent and important ones. And you did great with it! HTML document structureThe structure of any html document looks like this
Now let's describe each point in more detail: What is Doctype and its meaningsThe doctype element is used to indicate the type of our web page. This is the so-called "document type declaration" or Document Type Declaration. This tag should always be in the first place on every page. It's a key component of web pages that claim to be standards-compliant: without it, your code won't pass the validator. The web document validator is computer program, which checks the conformity of any document, data stream, or code fragment to a certain format, checks the syntactical correctness of a document or file (according to Wikipedia). There are several Doctype values:
I am using the second option. It is most convenient to work with it, since it does not limit the developer. There is confusion for the reader, so what is the difference between them and which one is best to use? Let me explain what their difference is. The transitional version does not strictly comply with the W3C validation standards (or, in Russian, checks), i.e. the browser will display the contents of the web document in the same way, even if it contains obsolete, not recommended, and other non-standard code variations. But the Strict version exactly adheres to all standards, that is, in practice, if you forgot to put the corresponding symbol somewhere in the code (for example, a slash /), then you will be given a warning during the check. Here's what a web document looks like using the strict version:
I advise you to use the second option and do not bathe, as it is the most convenient. Now we will look at other components of our page. - or the "head" tag, it contains the most important tags that explain to the browser what needs to be done on the page and what mechanisms to run. It defines a web document and its content. It often contains various scripts that run various features on the page and there is also an important "container" for SEO promotion - the tag We will not go into the details and history of what HTML is, but will immediately move on to the main points. HTML is the basis for building any website! When studying the topic of site building, it is necessary to start with it. There is nothing heavy here. ABSOLUTELY EVERYONE can master this technology! I want to note right away that this is NOT a programming language, but a markup language. Why learning HTML is easy? To speak fluently English language You do not need to know all the words that are in the English language. So here, you just need to learn some of the basic tags and learn how to work with them. And then you just have to practice and develop skills. Let's start learning this fascinating, and at the same time simple, technology. A little theory...Any page consists of tags. That is, the page does not actually look like we are used to seeing it, but consists of many tags, each of which plays a specific role. It looks like a big brick wall. If all the bricks on it are laid neatly, then the whole wall looks beautiful. Therefore, when writing the page structure, it is necessary to pay attention to each tag, because it is the "brick" for our future page. But what is a tag in HMTL?This is HTML element page, which in one way or another affects the display and layout of the page. In words, it is quite difficult to understand this, so you need to immediately look at everything in practice and get used to the code. Look at the image below: This is the structure of the simplest page. But these repeated words in triangular brackets are tags. If you open your text editor and write this code, and then save it in HTML format, then you will get an HTML page. So far it is not clear what is HTML? 🙂 From this structure, you can see those tags that must be present. These are the tags:
To make it clearer, I've highlighted them in orange in the image below: Everything that we will write between the tags and we will not see on our page. These tags can tell the browser about the encoding, about the title of our page, various styles, scripts, and so on can be connected here. You will see all this in the next lessons.And here are all the tags that we will write between the tags and, depending on its purpose, will affect precisely the structure of our HTML pages.Well, it became more clear what is HTML? 😉 But we do not stop and move on ... Some tags may have a closing tag and some may not. For example tag there is a closing tag. As you might have guessed, tags are closed with a slash.It is very important to respect the opening and closing tags. To avoid mistakes. The browser may not show an error, but the structure of your pages will be incorrect even when working with styles (where we will appearance) will be a big problem. Therefore, if the tag has a closing tag, then it must be present in the correct place. Let's take an example of how NOT to close tags and in what order to do it. An example of two tags: Correct HTML CODE What you see above - this is the correct order of writing the closing tags. But there may be such a situation ERROR IN HTML CODE So close tags strictly prohibited! Practice to understand what HTML is...To learn more about what HTML is, you can only practice. You can use any text editor for this. Even a notepad. But I recommend using Notepad++ because there are many more functions for working with HTML. You can download it from the link Download Notepad++. This editor has all the features for creating and editing HTML pages. Let's start. After opening the program, you will see the following window: To create an HTML page, you must enter the "body" of the page in this box. You can copy the text below and just paste it. But it's better to enter everything by hand. So you can quickly remember and get used to the tags. So, you should get the following: Next, you need to save this page in HTML format. To do this, click on the "File" menu, here click "Save As ...". Enter the name of the HTML page. I named it index.html. Then just save to comfortable spot on your computer. After that, the backlight will appear HTML tags, because the Notepad++ editor will understand what it is HTML Document. And it is much more pleasant to work with the backlight. RecommendedHow to open the registry How to open the game registryThe latter, storing the complete configuration of the hardware and software of the device, plays a key role in the operation of the entire system. In order to open...
|
