Building Your Own Website - Web Money Guy

Building Your Own Website

Learn how to build your own website easily with these steps. You can have your website up and running in less than an hour!

EASY Way To Build A Website:

Build A Website Easily With Bluehost. If you want a quick and easy way to create your website, you should look for a website builder, that lets you create your site click-by-click. Bluehost offer such a serivce with their free website builder. Bluehost is probably one of the best hosting solutions around for both amateurs and professionals.

If you don't already have a domain, go to www.Bluehost.com and select their shared hosting solution (less than $5 per month for the Hatchling account. However, I recommend you go with either the Baby account or the Swamp account).

How to select a good domain name for your website? For small sites such as the sites we're about to make, it's probably a good idea to put keywords inside your domain name. For example, if you're creating a website about office furniture, then your domain could be www.bestofficefurniture.com or something similar. Think of your target customers and your overall marketing strategy when finding your domain.

Bluehost provides a 45 Day Money Back Guarantee so if you decide to change to another host later, then there's no problem to do so.

Go to Bluehost

Although web builders are a quick and easy way to build a website, they also have their drawbacks. To get maximum control over your website you will have to build your website yourself.

ADVANCED: Building A Website Yourself

Now, we're not going to give you another HTML guide or CSS tutorial. You can find thousands of them for free online. What we're going to do is to briefly walk you through how you build a website on your own, and gradually how to use more advanced techniques.

We're going to start with the basics of building a website, and then move on to more advanced programming and methods.

Hosting and domain

You need a place to store your website (hosting), and you need an address for it (domain). You can buy a domain from a domain registrar and hosting from a hosting company. I recommend you buy both your domains and your hosting from Bluehost. If you want to learn more about hosting, see the bonus article about hosting.

Sketchup and Structure

Before you begin to develop your website, it's always a good idea to think about the websites structure and presentation in a roughly manner.

For example, this could be a sketch for a membership site:

You would also want to think about the structure of your website. For example, here's is a structure of some random website:

You should always start with the final result in mind when building websites. How will it look? How can you navigate the site? What will the site do for your users? What will you gain from building and maintaining this site?

Web Editors

Before you can begin to write any code you will need some software. You probably have one tool installed on your computer already. It's called notepad and are integraded in all Windows systems. However, this tool lacks a lot of functionality.

I recommend that you use Adobe Dreamweaver, which is by far the most popular software for developing webistes for professional web developers.

If you want a free alternative you could use NUV. NUV enables WYSIWYG editing of pages, making web creation as easy as typing a letter with your word processor. Furthermore: Integrated file management via FTP. Simply login to your web site and navigate through your files, editing web pages on the fly, directly from your site; Reliable HTML code creation that will work with all of today's most popular browsers; Jump between WYSIWYG Editing Mode and HTML using tabs; Tabbed editing to make working on multiple pages a snap; Powerful support for forms, tables, and templates; The easiest-to-use, most powerful Web Authoring System available for Desktop Linux, Microsoft Windows and Apple Macintosh users.

Advanced users may prefer either UltraEdit or TextPad as an alternative to Dreamweaver. However, there's simply no webdeveloper tool as powerful as Dreamweaver.

HyperText Markup Language

HTML is the predominant markup language used for web pages. The language describes the structure of text-based information in a document.

You absolutely have to learn basic HTML before you can begin to develop websites. Or, actually, you don't have to, you could use What-you-see-is-what-you-get editors like NUV (Dreamweaver does also have the ability to build your sites in WYSIWYG mode). However, if you want to make money online, and if you want to succeed at it, you'd better invest a few hours to learn the basics of HTML.

HTML is really simple and easy to learn. Here's a few sources where you could learn HTML for free:

Uploading Your Files

We're still at the basic level. When you have a hosting account, when you have a domain, and when you have a HTML-files ready to be uploaded, you have to use a FTP program to transfer the files from your computer and onto the server (at your host).

If you don't have a FTP software installed, get it now. You could buy FTP (File Transfer Protocol) software, or get it for free (legally). Here are three FREE options for you:

The above are just a few options, there are many more.

Upload your website or single files (for example index.htm or index.html). If you have any problems you should contact your host and the support team will help you.

Adding Graphics to Your Website

A website without graphics is most likely pretty boring. In dreamweaver you can insert images using the toolbar.

However, don't mix the use of full URL's and relative URL's (for SEO purposes).

Cascading Style Sheets

If you have never used Cascading Style Sheets (CSS) before, then you will be amazed of this simple mechanism which could help you to save huge amounts of time when building websites.

CSS is a mechanism for adding style such as fonts, colors, and spacing to your website.

While HTML can be used both for presentation and content, CSS is ment to be used for presentation only.

The power of CSS is best seen when you use external stylesheets. Meaning, that you have say, document.html, and in this file you declare that the style is stored inside an external file, cascadingstylesheets.css.

Inside cascadingstylesheets.css you could store the CSS code, for example:

body { background-color: white; color: black; font-size:12px; font-family:Verdana; }
p { line-height: 22px; }
a, a:hover { text-decoration: underline; }
a:hover { color: #F00; }

For an introduction to CSS, read the CSS tutorial: starting with HTML + CSS at w3.org to learn the basics of CSS.

W3Schools.com does also provide an excellent tutorial on CSS, see W3Schools.com does also provide an excellent tutorial on CSS, see www.w3schools.com/css/css_intro.asp.

For advanced CSS users, we'd recommend you take a look at A List Apart for innovative use of CSS. See alistapart.com/topics/code/css/.

You may also want to validate (check if your code keeps up with the standards) your CSS documents, simply use jigsaw.w3.org/css-validator/.

Server Side Programming Languages

Server Side Programming will radically reduce the time it takes to create webpages, of course, you will have to master it first. Furthermore, by using a server side programming language in your website you will be able to create more dynamic content. Bottom line though: Server side programming will help you to make more money. This last statement may seem bizzare, but it's ture. You will save time, and you can do so much more with your websites once you begin to use server side programming effectively in your websites.

There are many different server side programming languages:

  • PHP - Computer scripting language and server side language designed for producing dynamic web pages. This site is built using PHP. See the address field of your browser. The last part of the URL says "bonus_website.php" and that's the file that produces the page you're on right now. Actually, we've arranged it in such a way that there are many files that are involved in producing this file (one .php file for the header, one for the bottom, and one for the content).
    External resource: www.php.net for advanced users, and Simple Php is perfect for beginners.
  • ASP.NET is a set of web application development technologies marketed by Microsoft. Programmers can use it to build dynamic web sites, web applications and XML web services. It is part of Microsoft's .NET platform and is the successor to Microsoft's Active Server Pages (ASP) technology.
    External resource: www.asp.net
  • ColdFusion is a cross platform tag-based commercial server side scripting system.
    External resource: www.adobe.com/products/coldfusion/
  • Server-Side JavaScript - Simply JavaScript that runs on the server-side.
    External resource: http://research.nihonsoft.org/javascript/
  • Server Side Includes - A fairly basic system which is part of the common Apache web server, used primarily for combining documents or parts of documents on the server side into a single server response.
    External resource: Apache Tutorial: Introduction to Server Side Includes

There's many other server side languages as well, such as JSP, Lasso, Escapade, SMX, Lua Server Pages. You could even use object oriented programming languagessuch as

There's many other server side languages as well, such as JSP, Lasso, Escapade, SMX, Lua Server Pages. You could even use object oriented programming languages such as Ruby to create your websites, or at least use OOP languages to build parts of your websites.

Databases

Just as important as learning and applying the use of at least one server side language, you should also learn how to work with and build databases to be used with your website. A database is a structured collection of data that is stored in a computer system. I have several large databases which are stored safely on servers at our host. In some of these databases I have stored information about customers, and in other databases I have stored articles, for example.

Introduction to databases: Wikipedia: Database article

I prefer using mySQL. There's a great guide over at w3schools.com/sql/ that will teach you the basics of SQL.

If you are using the server side language PHP, and want to attatch a mySQL database along with it, I advice using the official site for the programming language to learn how to do this.

If you are using the server side language PHP, and want to attatch a mySQL database along with it, I advice using the official site for the programming language to learn how to do this. Thus, I would recommend you to go to http://php.net/mysql.

Usability

Usability is another important issue when building websites.

If you spend some time to research the resources mentioned on this page, I will guarantee that you will learn how to build your own advanced websites in no time at all. You don't need to buy tons of books to learn how to build advanced websites. For example, the PHP manual contains almost everything you need to know about PHP.