An HTML file is nothing more than plain ASCII text, but all HTML files must have a special file extension for web browsers to recognize them. This extension is either .htm OR .html. The reason why there are two possible extensions goes back to the early days of the web. People were still using Windows 3.1 and DOS then, and Windows 3.1 and DOS file extensions could only be 3 letters long, hence .htm. Now .html is the more commonly accepted extension. For this course, we will be using the .html extension.
As you create web pages, it is important to keep them all together. This makes them easier to find on your computer, and makes it easier when you are ready to make your website go "live" on the Internet. So before we start saving files, let's create a folder where they will go.
- Open Windows Explorer (you can usually find Windows Explorer by right-clicking the Start button and selecting Explore).
- Left-click once on the C: drive (or whatever drive you will save your files to), then go to the File menu of Windows Explorer and select New/Folder. In the File Name box, type a name for this new directory. I am calling my folder xyzlibrary.
Now you are ready to save the file:
- Be sure you are in your Notepad window and that the skeleton web page you created is visible.
- Go to the File menu in Notepad and select Save.
- In the dialog box that pops up, make sure the Look in: box is pointing to the folder you created in the previous step.
- Type the file name in the File Name box. The first page of a website should always be called index.html, so that is what we will call this first file.
- After you check to see that the location for saving is correct and you have typed index.html in as the file name, click the Save button to complete the process.
You should always check your web page in a browser to make sure it looks okay.
To Preview Your File in Internet Explorer:
- Click the File menu, choose Open.
- Click the Browse button in the Open dialog box that pops up and navigate to the directory where you saved your index.html file.
- Double-click on the index.html file, then click the OK button in the Open dialog box.
- Your index.html file is now displayed in Internet Explorer.
(Most browsers use similar commands to open a file - start with the File menu and look for "Open Page" or "Open File".)
Look at my index.html. When the page opens, click the View menu and select Source to see the HTML code.
Note: As you work on your web page, you should keep your web browser and Notepad open. If you keep your index.html file open in your web browser, all you need to do after saving any changes you make to the file in Notepad is click the Reload or Refresh button in your browser window to see the changed index.html file. This means that you should have two windows open:
- One web browser for previewing your web page.
- One Notepad window, for editing your HTML code.
Next: Adding Lists