When making your own website, it is important that you have an understanding of the different types of files you will be working with and what they are. In this lesson, I will introduce the common file types to you.
First off, realize that your website is going to be made up of files. These files are no different than the files you have sitting on your hard drive. Whether you have Word documents saved, Excel spreadsheets, photos or any other type of file, they are all just files. The only difference is that the files for your website will be sitting on your web server rather than your own computer. Files come in different types, designated by the filename extension (the 3 or 4 letter extension after the period in a filename).
[hidepost=1]

HTML (.html or .htm files)
HTML stands for hypertext markup language. It is the formatting language used to put together a website. By the time you complete this course, you will see just how simple HTML really is.
HTML files usually come in either a .html or .htm file extension. Each HTML file would represent a single web page. If you create a file containing HTML, save it with a file extension of either HTML or HTM and upload it to your web server, you could pull that web page up simply by pointing your web browser to the file you just created.
JPEG (.jpeg or .jpg files)
A JPEG is simply a type of image file. See, image files can be saved in a variety of different formats. The difference between the formats comes down to compression methods, color depth and other things which are usually not visible to the naked eye. JPEG images, though, are very common online because they offer a good balance of file size versus photo quality. If you are going to place an image on your web page, there is a good chance that that image will be a JPEG image file.
GIF (.gif files)
A GIF file is another type of image file commonly used on websites. The primary difference between a JPEG and a GIF file is that the GIF file cannot exceed 256 colors in the image whereas a JPEG can go up to 65 million different color combinations. For some types of images, GIF format will result in a smaller file size than JPEG.
GIF images also allow two things that the JPEG format will not:
- Transparent backgrounds. It is possible for a GIF image to have a transparent background. This means that whatever is underneath the image will show through it. For example, if you create a simple picture of a circle and place it on a website, a JPEG version would show the background of the image even if it conflicts with the design of your site. The GIF image, if you create the image with a transparent background, will show the circle and the background will show through around that circle. The images below demonstrate this. Both images have a black background. But, the image on the right is saved as a JPEG image. The one on the left is a GIF image with black designated as the transparent color.

- GIF images can be set up to be animated. An animated GIF is a single GIF image file which, when viewed on the web, actually moves. People use animated GIFs to create things like waving flags, moving arrows, faces that blink, etc. Animated GIFs are usually not very large. These types of images can be used where appropriate. Professional level sites should not make much use of animated GIFs as they are generally considered to be sign of an amateur.Here is an example of an animated GIF:
PNG (.png files)
This is another type of image. It is very similar to JPEG but can sometimes offer better compression for the same image (meaning smaller file size).
PHP (.php, .php3, .php4, .phtml files)
PHP is a programming language which allows the creation of dynamic, interactive web pages. When a person creates a PHP file and uploads it to the web server, the script will be run when you point the web browser to that file. The PHP code itself is processed by the web server BEFORE the user will see anything in the web browser, and the output created by the PHP file must still be HTML so that the browser can actually display it. We will go more into PHP elsewhere at PCMech EDU. It is also important to realize that your web server must be set up specifically to run PHP.
CGI (.cgi files)
CGI is another type of script (similar to PHP) that can be run on your website. Many web hosts will provide freely available scripts which you can use with your website for free. Often these provided scripts will be CGI based. Typically, CGI files would be run from a directory on the server called “cgi-bin”.
Got Another Type of File?
The above breakdown only mentions the most common types of files used on a website. It is, by no means, comprehensive. If you come across a file extension that you are not familiar with, you can use Filext.com to look up the file extension and get a description of it. In fact, you can use this website to look up any file type you want.
[/hidepost]

Like what you read?
If so, please join over 28,000 people who receive our exclusive weekly newsletter and computer tips, and get FREE COPIES of 5 eBooks we created, as our gift to you for subscribing. Just enter your name and email below:


