Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
HTML is understood by all browsers, from browsers on phones to tablets to desktop computers. That's why every website and web app you use is made using HTML -- it's the language of the web!
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
A typical webpage is made up of three
separate layers that work together to
0:05
deliver an experience to the user.
0:09
There's a content layer, or
the information you see on the page,
0:11
a presentation layer that handles
how that information looks, and
0:15
a behavior layer that lets
users interact with that page.
0:19
CSS or Cascading Style Sheets,
provides the presentation layer and
0:22
creates the visual style of webpages,
using colors, typography, layout and more.
0:27
The behavior layer is
handled by JavaScript,
0:33
to add interactivity to the page.
0:35
For example, popping up a larger image
when a user clicks a small image.
0:37
HTML or HyperText Markup Language
provides the content layer and
0:41
forms the structural
foundation of a webpage.
0:45
It's the language common to every website.
0:48
So if you wanna build your own website,
web application, or
0:51
know how to edit other websites and
apps you'll need to understand HTML.
0:53
I'm Guil, your front end web
development teacher here at Treehouse.
0:58
Your journey into learning code
begins here with HTML basics.
1:01
You may have already worked with HTML or
seen it in action in a previous course.
1:04
So in this course,
1:09
we're going to dive deeper into
many of the core concepts of HTML.
1:09
So first, let's break down
the meaning of the initialism, HTML.
1:13
Hypertext Markup Language.
1:17
Hypertext is any text that can be
displayed on a computer screen and
1:20
contains links to other texts,
or hypertext documents.
1:23
The web is a collection of billions of
documents, interconnected by hyperlinks.
1:27
For example, the page you're viewing
right now is a hypertext document and
1:31
you most likely clicked on
a hyperlink to get to this page.
1:36
A markup language provides meaning to
text in a document using instructions
1:39
that describe how text should be
structured, formatted, and laid out.
1:44
So HTML is a markup language the browser
uses to present information to users,
1:47
like text, links, images, and videos.
1:52
It's the basic component
from which all websites and
1:54
applications on the web are built.
1:57
Let's quickly review how HTML works,
what it looks like, and
1:59
why we use it to structure
content on the web.
2:03
If you've worked with word processing
program like Microsoft Word or
2:06
Google Docs,
2:09
you've likely formatted blocks of
plain text by creating a title for
2:10
the document and headings to indicate the
start of important sections of content.
2:14
Also adjusting the size of text and
making it bold, so
2:19
that it stands out from other text.
2:22
You may have inserted links to
other documents or webpages, or
2:24
you've inserted line breaks, spaces,
and horizontal lines to divide and
2:28
break up sections of content.
2:33
In other words,
2:34
you used the program's formatting options
to give the document a clear structure.
2:35
HTML provides similar text formatting
instructions to browsers in the form of
2:39
tags called markup.
2:44
So just like a Word or Google document
with no formatting will look like this.
2:46
A webpage without HTML tags or
markup would look like this.
2:51
Now here's the same content displayed
in the browser using markup.
2:55
Notice the text on the page
is easier to scan and
2:59
understand, and it provides links to
navigate to other pages and more content.
3:02
If I right or Ctrl+Click on the page and
click View Page Source,
3:08
I'm able to see the HTML the browser
uses to display this simple webpage.
3:12
Now take a look at the sets of
tags that surround the content.
3:17
That's the markup responsible for
displaying this page.
3:21
And notice how even though these
tags are meant as instructions for
3:24
the browser, they are named using
friendly, human readable words,
3:29
like title, body, header, main and footer.
3:34
HTML is understood by all browsers,
3:37
from browsers on phones to
tablets to desktop computers.
3:39
That's why every website and
web app you use is made using HTML.
3:42
It's the language of the web, and
I'm going to teach you how to write it.
3:46
By the end of this course, you will have
learned the skills to create the HTML
3:49
structure of a simple website
about virtual reality, like this.
3:52
And as I mentioned before,
HTML is just part of what makes a website.
3:56
Adding a bit of CSS can transform
the structure of a page into
4:00
something beautiful, like this.
4:02
So let's get started.
4:05
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up