Scintography Home
Previous ChapterTable of ContentsNext Chapter
Title Page

Chapter 3: Building Your Site


The Art of Scintography
Edition 3.0 © 2008 Aurora Isaac
www.scintography.com
    3.1   Checklist Step 6: Collect Your Development Tools
 
Checklist
      Once you have decided to put your fingers on that keyboard and make your site come alive, you will want the right tools. Fortunately you don't need much to get started. In fact, you can probably put up your first site with what you already have. At the very minimum, you will need the following capability:

6a:Text editor
You will need to type your content and markup into your HTML file. You can use a plain text editor like Notepad. It won't help you with spelling or fix your markup, but it comes "free", bundled with Windows. Whatever you decide to use, your files must be saved as plain text.
6b:Image editor
If you are operating on a low budget, you can put up a site with no images or freeware images. But I think this is worth splurging on. Photoshop Elements is a good basic image editing program that will provide you with the image editing capability to make your pages look professional. It may even come bundled with a scanner or other system component.
6c:File transfer
You will need to get your files from your computer to your server. If you are using Windows, you can use the FTP capabilities of MSIE or MyComputer. You may find other freeware or inexpensive FTP programs through your web host or by searching the Internet.
 
Using MSIE or MyComputer to Upload Files
  1. Open an MSIE or MyComputer window.
  2. Using your domain name, type into the address line:
    ftp://ftp.myDomain.tld
    then press enter.
  3. Close the popup window (that says ftp session terminated).
  4. From the window's menu, open File>Login As...
  5. Using the login name and password you received from your web host, log in to your site.
  6. Open the directory you want to upload files into.
  7. Open a separate window to MyComputer and find the files you want to upload.
  8. Drag the files from your local directory to your site directory.
  9. To close the FTP session, close the MSIE or MyComputer window that is logged in to your site.

    3.2   Text Processing Tools
      The challenge of developing for the web is that the content text and markup text are entered into the same file. On one hand, it would be nice to edit your content with the power of a good document editor. On the other, it would be nice to see your markup text clearly, without the distraction of the content. Many products address this problem, but they each have their drawbacks. The formatting capacity of markup languages, as well as the tools for implementing them, are constantly evolving.

Text Editors
      A text editor and a document editor are two different things. A document editor leaves formatting characters in the stored file that would confuse a browser. A text editor stores only plain text, with carriage-return and newline characters at the end of each line. Most document editors have the option of saving files as plain text if you choose. HTML files are text files, so a text editor is all you need to create the files you need for your page.

HTML Editors
      If you have decided to learn HTML, you might want to invest in one of the HTML editors on the market. These editors insert the appropriate HTML tags with the click of a button. This can also be a handy tool if you only edit HTML files occasionally. The editor will jog your memory of HTML, but you still have the option of fine tuning your markup code. The drawback of this type of editor is that you are limited to the markup code that was implemented by the software developer. As you expand your range, the editor doesn't. Keeping this in mind, an HTML editor is a good tool for beginners.

WYSIWYG
      What-you-see-is-what-you-get tools allow you to format pages without ever seeing the HTML source. These editors may not have the flexibility of direct HTML editing, but the great advantage is that you don't have to learn HTML. If you are busy, or if you will only do occasional HTML editing, this may be the type of editor you want. There are a number of subtle drawbacks to this type of editing. For example, if you format a page to fit perfectly on your screen, what will happen on another size of screen? This depends on how the HTML code was implemented. The page you are viewing now has a fixed size "paper" that puts itself in the center of the window. If the window is too small, the "paper" does not resize. Depending on how your WYSIWYG editor works, this page could be implemented in a number of ways. In some, the "paper" would resize, making the page unreadable in smaller windows. These tools are getting better all the time, but shop carefully and test your pages on a variety of systems if possible.

    3.3   Image Processing Tools
      It's rare to see a page without images, and common to see pages with so many images you can hardly find the text. Images you will encounter range from a transparent single pixel image, to images so large they are too big for the typical screen. Some images, like those in the vicinity of this paragraph, are barely noticed, while others leave us in awe.

Image Aquisition
      Images can be aquired in a number of ways. Digital cameras and scanners are invaluable for obtaining images of your own. Many images are also available on the Internet. Be sure you have permission before you copy a file from a site. Just because you can, doesn't mean you should. Digital images can also be created "from scratch" with a variety of software tools on the market.

Image Presentation
      Once you have aquired your images, you need to edit them for presentation. Cropping, adjusting color, and adding text are just the beginning of a long list of creative options available for making outstanding images.

    3.4   File Transfer Tools
      The protocol used for transfering files from one network computer to another is the File Transfer Protocol (FTP). Many FTP programs are out there for you to consider. If you are implementing a small site that will only be updated occasionally, MSIE will probably be enough for you. If you are planning to do frequent updates, or are developing a large site, it is probably worth investing in a good FTP program.
    3.5   Development Platform Tools
      If your site is just a few pages, it's easy to keep track of your files and the links you make to other files. But as your site grows, keeping track of everything gets harder. Development platforms with site management tools have a variety of features that make developing and maintaining your site easier. These tools will probably include assisted source editing, coordinated integration of diverse site components, and monitored FTP to keep track of updates.
      The process of developing a complicated site can be a challenge, to say the least! One of the advantages of using development platforms is the trend toward WYSIWYG development, allowing the web designer to let the development tools handle variations in markup needed to accommodate variations in client browsers that can make development frustrating. One of the disadvantages of using a development platform is the complexity of these tools. If you are planning just one simple site, you may spend most of your time learning to use the development platform. Simpler tools are on the way -- don't lose hope!
    3.6   Checklist Step 7: Install A Test Page
 
Checklist
      You should install a test page as soon as you can. You don't need to know any markup yet, you are just testing the process of installing a page on your server. Your web host has probably given you a temporary home page. You can replace this with one of your own, or put another page on your site. Keep a record of this process in your site log. (If you haven't already started a log book, start one now!) Make sure you can accomplish these three basic steps:

7a:Edit your source file
Open your text editor. Type or copy some source into your editor. Save this file in a location on your computer that will hold your site files. Make sure you save this file with a .htm or .html suffix. You can give it any filename you want. If you are planning on replacing your existing home page, use the same file name. Your home page will have a name like index.html or default.htm. Remember, filenames are case sensitive. If your home page is called Index.htm, use that name.
7b:Upload your file
Open your FTP program. You will need your domain login name and password to set up your FTP session. Get to know your server site. It may not be obvious where your file should go. Read any information offered by your web host to get you started. When you are ready, copy (FTP) your source file to your server. If you are nervous, don't overwrite anything until you feel more comfortable with this process. Don't worry, if you put your file in the wrong place, you can always delete it later.
7c:View your page
Now you are ready to view your page online. Open your browser and type your URL in the address line. If you have overwritten your home page, your URL will look like this:
 
http://www.myDomain.tld

If you have installed a separate file, your URL will look like this:
 
http://www.myDomain.tld/myFile.html

If you have done everything right, your page will appear. If your page does not appear as expected, review your process. Get help from your web host if neccessary. Persist until you can view a page you have installed. Document your successful process so you can repeat your success when you are ready to install your site files.

    3.7   The Development Cycle
      Site development rarely feels as smooth as a cycle. However, the process has some identifiable phases. Planning should come first, but it's easier to plan after you've already got a site going, so the first step is probably going to be a "test site". Go ahead and put something up on the web and play with it awhile. You will soon have a good idea of how much you can accomplish, and how much you want to put into your site. Now that you've got some momentum, plan your site. It's a good idea to implement each new version of your site independently of your existing site structure, testing all the connections and layouts on different platforms if possible. When it's ready, move your home page link from your old content to your new content, then retest all the connections and layouts and fix anything you have overlooked. With a new version of your site up, you are in maintainance mode. With a simple static site, you don't have much to do. Now you can start the cycle over and plan your next version.
    3.8   References

1 Adobe: Products and solutions
http://www.adobe.com

All Contents © 2008 Aurora Isaac. All Rights Reserved. Legal Notices.
Previous ChapterTable of ContentsNext Chapter