Pacific Internet - Ukiah, California

Personal Websites

Personal Websites

Dial-up and DSL accounts at Pacific Internet include 50MB of space on our public webserver, www.pacificsites.com, to use for your own personal website. However, this is not set up until you specifically request it, so you'll have to call (or email) our support staff to activate it.

Once it is set up, your website has an address similar to the following: www.pacificsites.com/~username

where "username" is your Pacific Internet username – usually whatever is before the "@" sign in your email address. So, if your email address is "wombat@pacific.net," your username would be "wombat," and your website's address would be "www.pacificsites.com/~wombat." As you'll see later on, this maps into an area (directory or folder) called "webpages" in your personal home directory on our server.

Creating Your Main Webpage

Your personal website can have more than one page, but the main page is the most important, and is always called "index.html" (or "index.htm" if your computer only supports 3-character extensions on the filename) for historical reasons. When somebody types "www.pacificsites.com/~wombat" into their web browser's address bar, our web server always sends them the "index.html" file from that site's file folder (or directory).

How do you create that "index.html" file? There are several ways:

  1. Create it in your word processor. Just write it and lay it out exactly as you would a page of text. Most word processors include an option to save a file as HTML (the file format used for web pages) or to export to HTML. Note: while you CAN do this, it isn't advised. Word processors tend to generate VERY messy and convoluted HTML code; plus, they're designed to work with fixed paper sizes, while the width of a web page can vary depending on how big the viewer's browser window is.

  2. Use a WYSIWYG (What You See Is What You Get) program specifically for designing web pages. There are a number of these programs available. Some good free ones are Kompozer (www.kompozer.net) and BlueGriffon (www.bluegriffon.org); both of those are available for Windows, Apple and Linux-based computers. There are also commercially-available packages such as Adobe Dreamweaver and Microsoft Impressions Web; these are more elaborate than the free ones – and much more expensive! All of them will allow you to design your web page similarly to what you would do in a word processor, and then save the resulting page as a HTML file.

  3. Learn how to write your own HTML code, and use a plain text editor to type in the code and save it as a HTML file. This is the hardest method to master, but it gives you exact control over everything on your web page. On Windows, you can use the included Notepad program to create/edit the file, or third-party programs such as PSPad or Notepad++. On Apple computers, try the included TextEdit application, or TextWrangler. All of those programs are free.

Again, regardless of which method you use, you must save your main page as "index.html" (note the all lowercase letters) when you're done. If you have more than one page on your website, you'll save them under different names (but still with the .html extension) and create links to them from your index page. (You'll learn how to create links as you master your web design program and/or as you learn HTML.)

Naming Conventions

As you create files, keep these conventions in mind:

  • All files should have extensions, because that is how servers and browsers determine what type of file it is. Web page files should have an extension of .html (or .htm); pictures should have an extension of .jpg, .png or .gif. There are other extensions as well, which indicate other types of files, but these are the most common.

  • Web servers probably don't run the same operating system software as your computer, so some file names that are perfectly valid on your computer won't work for a file on a website. A lot of special characters and punctuation characters fall into this category. Also, web servers usually will consider "Index" (with a capital "I") to be different from "index" (all lower case). In general, you should avoid spaces in names (use the underscore character "_" to simulate a space) and keep your names all lowercase letters and numbers.

Uploading Your Web Page

Once you've created the file containing your web page, you'll have to get it onto our web server before other people can see it. The process of transferring a file from your computer to ours is called uploading the file.

To upload the file, you'll need a program that transfers files using the FTP (File Transfer Protocol) method. Some web page design programs have that built into the program, but we generally recommend using a separate program for the purpose. Some good ones are Filezilla (www.filezilla-project.org) and CuteFTP (http://www.globalscape.com/cuteftp); FileZilla is available on Windows, Apple and Linux-based computers. We'll use FileZilla as an example.

filezilla window

At the top of the Filezilla window, you'll see a bar with spaces marked "Host," "Username," "Password," and "Port." Fill them in as follows, then click the "Quick Connect" button:

Host: www.pacificsites.com
Username: your own username (wombat in the above example)
Password: your own Pacific Internet password
Port: (leave it blank)

(Note that even though we're using FTP, you still use www.pacificsites.com as the host name!)

This will log you on through FTP. In the windows below the connect bar, you'll see a list of files on your computer (in the left-hand pane) and a list of files on the server (in the right-hand pane). I've shrunk the window down a bit to make the picture smaller, but just above the list of files on the left is a tree-like outline of your computer's folder structure. Use it to navigate to the place on your computer where you stored your "index.html" file.

In the right-hand (server) pane, you should at least see an entry named "webpages" – there may be others, but the "webpages" one is the important one. Double-click it, and that will take you to the place where you need to put your files.

Once you have your web page files showing on the left side, and the place where "webpages" took you showing on the right side, you can transfer your "index.html" file by using the mouse to drag it from the left-hand pane to the right-hand pane. (If you used any pictures, you'll have to drag those files as well; if your web-design program created a folder called "index_files," you'll have to drag that, too.)

You'll see a progress bar for each file being transferred in the window below the file lists. Once all of the progress bars have filled in and disappeared, your files will have been transferred to the server.

Testing Your Web Page

Once you've uploaded your files to the server, open up your web browser and type your website's address (in the above example, www.pacificsites.com/~wombat) into the address bar. Your web page should appear. If it doesn't appear, make sure you changed to the "webpages" folder on the server side of your FTP program before you started copying the files – if the files aren't in the "webpages" folder, then the server can't find them!

If you used pictures in your web page and they aren't showing, make sure that you remembered to transfer them to the server as well. Also, make sure that they're in the same place relative to the "index.html" file on the server that they were in on your computer – that is, if they were in the same folder as index.html when you created the page, they should be copied to the "webpages" folder as well. If they were in some other folder somewhere else on your hard disk, then the location information in your web page will be wrong when you transfer everything to the server!

Generally, your pictures should either be in the same folder as the web page, or in a sub-folder of that folder. I generally create a folder called "images" in my website folder and put all the pictures in there, then transfer both the HTML file and the folder to the server at the same time. That way, the location of the pictures relative to the HTML file stays the same whether they're on your computer or on the server – either place, they're in the "images" folder under the folder containing the HTML file.

More Information

Web page design and HTML are far more involved than we can explain in a bare basic tutorial like this. Here are some resources you can use for more information:

WDG HTML Help: http://www.htmlhelp.com/
W3Schools: http://www.w3schools.com/html
HTML Goodies: http://www.htmlgoodies.com/primers/html/
HTML Code Tutorial: http://www.htmlcodetutorial.com/

Questions

What can I do in my personal site space? What is supported?

The personal hosting space supports basic web page and image hosting. This type of hosting is not ideal for a business. There is no shell account access, and no php support in the web server, but some basic scripting is possible. See our hosting FAQ for more information about the benefits of hosting your domain.

Can I have a domain name, like www.wombat.com, point to my personal website?

Yes, and no. You can register a domain and have it forward to www.pacificsites.com/~wombat; however, the web browser will still show www.pacificsites.com/~wombat in the Address Bar rather than www.wombat.com. To get the latter, you'd have to use a regular hosting plan instead of a personal website.

I've heard ftp is not secure. Can I use sftp?

Yes. sftp is supported on port 55922. The path on the server may look slightly different, but the operations are exactly the same. (Note: Filezilla, as described above, supports sftp -- but not through the Quick Connect bar.)

This is all too confusing and technical. Can I pay you to help me build my site?

Pacific Internet can help you with your website development and consulting needs. Please contact us if you are interested in having Pacific Internet webmasters help you with your website design or functionality.