XHTML and CSS Tutorial - 3 - body and headers Video Lecture | Learn Website Designing with XHTML and CSS - Software Development

what is going on guys it is Bucky and
welcome back to your third xhtml
tutorial so in the last tutorial what we
did is we made a very very basic website
this website right here and it doesn't
even have anything in the body all it
has is a dumb old title that says this
is a title sucker
first of all I don't appreciate the
attitude website and second of all we
need to spruce this website up a little
bit and we need to actually add
something
I mean how dumb is this website is just
a white screen pretty dumb huh
so anyways like I said a couple
tutorials ago if you remember a website
consists of two parts all websites the
head which is pretty much all the
information that you don't see but the
browser needs such as the title keywords
for search engines all that good stuff
and the body now we didn't even add a
body yet but body is the part where all
the images all the links all the
paragraphs all that stuff so let's go
ahead and build a body right now so we
can actually have something to look at
other than just a blank white nothing so
anyways in order to create the body of
your website here's what you need to do
outside of your head but still inside
that HTML give yourself some space to
work first of all and go ahead and type
the body tags now in order to create
body tags less-than and greater-than in
the key word for this is body and to end
your body less than greater than forward
slash body so my forward slash shouldn't
pick up there we go body just like that
now anything we type in here is going to
appear in the body of our website so
let's go ahead and type I am in the body
and let's go ahead and save this and
when you save it and refresh it it
should pop up so now we have some text
in the body it says I am in the body so
that is how we put text in the body but
if all we knew how to do was put Domo
text in the body then you know we are
not very far on our way to opening a web
design business so we need
learn something else and what I'm going
to teach you is one of the most basic
concepts whenever you write articles or
you make titles for your website and
that is how to create a header now if
you're saying all right what the heck is
a header a header is totally different
from the head it so don't even you know
I shouldn't have even pointed that out
because it's probably just going to
confuse me now but a header is pretty
much the title think of like the header
on a newspaper that says like the world
is going to end in 2012 it's pretty much
the title that you would put above a
paragraph so let's go ahead and we'll
keep that I'm in the body but above it
but still in your body we're going to
add something like I said called a
header now let me reiterate this one
more time a header is basically a bold
big title now by default they come in
six different sizes header one header
two header three four five and six
now header one is the biggest title
header two is a little bit smaller and
they keep getting smaller all the way
down to six by anyways let me quit
talking and go ahead and show you guys
an example before I you know before I
confuse it too much so in order to make
a header go ahead and in your tags tape
h1 that's the key tag or key word for
the header now let's go ahead and make
our ending tag and we'll name this h1
now anything we type in between here is
going to be in the header so Sencha
header is going to be like a title let's
go ahead and make like the world ends in
2012 that's a good title that might be
in the newspapers in the upcoming months
so let's go ahead and save this and
refresh and I'll show you guys what a
header is you can see that it's
different than the default text on our
web page because not only is it bigger
but it's are also bolded as well so
whenever you're making titles on your
webpages or you just want some text to
stand out and pop surround it with
header tags and it's going to pop now
let me go ahead
and copy this and under it I'm going to
control V that's how you paste and under
it let's go ahead and change this line
to header two so what we have in our
body right here is we have a big header
a header under it that's slightly
smaller and we have just a regular text
so let me show you guys the difference
between header one and header two let's
go ahead and save this and refresh our
web page and it says BAM the world ends
in 2012
this is header 1 this is header 2 and
this is the regular plain old text that
isn't surrounded by any tags at all so
now you can see the difference a header
makes and the different sizes you get
from having one two and they keep
getting smaller all the way down to 6 so
anyways that is how you create a basic
header and also add basic text in your
body so pretty simple I know but hey we
need this you know a good foundation
before we can you know start adding
images and making cool games and stuff
like that I mean start with the basics
and eventually by the end of these
tutorials will you'll be a pro at
designing websites so anyways thank you
guys for watching and don't forget
subscribe and I'll see you guys next
tutorial