XHTML and CSS Tutorial - 7 - Creating a Link Within a Web Page Video Lecture | Learn Website Designing with XHTML and CSS - Software Development

what's going on guys it's Bucky and
welcome back to your seventh XHTML
tutorial in this tutorial we're going to
be learning how to do is create a link
within the same page
so saying are a Bucky you are an idiot
why would I want to click a link that
takes me to the same page where I'm
already at why can't I just hit refresh
if I was just going to do that well this
is helpful for one main reason if you
have a really long website and you don't
want that you don't want to have the
users scroll down looking for whatever
piece of information they need on that
website you can create something like a
table of contents or a directory at the
top and then they click whatever
information they want and it just shoots
them down to whatever they were looking
for so before this tutorial what I did
is I went and grabbed a bunch of random
information this is actually the rules
for my forum if you ever get a chance to
check it out the new boston.com slash
forum
plug plug and I you know you can use
whatever you want but I just needed a
lot of text so as you can see this is a
pretty long web page and if the user was
looking for something on here you don't
want to have them you don't want to make
them go to your website and scroll down
maybe I get you find whatever
information you're looking for
this is 2011 we don't have time for that
I want my data right now biatch so let's
go ahead and create a navigation system
where it makes it easier for the user so
the first thing that we need to do is
write alright where do we want our
target to be so let's go ahead and do
this let's go ahead and make a link at
the top that says farming or something
and when they click it it shoots them
right down to this section and maybe
we'll create another one that says caps
and when they click that it shoots them
right down this section though so they
don't have to scroll through looking for
at all so in order to link to this
section of our webpage we need to create
a target a way of saying this is where I
want to link so in order to do that go
in your code where it says post count
farming and go ahead and add your
anchors
and take note you don't need anything in
between these anchor tags because we're
not really linking to anything this is
just the destination where we want to
end up so anyways in your first a tag
what you need to do is that is this you
need a name for your target that way if
you have a bunch of different targets on
your webpage your browser knows what
when you're talking about so instead of
href like before this attribute is
called name and set this equal to
whatever name you want I'm just going to
name mine farm because I mean this is a
section about post count farming so why
not name it farm simple enough so go
ahead and write a name equals farm so
now we have the destination this is the
destination where we want to end up now
in order to link to that destination
here's what we need to do at the top of
your page or wherever you want go ahead
and add your anchor tags a your ending
anchor tag and write something in
between like farming section now
whenever they click this it should take
them to the farming section but in order
to link to this section you need to do
something weird remember that href
attribute that took you you know to
other pages like Google or something
well instead of writing the name of a
website what we can do if we want to
link to a different section of the same
website is write the pound sign and then
write whatever name the anchor head so
that name was farm so let's go ahead and
name that farm so again let's go ahead
and save this and I'll show you guys how
it works before so let's go ahead and
refresh and now we have a link at the
top that says farming section and
whenever we click it it takes us right
down to the section of post count
farming so we don't have to scroll all
the way back there just click it and it
takes us there pretty sweet huh so let
me go ahead and do this one more time
with a different section until it really
sticks in your brain so let's go ahead
and link to this advertising section why
the heck not so let's go ahead at
my tags first and is this name I'm going
to set name equals ad s for ads so now
let's go ahead at the top here and let's
go ahead and make another a a ads
section up ad and now is HR F for this
or is the destination for this go ahead
and write pound sign ads because
remember the name of this target was ads
so now let's go ahead and save this bad
boy hopefully I didn't mess anything up
refresh and check this out whenever we
want to go to the farming section click
farming section it takes you to farming
whenever we want to go to the add
section click Add section it takes it
advertising how sweet is that a nice
little navigation bar at the top to link
to a you know different places on our
website so again the thing I just want
to recap one last time you don't need
any link right here because this is just
a destination we're not making a look
itself we're just making the end
destination what you do need a link for
is this at the top section the
navigation bar the place where you click
that's where you need to make the links
and in order to do that
use your href attribute and for the
destination put pound sign which pretty
much means somewhere on my website and
the name whatever you name to that
keyword so that is basically how do you
create a link within a web page and
that's why it is useful so don't forget
anytime you create a long web page and
you don't want to annoy the user this is
the system that you need to set up so
anyways thank you guys for watching
don't forget to subscribe don't forget
to check out my other videos and I will
smell you guys later