Wednesday, May 2, 2012

Beginners guide to building a website

Hi everyone, in this beginners guide to building a website I'm going to explain some very basic things you will need to start learning how to build a basic websites. I will be posting many different tutorials and tips so if you follow along I'm sure you will not have any problems to build a website on your own. Don't expect you can learn to do this in a day or something like that. I've seen many e-books and stuff that say you will learn CSS or HTML in a 30 minutes or something like that. Let me make it clear for you, DO NOT buy anything like that, it's just a big fat lie.

Things you will need to start building websites

First of all, every piece of code you will write in some kind of text editor. There are really plenty of text editors you can use to write code, let me recommend some for you. Best one for beginners is really Notepad++, it has great features that will help you write the code and best of all it's FREE! So I wont really bother to recommend any other free editor because this one is most popular and will do the job for you perfectly. If you maybe have some money to spend on this, from the paid ones I like Adobe Dreamweaver the most. It's advanced editor for developers and you can do lot of stuff with it.

So I have the editor now, what do I write in it?

So let's start with some basic things. You can simply start with making a new document in your editor and save it with .html extension. So now you have your HTML page. Open it with your editor and let's start with some basic tags every HTML document need to have. Tags are used to define how will browser display and format the website content. Every tag have it's opening and closing. They are called opening and closing tags. For example <title> is the opening tag, and </title> is the closing tag. You noticed that only difference is  "/" before word "title" in the closing tag. There are 4 essential tags that every HTML document need to have:
  • <html> </html> 
  • <head> </head>
  • <title> </title>
  • <body> </body>
<html> </html> - Defines a document and telling the browser where is the page start and end. Contains every other tag in our document.

<head> </head> - Contains some information about our document that will not be displayed on the page. For example in the header tag we will place links to our CSS files, external scripts, meta tags, title tag, link to the favicon...etc.

<title> </title> - This defines the title of our document that will appear on the title bar on the browser. This tag must be placed inside the head tag or otherwise it won't work.

<body> </body> - Used to display all actual content on your website, so all images, paragraphs, links and other content that will be visible to user must be placed inside the body tag.

Now when we know what all of these essential tags do, let's make a example document with the "Hello World" title and simple sentence inside the body tag.

    <title>Hello World!</title>
     This is my first webpage!

So this is pretty simple webpage we have here, but hey this is the beginners guide to building a website and I'm sure you are happy because you learned how and where to start, and I hope this will motivate you to learn further and become the expert in this! I recommend you to visit w3schools where you can find all other HTML tags and learn how to use them. Thanks for reading, I hope I helped!


Post a Comment