Here you will find all the basic informations you must know if you want to start building a website or are already building one...

Chapter 1: What do I need to build and have a website?
Chapter 2: General web dictionary
Chapter 3: What is the root of a server/website? How do I upload a file? What will its URL be? (images, .mp3 files, flash files, .html files, .zip files or any other file...)
Chapter 4: Absolute paths and relative paths (or links)

Chapter 1: What do I need to build and have a website?

To build a website you need four things:

1. You need an application to build the website and manage its content (example: RapidWeaver, iWeb, WordPress, PhpBB, or any full text editor like TextWrangler for Mac or Notepad for Windows...).
2. You need a hosting account
3. You need a domain name
4. You need an FTP application

In Chapter 2 you will find what these and other words mean.

Chapter 2: General web dictionary

What is a URL?

URL stands for Uniform Resource Locator, in other words it’s the web address under which you can access files on the web and usually looks like this:

http://www.yourdomain.com/sitename/pagename.html

What is a domain?

A domain is actually a name like www.yourdomain.com. Can you buy a domain? It’s more like you rent a domain and renting the domain gives you the rights for the name and for using it during the time you rent it. You usually pay a yearly fee for it.

What is a registrar?

A registrar is a company which is selling (more giving for rent) domains.

What is a server?

In poor words. It’s a computer on which you can store some informations. What makes it different from your computer at home is that it is online 24h/day 365days/year and people can get access to the files stored on the server by connecting to it with a browser or an FTP application.

What is a hosting?

A hosting company is a company owning servers and giving away some space on the server so that people can store their files on them and access them whenever they want. Do you buy some space on the server? It’s more like renting some space. You pay a monthly fee for using the space. Like you rent a house or a flat. Note: Most hosting companies also offer you to buy a domain through their services. If you don't have a hosting yet you may want to have a look at this page.

What is an FTP application?

FTP stands for File Transfer Protocol. It’s an application built to connect to a server which allows you to upload files to the server, download files from the server, delete files on the server all from your computer at home.

What is a Browser?

A browser is an application which retrieves files stored on a server and displays its content to you on your computer. Example: Safari, Firefox, Chrome, Opera and some say Internet Explorer.

Chapter 3: What is the root of a server/website? How do I upload a file? What will its URL be? (images, .mp3 files, flash files, .html files, .zip files or any other file...)

What is the root of a server/website?

The root of a website, as it is used on this website, is the main location or directory of your website. Each hosting handles this a bit differently. So there's no way for me to write general instructions on how to find it. Best is you try it out.

To try it take a picture and name it picture.jpg then upload it to your server. By entering

http://yourdomain.com/picture.jpg

into your browser the picture should appear. If it doesn't you didn't upload it to the root. If it does appear, you found the root.

If you already uploaded a website then the root is where the main index.html or index.php file is.

How do I upload a file?

To upload a file you need an FTP application like Cyberduck to connect to your server. Please have a look at this page to know how to use an FTP application.

Important note: When you upload a file replace spaces with underscores _ (eg. “happy new year.jpg” gets “happy_new_year.jpg") this makes it much easier to find out the file's URL. Spaces in filenames cause quite some troubles on the web. Also avoid special characters like ä, ö, è, ... and any punctuation in the filenames. Replace special characters with normal characters (like à with a).

What will the URL of the file be?

As we've previously seen if you have an image named picture.jpg and you uploaded it to the root of your server the image will display if you enter http://www.yourdomain.com/picture.jpg in your browser. If it doesn't display you didn't upload it to the root.

From time to time you have to upload a file or a folder to your server (perhaps a slideshow you made, flash content files, pictures, music, ...). For these files I think it’s best to make a folder called media, put all the files which don’t go directly into the application you're using to build the site into this folder and upload the media folder to the root of your website. The web address (or URL) of this folder will be

http://yourdomain.com/media/

and if you put a file into it, let’s call it filename.extension, its URL will be

http://yourdomain.com/media/filename.extension

Having a media folder helps you to keep things organized and makes it easy to determine the URL of a file you want to upload.

Chapter 4: Absolute paths and relative paths (or links)

Instead of using the full URL to a file as seen in the previous subchapter http://yourdomain.com/media/filename.extension you could also use an absolute path or a relative path.

Absolute paths (or links)

All the codes you find in my E-Book were written or adapted to work once you uploaded the files to the server. Instead of using the entire URL http://yourdomain.com/FolderName/picture.jpg in the codes you will often find that the addresses to files are specified like this:

/FolderName/picture.jpg

hence without http://yourdomain.com in front of it. When it starts with a slash "/” like in the example above this is called an absolute path. This indicates the position of a file on a server starting from the domain http://yourdomain.com, which, as we've seen earlier, points to the root of your server. So basically you just type in what comes after your domain http://yourdomain.com without typing in http://yourdomain.com just starting with / so for a picture you uploaded to the root instead of writing http://yourdomain.com/picture.jpg you just write /picture.jpg

The good thing about using /FolderName/picture.jpg instead of http://yourdomain.com/FolderName/picture.jpg is that the first one is universally applicable. No matter what your domain is the picture.jpg file will be searched in the folder FolderName which is uploaded to the root of your server. This allows you to use the code I provide you without you needing to edit the code first or with less need to edit it.

As a last note on absolute paths it may be helpful to keep in mind that they are built "forward" or in a "top down" process. They start from the most top (the root http://yourdomain.com) and you just type in what comes after the root after the initial slash (/).

Relative paths (or links)

I never use relative paths however you may find them elsewhere on the web so here I will try to explain the difference between absolute paths and relative paths and how to use relative paths in case you would ever want to do that (I wouldn't since to me it's more complicated). If absolute paths are built forward in a top down process relative paths are built backwards in a bottom up process.

If you have a page under http://yourdomain.com/sitename/pagename.html while building a relative paths the question to answer is where do I go from here? If the file you're wanting to refer to is in the sitename folder too let's take again picture.jpg then all you have to do is type in picture.jpg like <img src="picture.jpg"> easy. If the file isn't in the sitename folder but in the root then you have to go a step backward first (or a step bottom up) which is done by adding ../ which equals a step backward <img src="../picture.jpg">

What if I have a page published under http://yourdomain.com/site/page.html and a picture published in a folder called “media” which is uploaded to the root? Then you would have to go back to the root level and add to search in the "media” folder like this: <img src="../media/picture.jpg">

Again I wouldn't recommend you to use relative paths. To me absolute paths are easier. If you have a code using relative paths you may want to convert the relative paths into absolute paths.

Also read the "Coding your own page" page and the Basic HTML Codes knowledge page for a lot of useful informations on how the web works and how to use codes.