FAIL (the browser should render some flash content, not this).
 

#5: Download & Set Up Your HTML Editor

There are literally hundreds of HTML editors out there. I personally use Dreamweaver CS3 (about $400) but there is a free HTML editor called HTML-Kit that is pretty close to the greatness of Dreamweaver but is FREE! From the HTML-Kit site:

HTML Kit is a full-featured free editor for HTML, XHTML, XML, CSS, JavaScript, PHP and other text files. 400+ plugins are available for it, including HTML Tidy for creating standards-compliant web pages. HTML-Kit has received 95% thumbs up on Download.com user reviews with millions of downloads.

In this step, you'll be downloading HTML-Kit and setting it up for your hosting & template!

Downloading & Installing HTML-Kit

  1. Go to HTMLKit.com
  2. Click on the download link.
    Download HTML-Kit
  3. At the next screen, you can fill in the text fields or just press on the 'Download HTML-Kit' button.
    Download HTML-Kit
  4. Run the installation program. If you see a message that says that the publisher could not be verified, click on Run again.
    Run the downloaded file
  5. When the installer launches, follow the on-screen instructions. Just go with all the suggested settings.
    Install HTML-Kit
  6. At the last screen, keep the checkbox checked so that when you click on Finish, HTML-Kit will start up.
    Start HTML-Kit
  7. At the first screen, you can check for updates or just open HTML-Kit.
    Open HTML-Kit
  8. Choose the Windows integration option and then follow the directions on the next couple of screens that come up.
    Choose Windows Integration
  9. That's it for the installation. Now on to setting it up for your hosting and such...

Setting Up HTML-Kit

You'll need to set up a local folder and an FTP folder in HTML-Kit. The local folder is the folder on your computer where you unzipped all your template files earlier. The FTP folder will be the 'root' directory of your hosting. With HTML-Kit you can edit files directly on the remote site but it's always better to have both a local folder and a remote site set up in HTML-Kit. That way, you can make all your changes and review them before uploading them to your remote site where everyone can see them.

Setting Up Your Local Folder

  1. The first time that you open HTML-Kit, you'll get the following menu screen. I would check the "Don't display this screen again" but that just my preference. In any case, click on "Cancel" to close the window.
    HTML-Kit Open File Wizard
  2. In the right-side pane, right-click underneath "My Documents", select "Add/Remove FTP/Folder", and click on "Add Local Folder"
    create local folder
  3. Click on the folder icon and find the folder on your computer that has all the files for your site. This will be the "site" folder within the folder where you unzipped all the files from the template. For the "Display Name", choose a name that will identify your site and signify that it's the local folder. Then click on OK.
    New local folder properties

Setting Up Your Remote Site

  1. In the right-side pane, right-click underneath "My Documents", select "Add/Remove FTP/Folder", and click on "Add FTP Server..."
    add ftp site
  2. You'll see a window where you'll need to enter in FTP information so that HTML-Kit knows how to connect with your hosting account. To get this information, you'll need to log into your hosting account.
    blank ftp properties
  3. Go to https://admin.1and1.com
  4. Enter your Customer ID and password. Your customer ID was created for you when you signed up for your hosting account and can be found at the top of your confirmation email. The password will be the same one that you chose when purchased hosting.
    1&1 Hosting Login
    Confirmation Email
  5. You should see your package listed. Click on your hosting package (1&1 Home Package).
    Click for larger image! Hosting Package Selection
  6. You've logged into your Hosting Control Panel. Click on FTP Access
    1 and 1 FTP access
  7. You'll see your FTP account listed out with your password. Enter these into the HTML-Kit "New FTP Server" window.
    ftp information
  8. In the "New FTP Server" window, "Server Address" is your domain name. Your "Display Name" should be a name that identifies your site but also signifies that this is the FTP connection so that you won't get the local & ftp folders mixed up. Make sure that the "Passive mode" checkbox is checked and press OK.
    full ftp information
  9. If you get a firewall notification, make sure that you add HTML-Kit to your "allowed" list.
    Add to firewall allow list
  10. Ok, you have HTML-Kit set up!