Website Design Part 1


Learning HTML

First of All, Websites Are made of “Tags”and tags are pretty much the pieces of a Website,so for example if u wanted to put a picture on your website you would need a Picture Tag,if you wanted to put
a link your site your would need a link Tag etc. So Pretty much a Website is a Bunch of Tags Combined to make a Website page,so to make a Tag, here is the basic layout of it

<the name of your tag> Example:<p>:this is a Website Paragraph tag

Some other tags

<img> Image tag

<p> Paragraph Tag

<html> </html> HTML Tags

<h1>
<h2>
<h3>
<h4>
<h5>
<h6>






So lets go on and create Our First tag
Now I for one will not get in depth with the Next tag. Mostly because the next tag is just a Formality,its needed on every page(well you Actually Don’t need it at all but if your Creating a Website For a Client Then Yes u would need it) Now lets start the tag is Call the !doctype tag:This is the tag that tells your Browser What kind of Document is trying to read.



Now The Basics of every/any website are the HTML Tags,Your Entire Website is Going to be Among your HTML tags ,so go a head and make the HTML tags(<Html> </Html>)




Now as you can plenty see we have two HTML tags that are Slightly Different now u might be saying to your self,WTF?

Well First of all the HTML tags pretty much Tells your Browser that you are about to Create a Website and that Everything that Write Among the Html tags Would be on your Website,

<HTML>:This Tag means that your going to start Here

Anything that you Put Here Would Be On Your Website!!

</HTML>:and This Tag Means With the little Forward Slash”/” means that you will end here


Now that you know the basic layout of a tag, lets Explore a Little bit Deeper,now Every website that you been to its made up of Two parts:the head and the Body

Head: This is where all the Browser information goes, All the Technical Stuff that you don’t see when you go to the Web page Which include maybe some Keys words For Research engines,the title and all These stuff.

Body:Now that stuff that you can see such as Paragraphs,images and text all this goes on the body.

Ok now so now lets Create a Head tag Among our HTML tags,now anything that you write Between the head tags will be on your website Head 



As I hope that you can recall some of the stuff that u can put on your head is the title so Lets Create a Head tag Shall we

By this time you might have notice that everything goes kind of inside one another like a Sandwich
the title tags goes inside the Head tags and the head tags goes inside the HTML tags,and that’s because you need to embed tags within one another, you cant criss cross,everything needs to be within one another. That way your Browser knows your title goes inside your head tag and the entire thing goes inside your website. So if you were to put the Title tags Outside the HTML tags you would probably get a Error Message.

Ok now Lets Preview our website


Write something among the Title tag Like um, Best website ever 


Now save it as index,make sure that you save as type Hyper text Markup Language(HTML) ,



Save it to your Desktop



and click it






Body And Header

Body:Stuff that you can see such as Paragraphs,images and text all this goes on the body.
Now lets Create a Body tag (<body></body>)


Now anything that you type Between the body tag its gonna appear on the body of your website.

Lets Give it a try

Type among the body tags um Whatever you want

Save it And Click it,you should see this


So thats pretty much how you A locate Text on the body,but if only knew just how to put you know dumb old text on the body then you know we are not very that far from Creating a Good and Professional Website



Ok now Lets talk about the header ( NO the header is not the same as the Head),now Think about the Header as the header of a News paper

So pretty much the Header is the title that you would put above a paragraph.so pretty much a header is a BOLD big title, and by default they come in 6 different Sizes: Header one is the Bigger and Header one is the smallest.

Header1:<h1> </h1>

Header2:<h2> </h2>

Header3:<h3> </h3>

Header4:<h4> </h4>

Header5:<h5> </h5>

Header6:<h6> </h6>

Iam gonna show you what Each Header looks like





Cool huh :)



Now lets add a Header1 Tag




Now lets save it and see what a Header looks like




Paragraphs and Line Breaks

Paragraphs are chunks of text that makes Articles.Now you might be asking yourself Why Do I need a Paragraphs Tag When I just can Write the text that I want to be shown on my site on my body.Well lets Text your Theory Shall we?

Save it and Preview it
Now you must be like SH%^&* WTH is going on,i wanted to make Three different Paragraph lines NOT A Sh$%&TY single line! >:O

Well my Young one 

PART Two Coming SOON  

1 comments:

David said...

Part two coming soon!

Post a Comment

top