WeLCoMe To PRo$aCKsNeT

Welcome to prosacksnet. Here we share everything about knowledge that are applicable and usable around us. If you have anything to share, feel free to contact me via email. Till then...^_^

Basic HTML Tutorial: Introduction

For these time, I will share with all of you a simple lesson on how to make a Webpage. I must warn you though, this is for "all wet behinda ears" Newbies. If you're at all experienced at this sort of thing, you'll probably find this tutorial a bit of a yawner.

Learning Theory

There is more than one type of learning. A committee of colleges, led by Benjamin Bloom (1956), identified three domains of educational activities

HTML Templates: Fizik UM

This Website were created for physics department university of malaya

Wordpress Templates: Wallbase

This Templates were created for the wedding

Saturday 26 November 2011

Basic HTML Tutorial: Lesson 2

Back to Lesson 1


For lesson 2, we will proceed on how to put something on the html board. In previous we learn about html tag, head tags and also title tags. 


Today another new tag will be preview which is called <BODY> tags, usually it located after the <HTML><HEAD> & <TITLE> tags. Needless to say, keep these in your document.


<HTML>
<HEAD>
<TITLE>ape-ape aje</TITLE>
</HEAD>

<BODY>
</BODY>
</HTML>


Then, type "something really cool." and between the body tags:-

<BODY>
Something really cool
</BODY>

Whenever you make a change to your document, just save it, then hit the Reload button on your browser and you will see the result as below on your webpage file.

Something really cool

Now, we already know what is the use of the body tags. So, let's go further in it. I think the first thing we are going to learn is how to change background colors. So, this is how to change your background color:-

<BODY BGCOLOR="#F0F0F0">
Something really cool
</BODY>
Something really cool


FFFFFF is basic HTML color for white. For more color, you can refer here.

You can find more color later. Usually the browser can read almost all the color coding. Additionally if a background color is specified that is not one of these colors, then browser will usually pick the closest of these colors to use. 


Other than that, you also can specify a background image instead of color. For example, choose any images you want and put it in your website folder. Then, put your address of your images into the body like this:-

<BODY BACKGROUND="../yourfolder/swirlies.gif">
Something really cool
</BODY>

Save your html file and refresh the browser. You will find your images will located at background of your webpage. And one more thing, please make sure that you don't put space any folder's name or any name for your file or else, the reading will be error.

Ok, that's all for today's lesson. In the next lesson, we will learn how to change font in your webpage.

Till then ^_^

Go to Lesson 3

Friday 25 November 2011

Basic HTML Tutorial: Lesson 1

 Back to Introduction

Ok, the lesson 1 begin now. Just as I told in previous, we just using a notepad. So, open your notepad and type the following text:

<HTML>
</HTML>

Each one of those is called a tag. There is a starting tag and a closing tag. To make a closing tag just add a / to the starting tag. Most, but not all tags have a closing tag.

Think of tags as talking to the browser, or better yet giving it instructions. What you have just told the browser is 'this is the start of a HTML document' (<HTML>) and 'this is the end of a HTML document' (</HTML>). 

Now we need to put some stuff into it.



Every HTML document needs a pair of HEAD tags.
<HTML>
<HEAD>
</HEAD>
</HTML>



The only thing we have to concern ourselves with in the HEAD tags (for now) are the TITLE tags.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
</HTML>



And the bulk of the page is going to be within the BODY tags.


<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>


Oh, and one more thing, give your document a title.

<HTML>
<HEAD>
<TITLE>My big ole bad page!</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>

Now save it, not as a text document, but as a html document. Save it as page1.html in a new folder somewhere. If you a little fuzzy about how to do this then here's what you do.

In your Notepad window click "File" then "Save as".


Where it says "File name:: type in "page1.html" Where it says "Save as type:" make sure it says "All Files(*.*)".

Hit save and you're done!

Congratulations! You are the proud parent of a fully functional Web Page! You could upload it to a server and the whole world can see your creation! If you still don't have your server, just open your saved file with your web browser(Mozilla, Opera etc) and you website should look like this.

(this is an example when you open it using chrome)


You can double click on it now and see the results of your handiwork.

Unfortunately, as you can see, the page is just a little bit blank (but it is still a legitimate HTML document!).

Next lesson we will start learning to put some stuff in your page. Two quick points before we go on to lesson 2:-
  1. What you made is a skeleton HTML document. This is the minimum required information for a web document and all web documents should contain these basic components. 
  2. The document title is what appears at the very top of the browser window.
Till then ^_^

Basic HTML Tutorial: Introduction

Hello. I'm prosacks. For these time, I will share with all of you a simple lesson on how to make a Webpage. I must warn you though, this is for "all wet behinda ears" Newbies. If you're at all experienced at this sort of thing, you'll probably find this tutorial a bit of a yawner.

You'll be happy to learn that it's really pretty simple. The basic idea is this: A web page is nothing more than a file, a HTML file to be exact. It's called HTML because web page documents have the file extension .html or .htm. HTML stands for Hyper Text Mark-up Language.
Prosacks,
Just wanted to drop you a line to let you know how much I enjoyed your tutorials. After reading your tutorials, I bailed on my old web site which was done with *** and started my own from scratch with notepad. It was like crawling out of a 5 gallon bucket. I now can do exactly what I want.
Thanks,
Adam


Let's get started. First, if you have any of them fancy HTML editors and have an inkling to break em in now, just forget it. The worst way to learn is to use one of those things. (Although there are a few that you will find helpful, they'll only help you once you learn the basics, so don't even worry about it now.) What's the best way to learn HTML?? Dreamweaver???Fireworks???Webeditor????No, no, no, the best way to learn it is just using Notepad. I know, I know, you maybe thinks that this is ridiculous. Just trust me on this one. K? 

Another tool you'll need is a browser to view your web pages. You can choose any browser you like but I strongly recommend Mozilla Firefirox or Google Chrome. If you're using something else, it should be OK for most things, but you may be somewhat limited. 

With that out of the way I can say with confidence that you are less than 5 minutes away from making your first web page! So..We will proceed to lesson 1.

WeLCoMe To PRo$aCKsNeT

Welcome to prosacksnet. Here we share everything about knowledge that are applicable and usable around us. If you have anything to share, feel free to contact me via email. Till then...^_^