Lesson Monday

Many people think that creating a web page involves really complicated code that requires extensive studying to understand. This is not necessarily the case. In the next lesson we will make a simple web page together. But before we do that let's quickly go over what the World Wide Web is in a nutshell.

The web is made up of mostly text files - like the ones you created to write your papers in high school - as well as some other files like images or videos. These files are stored on computers that are linked together over networks. When you put a web site's address into your browser, you are really just asking to see a particular file, or combination of files.

We've already had a bit of a taste of a basic HTML file with our Hello World and Goodbye web pages. Now, we're going to focus on the basics of HyperText Markup Language or HTML that we previously just cut and paste into our pages.

It looked a bit like this in Atom:

example.html
<h1>HTML lesson</h1>
<h2>For Epicodus</h2>

<p>The goal for this lesson is to show how simple HTML is to read and write by displaying a text written in HTML and what it looks like when it is displayed in a browser.</p>

and like this in our browser:

HTML lesson

For Epicodus

The goal for this lesson is to show how simple HTML is to read and write by displaying a text written in HTML and what it looks like when it is rendered in a browser.

HyperText, the "HT" of HTML is a nerdy word for a link. The "ML" of HTML stands for markup language. As we can see in the example above, the text in the HTML file is normal text that is marked up with instructions written inside of these <>, known as angle brackets. The actual language of HTML is all of those instructions that we wrap around the text to format it and as we'll see, many other instructions for things like images, links, videos and more.

Let's start writing our first HTML!

Terminology


  • Hypertext: Another word for a link.

  • Markup language: A system for adding distinct instructions for how text should be formatted. HTML is an example.

  • Angle brackets: The symbols < > that are used in HTML to indicate instructions for the browser.