First Webpage: Intro to HTML

First Webpage: Intro to HTML


hi my name is dr. raypastore and today
I’m going to talk to you about creating your first webpage or you know beginning
HTML how do you start what’s the first thing you do alright so the first thing
you need to do is you need to open up some kind of place to actually create
your webpage so see notepad here it comes free on all your PC’s open up
notepad you can use notepad to do what I’m going to do if you’re on a Mac you
can use their so there’s a text program open up the basic default text program
on the mac i’m going to use dreamweaver just because it’s a little easier for my
example but i can do it you can do exactly what I’m doing in notepad
alright so I’ve actually written my first HTML page right here you can see
the code and I’m going to explain what this is so let’s actually get rid of
this code I’m just going to cut it for now and then i will explain it all right
so the first thing that you see at the top of my page is called a doctype what
this does is this actually isn’t really HTML code this is a doctype which tells
my browser what version of HTML i’m using so if i’m using like an older
version like HTML 4 or something i’m going to have a different doc type this
is the doctype for html5 so I’m telling my browser I’m using the latest version
of HTML so you can see with the code is so when you write your first HTML page
you write this simply at the top of the page all right next we have our head so
really we’re beginning the HTML page so the first thing we’re going to do is I’m
going to write HTML now every time you create a tag in HTML you need to close
it so I’ve written HTML so I’m starting this HTML page and I’m going to close it
and one of the reasons i’m using Dreamweavers because it automatically
fill some of this in you can see that I close it with this / here close it with
this / so open close now the first thing we do the first tag we’re
right in HTML is our head tag but we technically don’t need this tag but
we’re just going to do it for good practice and what do we do we close it
every time we create a tag we close it so our head tag the point of the head
tag is that this isn’t information that the user is going to see this is
information that we’re going to tell the browser so we talk start talking about
like SEO like search engine optimization and things of that nature we start
talking about CSS or JavaScript we’re going to put a lot of that in this head
tag you’re not going to do anything with it for now as a beginner with your first
stage but you’ve got to get used to just including it next tag we’re going to
create is the body tag notice I open it and I closed the body tag and I’m
actually going to put it over here and one of the things you can start to do is
actually use tabs so that I know that everything is in my HTML tag all right
so the body tag is actually where we this is everything the user is going to
see um I’m not going to create anything in there right now I’m just going to
type some sample text in my next tutorials I’ll start showing you how to
use the paragraph tag and other things like that how to start using CSS so that
you can actually put more stuff in there but for now I just want you to see that
you’ve created a basic web page all right so it simply says sample text and
that’s just in my body tag here I’m going to go to file save as this is what
you would do in notepad you would save it I’ve created a folder where I’m just
going to put this okay now saving it notice it by default saving it is
untitled one dot HTML I can call this anything I want to but you have to have
dot HTML as the end now usually when creating a website your first webpage so
like my website is rapist or calm or you google.com or whatever calm it is that
page is called the index page so i would actually save it as index.html so if i
was putting this on my server rapist or calm and i wanted this to be the page
that user saw when they typed in rapist or calm I would name it index.html
otherwise if I named it like sample HTML the users would have to go to rape a
store calm / sample HTML that index files automatically recognized as the
default one so by just good practice is to always say that first name page as an
index page I’m going to click Save and now let’s look in that folder we’ve
created in HTML page and I can open it up I can just simply click on it and
look here’s our sample.txt we’ve created a web page now this isn’t on the web
I’ll show you how to do that in another tutorial but we’ve created a web page
that’s going to open in any browser and what’s interesting so here’s our sample
text you can see it’s opened up in Firefox I can right click on this and go
to view page source and I can see that code that I typed I can see how the
browse our outputs it make sure it’s the same isn’t that it looks in Dreamweaver
or notepad and that’s the intro that’s how to create your very first web page
thank you

Daniel Ostrander

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *