WEBVTT 0 00:00.560 --> 00:09.110 Now let's get started by learning a little bit more about HTML, what exactly is it? And how do we use it to 1 00:09.110 --> 00:10.340 create websites? 2 00:10.370 --> 00:18.050 Now, no matter what browser you like to use, Chrome or Safari or Brave, even all of these applications 3 00:18.050 --> 00:19.230 do the same thing. 4 00:19.250 --> 00:27.110 They take different files such as HTML, CSS and JavaScript, and they render them into a website. 5 00:27.260 --> 00:34.100 But even though most modern websites are created using these three different file types combined together, 6 00:34.100 --> 00:39.540 you can't create a website with just a CSS file or just a JavaScript file. 7 00:39.560 --> 00:43.490 However, you can have just an HTML file. 8 00:43.490 --> 00:48.800 And in fact, that's exactly what the first websites were created with, HTML. 9 00:48.830 --> 00:53.390 Now HTML defines the content and structure of the website. 10 00:53.390 --> 01:00.960 So for example, in this case, all that my HTML file does, is it renders a heading that says, "My website." 11 01:00.990 --> 01:08.640 And when this file is opened by the browser, it will display that heading saying my website. 12 01:08.730 --> 01:11.490 Now what exactly is HTML? 13 01:11.520 --> 01:12.690 Let's break it down. 14 01:12.690 --> 01:16.950 So HTML stands for Hypertext Markup Language. 15 01:16.980 --> 01:20.940 If we look at the first part, Hypertext, what does that mean? 16 01:21.420 --> 01:28.600 Well, it refers to the pieces of text which can link to other documents in the website. 17 01:28.620 --> 01:37.830 So these pieces of text are hypertext or hyperlinks, and they are the foundation of how an HTML website 18 01:37.830 --> 01:38.580 works. 19 01:38.610 --> 01:46.560 Now, if we take a look at the world's first website created by Sir Tim Berners-Lee, who also happens 20 01:46.560 --> 01:52.040 to be the inventor of the Internet, then you can see it's filled with these hyperlinks marked in blue. 21 01:52.050 --> 01:54.600 And exactly as you would expect, 22 01:54.600 --> 02:01.710 if you click on any of these hyperlinks, it takes you to another document, another HTML file. 23 02:01.740 --> 02:06.600 So if we go back, you can see that we were on Project.html. 24 02:06.600 --> 02:14.880 And if I click on one of the hyperlinks like, "How can I help?" it will take me to another HTML file, and 25 02:14.880 --> 02:16.650 this is how hypertext works. 26 02:16.650 --> 02:22.260 And there's even a link on this website explaining exactly what hypertext is. 27 02:22.290 --> 02:28.080 So now that we know what hypertext is, what about the other part, the Markup Language? 28 02:28.080 --> 02:29.910 What is a markup language? 29 02:30.300 --> 02:36.870 Now, if you look at the English language, we often see little bits that function very similar to markup, 30 02:36.960 --> 02:38.970 like these double quotes. 31 02:39.000 --> 02:45.690 The presence of these quotation marks is what tells a reader that this part is a quotation. 32 02:45.690 --> 02:54.480 And as you'll find, this is going to be really similar to what you see in the editor's review of manuscript. 33 02:54.480 --> 03:01.830 So used to mark them up and show different things, such as, for example, which parts need to be bold 34 03:01.850 --> 03:09.830 by adding a squiggly line underneath it, and which parts need to be underlined by adding a straight line 35 03:09.830 --> 03:10.490 through it. 36 03:11.060 --> 03:15.230 So how do you do markup with HTML? 37 03:15.260 --> 03:19.670 Well, it's done through what's called HTML tags. 38 03:19.700 --> 03:25.040 Now, in the early days of the Internet, there were only very few HTML tags. 39 03:25.160 --> 03:31.310 These days there are loads more, but realistically, you're only going to be using some of the most 40 03:31.310 --> 03:38.700 important ones such as headings, h1 through to h6, or the paragraph tag, the p tag. 41 03:38.720 --> 03:44.570 So here you can see all of the HTML tags, but when we narrow it down to the ones that you actually 42 03:44.570 --> 03:47.810 need to know, then it makes it a lot more approachable. 43 03:47.930 --> 03:52.610 And in the rest of the course we're going to be covering some of the most essential tags, 44 03:52.610 --> 03:55.400 and so don't worry about learning them. 45 03:55.400 --> 03:58.950 So don't worry about memorizing all of them or learning them, 46 03:58.970 --> 04:03.690 we're going to cover them as we need them in our projects and in our exercises. 47 04:03.870 --> 04:11.610 So in the next lesson, we're going to get started by learning about the heading tag (h), one of the most 48 04:11.640 --> 04:14.940 OG HTML tags that ever existed. 49 04:14.940 --> 04:18.360 So for all of that and more, I'll see you on the next lesson.