Ready to build your first website? HTML or Hypertext Markup Language is one of the core building blocks of the web. Learn the history of HTML and how it's used to give structure to a webpage. Learn more at https://fireship.io

#webdev #programming #100SecondsOfCode

🔗 Resources

HTML history https://home.cern/science/computing/birth-web/short-history-web
HTML basics https://developer.mozilla.org/en-US/docs/Web/HTML
Watch my Web 1.0 beta short https://youtu.be/ZIv4hb_Swug

🔥 Get More Content - Upgrade to PRO

Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment. 

🎨 My Editor Settings

- Atom One Dark 
- vscode-icons
- Fira Code Font
- MonoLisa Font used for snippets

🔖 Topics Covered

- What is HTML?
- HTML history
- How to build your first website?
- HTML intro for beginners
- How does HTML work
- Document Object Model
2024-02-04T05:37:54.894Z
nova-2
2-general-nova
2024-01-09.29447
30089e05-99d1-4376-b32e-c263170674af
ba75a0ba-77c3-4392-a13a-ba25005ec9d3
0effc1c51b3e57b5c814de444ec92bb4c96ddb5f6554df595e1cae7e277e04d6
67875a7f-c9c4-48a0-aa55-5bdb8a91c34a
deprecated
HyperText Markup Language or HTML is a language that defines the structure of content on a web page.
Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www.
But he needed a a publishing language to display content within it.
So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page.
The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today.
Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly.
The typical HTML element starts with an opening and closing tag.
In the middle, we have content, which might be text or additional HTML elements called children.
The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element.
Summit.
To build your first web page, create a file named index.html.
This file contains a hierarchy of nodes based on the document object model or DOM.
A web page starts with an HTML tag and has exactly 2 children, a head and a body.
The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description.
But notice how the meta element has no closing tag.
Closing tags are generally optional when an element is fully self contained.
The body contains the actual UI for the end user.
We might start with an h one heading followed by a paragraph of content.
To add an image, we use an image tag, which you'll notice is self closing.
Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers.
What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway.
Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked.
HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars.
When you're happy with your code, grab the full file path to the gml file and paste it into any web browser.
Congratulations.
You just built your first website.
This has been hypertext markup language in 100 seconds.
Hit the subscribe button so you don't miss the upcoming sequels.
Thanks for watching and I will see you in the next one.

Speaker 0: HyperText Markup Language or HTML is a language that defines the structure of content on a web page. Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www. But he needed a a publishing language to display content within it. So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page. The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today.

Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly. The typical HTML element starts with an opening and closing tag. In the middle, we have content, which might be text or additional HTML elements called children. The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element. Summit.

To build your first web page, create a file named index.html. This file contains a hierarchy of nodes based on the document object model or DOM. A web page starts with an HTML tag and has exactly 2 children, a head and a body. The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description. But notice how the meta element has no closing tag.

Closing tags are generally optional when an element is fully self contained. The body contains the actual UI for the end user. We might start with an h one heading followed by a paragraph of content. To add an image, we use an image tag, which you'll notice is self closing. Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers.

What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway. Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked. HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars. When you're happy with your code, grab the full file path to the gml file and paste it into any web browser. Congratulations.

You just built your first website. This has been hypertext markup language in 100 seconds. Hit the subscribe button so you don't miss the upcoming sequels. Thanks for watching and I will see you in the next one.
HyperText Markup Language or HTML is a language that defines the structure of content on a web page. Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www.
But he needed a a publishing language to display content within it. So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page. The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today. Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly.
publishing
documentation
languages
multimedia
The typical HTML element starts with an opening and closing tag. In the middle, we have content, which might be text or additional HTML elements called children. The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element. Summit. To build your first web page, create a file named index.html. This file contains a hierarchy of nodes based on the document object model or DOM. A web page starts with an HTML tag and has exactly 2 children, a head and a body. The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description. But notice how the meta element has no closing tag. Closing tags are generally optional when an element is fully self contained. The body contains the actual UI for the end user.
We might start with an h one heading followed by a paragraph of content. To add an image, we use an image tag, which you'll notice is self closing. Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers.
photography
What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway. Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked. HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars. When you're happy with your code, grab the full file path to the gml file and paste it into any web browser. Congratulations. You just built your first website. This has been hypertext markup language in 100 seconds. Hit the subscribe button so you don't miss the upcoming sequels. Thanks for watching and I will see you in the next one.
HyperText Markup Language or HTML is a language that defines the structure of content on a web page. Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www. But he needed a a publishing language to display content within it. So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page. The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today. Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly. The typical HTML element starts with an opening and closing tag. In the middle, we have content, which might be text or additional HTML elements called children. The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element. Summit. To build your first web page, create a file named index.html. This file contains a hierarchy of nodes based on the document object model or DOM. A web page starts with an HTML tag and has exactly 2 children, a head and a body. The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description. But notice how the meta element has no closing tag. Closing tags are generally optional when an element is fully self contained. The body contains the actual UI for the end user. We might start with an h one heading followed by a paragraph of content. To add an image, we use an image tag, which you'll notice is self closing. Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers. What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway. Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked. HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars. When you're happy with your code, grab the full file path to the gml file and paste it into any web browser. Congratulations. You just built your first website. This has been hypertext markup language in 100 seconds. Hit the subscribe button so you don't miss the upcoming sequels. Thanks for watching and I will see you in the next one.
HyperText
hypertext
Markup
markup
Language
language
or
or
HTML
html
is
is
a
a
language
language
that
that
defines
defines
the
the
structure
structure
of
of
content
content
on
on
a
a
web
web
page.
page
Development
development
started
started
in
in
1989
1989
at
at
CERN
cern
by
by
Tim
tim
Berners
berners
Lee,
lee
who
who
had
had
just
just
invented
invented
the
the
world's
world's
first
first
web
web
browser,
browser
World
world
Wide
wide
Web,
web
the
the
origin
origin
of
of
www.
www
But
but
he
he
needed
needed
a
a
a
a
publishing
publishing
language
language
to
to
display
display
content
content
within
within
it.
it
So
so
we
we
chose
chose
a
a
syntax
syntax
based
based
on
on
the
the
standard
standard
generalized
generalized
markup
markup
language,
language
which
which
uses
uses
opening
opening
and
and
closing
closing
tags
tags
to
to
provide
provide
meaning
meaning
to
to
otherwise
otherwise
unorganized
unorganized
text,
text
like
like
h
h
for
for
heading,
heading
p
p
for
for
paragraph,
paragraph
and
and
most
most
importantly,
importantly
a
a
for
for
anchor
anchor
to
to
link
link
to
to
a
a
different
different
web
web
page.
page
The
the
language
language
underwent
underwent
many
many
changes
changes
during
during
the
the
initial
initial
rise
rise
of
of
the
the
Internet
internet
and
and
was
was
standardized
standardized
as
as
HTML
html
5
5
in
in
2008,
2008
the
the
version
version
we
we
know
know
and
and
love
love
today.
today
Modern
modern
HTML
html
contains
contains
tags
tags
to
to
handle
handle
a
a
variety
variety
of
of
different
different
media
media
types
types
like
like
video,
video
audio,
audio
and
and
canvas
canvas
to
to
draw
draw
custom
custom
graphics
graphics
on
on
the
the
fly.
fly
The
the
typical
typical
HTML
html
element
element
starts
starts
with
with
an
an
opening
opening
and
and
closing
closing
tag.
tag
In
in
the
the
middle,
middle
we
we
have
have
content,
content
which
which
might
might
be
be
text
text
or
or
additional
additional
HTML
html
elements
elements
called
called
children.
children
The
the
opening
opening
tag
tag
may
may
also
also
have
have
1
1
or
or
more
more
attributes,
attributes
which
which
are
are
key
key
value
value
pairs
pairs
that
that
can
can
customize
customize
the
the
appearance
appearance
or
or
behavior
behavior
of
of
the
the
element.
element
Summit.
summit
To
to
build
build
your
your
first
first
web
web
page,
page
create
create
a
a
file
file
named
named
index.html.
index.html
This
this
file
file
contains
contains
a
a
hierarchy
hierarchy
of
of
nodes
nodes
based
based
on
on
the
the
document
document
object
object
model
model
or
or
DOM.
dom
A
a
web
web
page
page
starts
starts
with
with
an
an
HTML
html
tag
tag
and
and
has
has
exactly
exactly
2
2
children,
children
a
a
head
head
and
and
a
a
body.
body
The
the
head
head
contains
contains
things
things
that
that
aren't
aren't
directly
directly
shown
shown
in
in
the
the
web
web
page,
page
like
like
a
a
title
title
or
or
a
a
meta
meta
tag
tag
to
to
give
give
the
the
page
page
a
a
description.
description
But
but
notice
notice
how
how
the
the
meta
meta
element
element
has
has
no
no
closing
closing
tag.
tag
Closing
closing
tags
tags
are
are
generally
generally
optional
optional
when
when
an
an
element
element
is
is
fully
fully
self
self
contained.
contained
The
the
body
body
contains
contains
the
the
actual
actual
UI
ui
for
for
the
the
end
end
user.
user
We
we
might
might
start
start
with
with
an
an
h
h
one
one
heading
heading
followed
followed
by
by
a
a
paragraph
paragraph
of
of
content.
content
To
to
add
add
an
an
image,
image
we
we
use
use
an
an
image
image
tag,
tag
which
which
you'll
you'll
notice
notice
is
is
self
self
closing.
closing
Then
then
define
define
the
the
source
source
attribute
attribute
as
as
the
the
file
file
path
path
to
to
the
the
image,
image
and
and
you'll
you'll
wanna
wanna
give
give
it
it
an
an
old
old
description
description
to
to
make
make
it
it
accessible
accessible
robots
robots
and
and
screen
screen
readers.
readers
What
what
makes
makes
web
web
pages
pages
revolutionary
revolutionary
though
though
is
is
their
their
ability
ability
to
to
link
link
to
to
other
other
web
web
pages
pages
on
on
the
the
information
information
superhighway.
superhighway
Use
use
an
an
anchor
anchor
tag
tag
to
to
create
create
a
a
link,
link
then
then
define
define
the
the
h
h
rep
rep
attribute
attribute
as
as
the
the
web
web
page
page
that
that
you
you
want
want
to
to
navigate
navigate
to
to
when
when
clicked.
clicked
HTML
html
also
also
provides
provides
structural
structural
tags
tags
like
like
division
division
or
or
div,
div
which
which
are
are
often
often
used
used
to
to
group
group
elements
elements
together
together
where
where
they
they
can
can
be
be
styled
styled
to
to
represent
represent
complex
complex
UI
ui
elements
elements
like
like
navbars.
navbars
When
when
you're
you're
happy
happy
with
with
your
your
code,
code
grab
grab
the
the
full
full
file
file
path
path
to
to
the
the
gml
gml
file
file
and
and
paste
paste
it
it
into
into
any
any
web
web
browser.
browser
Congratulations.
congratulations
You
you
just
just
built
built
your
your
first
first
website.
website
This
this
has
has
been
been
hypertext
hypertext
markup
markup
language
language
in
in
100
100
seconds.
seconds
Hit
hit
the
the
subscribe
subscribe
button
button
so
so
you
you
don't
don't
miss
miss
the
the
upcoming
upcoming
sequels.
sequels
Thanks
thanks
for
for
watching
watching
and
and
I
i
will
will
see
see
you
you
in
in
the
the
next
next
one.
one
success
The speaker discusses the history and use of hyperText Markup Language, including changes made during the early stages of the Internet and the development of HTML 5. They provide instructions on how to create a web page using a syntax based language, including opening and closing tags and creating a hierarchy of nodes for media types. The speaker also explains how to link to other web pages and offers a full file path for a YouTube video.
HTML in 100 Seconds
HyperText Markup Language or HTML is a language that defines the structure of content on a web page. Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www. But he needed a a publishing language to display content within it. So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page. The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today. Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly. The typical HTML element starts with an opening and closing tag. In the middle, we have content, which might be text or additional HTML elements called children. The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element. Summit. To build your first web page, create a file named index.html. This file contains a hierarchy of nodes based on the document object model or DOM. A web page starts with an HTML tag and has exactly 2 children, a head and a body. The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description. But notice how the meta element has no closing tag. Closing tags are generally optional when an element is fully self contained. The body contains the actual UI for the end user. We might start with an h one heading followed by a paragraph of content. To add an image, we use an image tag, which you'll notice is self closing. Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers. What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway. Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked. HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars. When you're happy with your code, grab the full file path to the gml file and paste it into any web browser. Congratulations. You just built your first website. This has been hypertext markup language in 100 seconds. Hit the subscribe button so you don't miss the upcoming sequels. Thanks for watching and I will see you in the next one.
The speaker discusses the history and use of hyperText Markup Language, including changes made during the early stages of the Internet and the development of HTML 5. They provide instructions on how to create a web page using a syntax based language, including opening and closing tags and creating a hierarchy of nodes for media types. The speaker also explains how to link to other web pages and offers a full file path for a YouTube video.

        [INST]
        You are youtuber called Fireship you make engaging high-intensity and entertaining coding tutorials and tech news. 
        you covers a wide range of topics relevant to programmers, aiming to help them learn and improve their skills quickly.
        
        Given the title of the video : HTML in 100 Seconds 
        and a small summary : The speaker discusses the history and use of hyperText Markup Language, including changes made during the early stages of the Internet and the development of HTML 5. They provide instructions on how to create a web page using a syntax based language, including opening and closing tags and creating a hierarchy of nodes for media types. The speaker also explains how to link to other web pages and offers a full file path for a YouTube video.
        [/INST]
        
        Generate the video : HyperText Markup Language or HTML is a language that defines the structure of content on a web page. Development started in 1989 at CERN by Tim Berners Lee, who had just invented the world's first web browser, World Wide Web, the origin of www. But he needed a a publishing language to display content within it. So we chose a syntax based on the standard generalized markup language, which uses opening and closing tags to provide meaning to otherwise unorganized text, like h for heading, p for paragraph, and most importantly, a for anchor to link to a different web page. The language underwent many changes during the initial rise of the Internet and was standardized as HTML 5 in 2008, the version we know and love today. Modern HTML contains tags to handle a variety of different media types like video, audio, and canvas to draw custom graphics on the fly. The typical HTML element starts with an opening and closing tag. In the middle, we have content, which might be text or additional HTML elements called children. The opening tag may also have 1 or more attributes, which are key value pairs that can customize the appearance or behavior of the element. Summit. To build your first web page, create a file named index.html. This file contains a hierarchy of nodes based on the document object model or DOM. A web page starts with an HTML tag and has exactly 2 children, a head and a body. The head contains things that aren't directly shown in the web page, like a title or a meta tag to give the page a description. But notice how the meta element has no closing tag. Closing tags are generally optional when an element is fully self contained. The body contains the actual UI for the end user. We might start with an h one heading followed by a paragraph of content. To add an image, we use an image tag, which you'll notice is self closing. Then define the source attribute as the file path to the image, and you'll wanna give it an old description to make it accessible robots and screen readers. What makes web pages revolutionary though is their ability to link to other web pages on the information superhighway. Use an anchor tag to create a link, then define the h rep attribute as the web page that you want to navigate to when clicked. HTML also provides structural tags like division or div, which are often used to group elements together where they can be styled to represent complex UI elements like navbars. When you're happy with your code, grab the full file path to the gml file and paste it into any web browser. Congratulations. You just built your first website. This has been hypertext markup language in 100 seconds. Hit the subscribe button so you don't miss the upcoming sequels. Thanks for watching and I will see you in the next one.
        