1 00:00:01,050 --> 00:00:09,530 HTML HTML stands for hypertext markup language, it's not a programming language, so don't confuse 2 00:00:09,540 --> 00:00:09,600 it. 3 00:00:09,600 --> 00:00:14,910 Two, it's a markup language to structure a Web page and its content. 4 00:00:15,910 --> 00:00:22,810 So then what's the structure, the content of a Web page can comprise of paragraphs, navigations, 5 00:00:22,810 --> 00:00:30,820 images, tables, lists and so many more elements HTML structure of a Web page with a series of elements. 6 00:00:31,540 --> 00:00:37,000 And these elements have an opening tag as well as a closing tag. 7 00:00:37,630 --> 00:00:46,120 Elements can also have attributes so browsers do not display the HTML tags, but they use them to produce 8 00:00:46,120 --> 00:00:47,390 the content of the page. 9 00:00:48,970 --> 00:00:54,910 So you see resources of a simple project that I coded to point out some H.M. elements. 10 00:00:55,540 --> 00:01:02,020 It doesn't require a Web server to be run and you can download it from the link below. 11 00:01:03,560 --> 00:01:08,000 So we'll view this page in Firefox now the page. 12 00:01:09,080 --> 00:01:11,780 Will be displayed like this. 13 00:01:13,540 --> 00:01:20,230 And I also put almost every HTML element into it so you can scroll up and down and and see what these 14 00:01:20,230 --> 00:01:21,190 elements look like. 15 00:01:22,300 --> 00:01:25,140 And of course, the source of the page can be previewed as well. 16 00:01:27,030 --> 00:01:31,050 So now I'm going to return to the code in the ED. 17 00:01:32,590 --> 00:01:37,570 And here's a very basic and very standard issue about structure of Web page. 18 00:01:39,140 --> 00:01:45,540 We'll try to explain the main structure from top to bottom so that you can see how the individual elements 19 00:01:45,540 --> 00:01:49,070 are combined to form an entire HTML page. 20 00:01:49,920 --> 00:01:57,810 So the first line, the DOCTYPE element, it defines the type of document which historically has meaning. 21 00:01:58,620 --> 00:02:04,110 But now it's not very important because browsers can quickly get that it's html. 22 00:02:04,950 --> 00:02:08,700 HTML element is the root element of the page. 23 00:02:09,510 --> 00:02:13,200 The whole content of the page should be between these tags. 24 00:02:13,680 --> 00:02:18,240 HTML tags can have attributes to define more properties about the page. 25 00:02:18,960 --> 00:02:23,340 So with a attribute, the language of the page can also be said. 26 00:02:25,360 --> 00:02:26,440 The head element. 27 00:02:27,820 --> 00:02:33,730 This helmet works like a container for the elements that are included in the package but are not displayed 28 00:02:33,730 --> 00:02:40,240 on the page visually, so we can say the head element contains metadata of the document, such as the 29 00:02:40,240 --> 00:02:48,940 page title links for CFS files, Fabians script files, et cetera, and other metadata, such as data 30 00:02:48,940 --> 00:02:55,810 about the HTML, the author and important keywords that describe the document meta element. 31 00:02:56,970 --> 00:02:59,790 So metadata is data that describes data. 32 00:02:59,820 --> 00:03:06,870 Yeah, so with this element, the metadata of the page, such as author description and more can be 33 00:03:06,870 --> 00:03:07,380 defined. 34 00:03:08,110 --> 00:03:10,620 And here's the charge set attribute. 35 00:03:11,400 --> 00:03:14,550 It's used to define the character set of the document. 36 00:03:16,130 --> 00:03:23,720 OK, so here it has value of UTF eight, which includes most characters from the vast majority of written 37 00:03:23,720 --> 00:03:30,980 languages, there are lots of different meta elements that can be included in an HTML document. 38 00:03:32,210 --> 00:03:39,320 So even the developer can override his own meta elements, the title element, this element sets the 39 00:03:39,320 --> 00:03:47,570 title of the page, and it's not just ordinary text because search engines use this text to classify 40 00:03:47,570 --> 00:03:48,090 the page. 41 00:03:48,740 --> 00:03:55,820 So by searching on a log in form title, you can list log in forms indexed by the search engine and 42 00:03:55,820 --> 00:03:56,600 the body element. 43 00:03:57,320 --> 00:04:03,350 The content that will be shown to the users reside in this element, whether it's text image, video 44 00:04:03,350 --> 00:04:05,000 playback, audio tracks, whatever else. 45 00:04:06,910 --> 00:04:14,680 So I intentionally put a whole bunch of elements into this code file paragraphs, headings, lists, 46 00:04:14,710 --> 00:04:21,060 links, images and videos are some of the other elements that are worth paying attention to. 47 00:04:21,850 --> 00:04:24,850 But as you can guess, this is not an incremental development course. 48 00:04:26,230 --> 00:04:30,820 But I did want to show you a sort of overview of what we get. 49 00:04:32,020 --> 00:04:36,550 So I'm going to stop here, but you can always have more detailed look on your own.