Spending tedious hours squinting at running lines of code is a thing of the past. Web sites are now easier to create than ever. With a few simple tricks, you’ll be on the road to a snazzy site. And hey, it’ll be fun, too!
It seems like everyone needs, or wants, a web site. From clubs and scouting organizations to religious groups and personal interests, the web can be a venue to cheaply and easily spread information to an unfathomable number of people.
In the old days, most web programming was done by hand. HTML programmers would pour over lines of code and cumbersomely troubleshoot each one. Eventually, WYSIWYG web editor programs emerged. However, their code was often buggier than hand-programmed code, and by moving around a few objects on the screen, you could do a royal job of turning your page into a toss salad.
But things have changed. The web has grown up, technologies have been refined, and there are powerful tools available for the novice webmaster and decorated veteran alike.
In this article, I’ll explain some pivotal steps in getting a customized web site setup. The best part is, you can probably do it over your lunch hour.
First off, let’s assume you already have some place to host the site. A host is a computer that stores your site where others can access it 24/7. Many ISPs, such as JMUG-Connect, provide space where you can have a site hosted. Additionally, if you subscribe to Apple’s .Mac service, web hosting is included as part of the package.
Next, ask yourself what the site is going to be about. If it’s for an organization, that’s pretty simple. You should already have a mission statement, description, activities, etc.. If you’re doing a personal site, you need to decide on a few things/areas of your life that you want to share. The key is just a few things. It’s easy to go overboard and make a site teeming with links and pictures. Nothing is wrong with having a lot of content, but the basic framework of the site needs to be broken down into a few areas. Otherwise, your site will be confusing to navigate, hard to look at, and generally obnoxious. People won’t want to stay very long. The only reason I’m so animate about that is I’ve seen way too many homepages that did a better job of inflicting a headache than an annoying boss or bill collector.
Now, back to your site. The first thing you should do is get out a piece of paper and a pencil. Yes, I know it’s extremely analog. But if something works, why stop using it? Draw up a site map, something like a flowchart. You could also do a bullet list outline. The main purpose of this stage is to get your ideas organized before you sit down at the computer. If you start out with a plan, you’ll have a lot more fun and end up with a better looking final product.
Here is an example site map:
Ok, so you’ve got a site map that looks good. Now let’s hit the computer. Err, I mean you can touch the mouse now. There are several good WYSIWYG web editors for the Mac (both Classic and OS X). I’m partial to Dreamweaver, although GoLive is also a top contender. Don’t worry, you don’t need to spend big bucks on software you’ve never tried before. Both titles have functional trial versions available for free download from their vendors. Freeway Pro and Freeway Express are also good editors for people looking to purchase a full version on a smaller budget.
The real fun begins when you’ve got your software installed and ready to go. I usually start out by making a new folder in the Finder for the project. That way, I can keep all the files for the site together in one place, which will make it easier for linking images and uploading the finished site to the server when the time comes.
As a general rule, the first page of the site (the main/welcome page, call it what you like), needs to have the file name “index.html”. That might not mean too much to you, but it will tell the web server to show that as the primary page when people access your site. Aside from the index, you can title the other pages in your site as you like. Try and keep to letters a-z and numbers 0-9 in the file names. Characters such as question marks, percent signs, and exclamation marks are reserved for other web server functions.
In your web editor, make a new page and save it as the index right away. I like to get the general framework of the page setup before adding in content. Usually I make all the links for the navigation and put the site logo at the top of the page.
For example, let’s say you plan to add the following areas to your site, as given on the sample site outline above: vacations, family, and hobbies. On the index page that you’re currently working on, make links to each page. Even though we haven’t made the pages yet, you can still make links. Think of this as the template-making stage. I would make links to “vacations.html”, “family.html”, and “hobbies.html”. Again, you can call the pages whatever you like.
Now that you’ve got one page setup with all your links to the other main sections of the site, go to the File menu and scroll down to “Save As”. Save a new copy of your index file for each main section of the site. Use the same file names as you did when you made the links in the last step. By doing that, you now have actual pages that correlate with the previously made links. Things are starting to come together.
After you’re done saving all the new copies, you have a fully functional site framework. Go in and open up each page and customize it as you like, by adding photos, links, text, etc..
You can test your site from your computer using a web browser. Just drag the icon of the index page, or any page, from the Finder into your web browser window. If a link doesn’t work or an image doesn’t display, go back to your HTML editor and make sure the file name is correct and the file is in your project folder.
Once you’ve got a site that is ready to share, you need to upload it to your web host. To send files to a host over the Internet, many people use an FTP program. FTP stands for File Transfer Protocol. There are many free FTP programs available for download. A longtime Mac favorite is Fetch. However, I prefer Transmit. There are many other good programs out there. A search on VersionTracker should yield good results.
Now all you’ve got to do is share the URL with some friends and family. See, wasn’t it worth giving up your lunch break to build a web site?
Article first appearead at MacWrite.com
Sam Burrish is a freelance writer and Mac support specialist. During the
day, he helps Mac user for JMUG-Connect, a national Mac ISP
www.jmug-connect.net. In his spare time, he enjoys writing for
MacWrite.com in addition to playing the string bass. Through testing new
software and discovering simple tricks, he always finds a better way to get
the job done. He enjoys sharing his finds and helping Mac users everywhere.
