FIXIT MENU:
home about us contact us

WHAT'S AVAILABLE:
free scripts advanced scripts online tools great books web related tutorials contributed tutorials news archive geek toys!

SUPPORT:
help forum live chat help

The Internet as it relates to Web Design

A work in progress, last edited on 27th Feb 2008.
By Franki (Don is not to blame for my writing style or lack thereof.)

Ok, so you know you want to have your own Webpage/Website/Ecommerce business/Web design business but where do you start?

Let's begin with a very simplified overview of what the World Wide Web is and how it works.

When you open your Web Browser and enter a web address like google.com (for example) your computer will ask another special computer called a server that your ISP owns, what the computer readable name of that domain is. A domain like http://google.com is for humans, your computer wants something like this: 64.233.187.99 (Called an IP address ).
This special computer is called a DNS or Domain Name Server and there are many thousands of them all over the Internet. They are like a giant address book that tells computers everywhere how to find the sites their owners are looking for.
Once your computer has this IP Address, (Every single computer connected to the Interent has an IP address.) Your computer then sends a request to that IP address, sending with it the domain name you typed and your own IP address (return address) and asks for the document you requested as well.
If you didn't request a specific file, you will get the "default document" which is usually one of index.html/index.htm/index.php and so on. (the name of the file containing the homepage of the website. An example of this, is Google, if you go to the address http://google.com and then go to the address http://google.com/index.html you will see that they both return the same page. Because the first one didn't request a file at all, so Google sends you the default page, which is index.html.

If the server at the IP address has the file your browser asked for, it will send it back to you. Assuming that you requested a webpage, that file will be in the format of plain old text interspaced with what are called HTML tags (HTML stands for HyperText Markup Language, though it isn't really a language, just a kind of formatting system to tell the browser where to put each bit of text, what color and so on.)

And there you have it. At it's most basic, that is really all there is to it. Having images, sounds and video in a webpage works much the same away, the HTML tag in the page tells the browser there is supposed to be an image or sound file or video file there and the browser goes and requests it and displays it just as the HTML formatting instructs it to.
If you want to know what HTML looks like, Right mouse click on the text of this page and select View Source or View Page Source. Everything you see that is inside the less than < and greater than > symbols is likely a HTML tag.
If you are looking at the HTML of this page, don't let it get you down. This page has some fairly advanced xHTML/CSS in it and you don't need to get anywhere near that complicated to have a great web page.


I plan to make a habit of writing Web pages.

If your goal is to write lots of websites for fun and/or profit, you really should get to know HTML because there are some things you just can't do as well with web authoring GUI tools. If that is your goal, than you could start with our HTML basics tutorials: part 1, part 2 and part 3. After that, just go here and read anything with the string HTML in the name. Then perhaps you'd like to read a book about it. But by the time you've read our tutorials listed above, you will know enough to make a basic webpage/website already. There is also an excellent chance that you will wonder later on, how you could possibly have thought it was confusing or difficult, because it really is much simplier than it seems.

What you will need.
1. Web hosting space. A web server you can put your HTML files and other stuff like images/video etc so they are available to the Internet. Do a Google search for "cheap web hosting" or "free web hosting" you'll find more info than you know what to do with.
2. A good text editor (Notepad++ is free and fully featured, in fact I'm using it to write what you are reading now.)
3. A good FTP client, (to upload your files to the hosting server) I like the free Firefox web browser with the equally free FireFTP FTP client. You could also use (free again) SmartFTP, and we have a tutorial for how to use it here.
4.Time. It doesn't take long to learn HTML/CSS etc, and you can make really impressive websites without knowing everything. But it does take some time and perseverance to get a good feel for it. It is a very good thing that it is actually fun to learn HTML.
5. Image editing tools and perhaps video editing tools if you fancy yourself a Youtube competitor. What else you need depends entirely on what you plan on putting on webpages. I'll include some free tools for these shortly.


I don't want to know HTML, I just want my personal Webpage/Website up yesterday.

OK, you've heard about web pages, and you want one. You don't plan on making a career or hobby of it, you just want a page or site ASAP.
If the above describes you, there are several ways you can get an online presence in a hurry.

Here are a few of the most popular:

1. Get a free Blog. There are tons of free Blogs (weB LOGs) online, Google and ye shall find.
2. Get a free MySpace page.
3. Write your own page using GUI tools and upload to free hosting.

The first option is probably the easiest and fastest as you don't need to know anything and because the blog software does everything, you don't need to interact with HTML at all. You just sign up, choose a name for your blog and start typing content into online forms. The Blog software does the rest.

Myspace is likewise not brain surgery. But judging from what I've seen on their site, it's a lot easier to make a bad Myspace page than a good one. (If that isn't the case, why are their so many bad ones?). There are loads of free templates for Myspace about. (if in doubt, Google) I'll cover this in some more detail shortly.

The most personal and rewarding method of the above 3 would be to use tools to write the HTML for you.
The best free tool I've seen for GUI website production, (which is sort of like using a Word Processor to create a document except the document is a web site) is NVU (pronounced Nview). It has all sorts of tools to help you and writes good clean compliant code.
You can use Microsoft Office for the same task, but I never advise anyone to do so as they tend to create nasty bloaded HTML that is harder to edit later on down the track and takes longer for visitors to download.

If you are going to use a program like NVU to create your pages, you will still likely need the items 3 and 5 listed above to create images/video and to upload them to your web server.


I don't just want a Website, I want an E-commerce Website so I can sell stuff.

Now HTML doesn't have to be provided in the form of text files full of text and HTML tags, the text and HTML can be generated in real time by a program and "streamed" to the browser in real time (while you wait). The programs that do this are called "CGI" scripts and can be written in a huge number of programming languages. (Our favorites are Perl and PHP). Now the ability to vary what you send to the visitor depending on what he is asking for is very useful indeed because it allows you to create and/or use things like E-commerce shopping carts were a customer can wonder though your goods, maybe search for an item, then click "buy now" proceed to a checkout and pay for their purchases. And the program can calculate and display price totals, shipping costs etc and format and change the amount accordingly.
In other words, it allows you to create a system similiar in many ways to shopping in the real world. (Actually there are no real limits to what CGI programming enables us to do. e-commerce is just a part of it. CGI programming allows your site to interact with the visitor in a way that static HTML files cannot.

Anyway, the point of all that, is that if you have a Web server that can handle a CGI language, you can install what is called a Shopping Cart. A Shopping Cart is a program that has a database of your products, and what they cost, shipping charges and so on, and it dynamically turns them into a website that people can shop and buy from in real time.
There is no need to write one, there are plenty of them available ready to use, many are even free.
The best of all the free carts (in my opinion anyway) is OScommerce and for that to work, you will need to find out if your host supports PHP and MySQL (or find a host that does.) Most good hosts do offer PHP/MySQL so it won't be hard to find one.

Stay tuned, this is just the beginning.





So if you are ready to learn more:
Back to the Tutorial Index