webpage basics

What is a webpage?

A web page is a computer file that is a text document filled with proper HTML markup, with a filename extension of .html (or possibly .htm). A text document is a kind of computer file that includes only alphanumeric characters, but no encoded formatting. It is much simpler than a word processing document, for instance, which is full of information beyond the plain text.

Why does the file look different sometimes?

Webpages have both an editor view and a browser view. The text document you create in Notepad or another plain text editor looks just like text that you’ve typed (including all the HTML tags), when you look at it in that text editor program. But if you double-click on an .html file, your computer’s operating system will probably open it not in a text editor, but in a web browser… Your computer usually assumes you want to view webpages, rather than edit them. Of course your ugly HTML markup will look different—more beautiful, we hope—when viewed in the browser.

“me.html” viewed with Notepad—for editing

“me.html” viewed with Firefox—for browsing

me.html in Notepad

me.html in Firefox

How can I open it in the text editor?

If your computer automatically opens your webpage in a browser (as is generally the case), then double-clicking is not a good way to open that file for editing. These are a couple of ways to open the file in your text editor:

  1. Launch the text editor first (to open Notepad on a Windows computer, go to Start menu, All Programs, Accessories, Notepad), then from within the text editor, go to the File menu, choose Open, then browse to select your .html file. You may need to change the file types it recognizes from “text files” to “all files” to see your .html file.
  2. Right-click on your .html file, select “Open with,” and point to Notepad.

How can I view it in a browser?

  1. Launch your browser (Firefox, Safari, Internet Explorer, etc.).
  2. If you want to view your .html file before you publish it to the server, you must ask the browser to open a local file… Depending on the browser, you will do something very close to this: pull down the File menu, choose Open File, and click Browse to point to your .html file. Alternatively, right-click on your file and select Open with… <browser name>

Where should I store my webpage file?

You need at least 2 copies of your .html file: one that you can access on your local computer for editing and one that the whole world can view on the web. From time to time you will “publish” the local file, which means copying it up to the server (dunx1). That way the world can view your new changes and additions.

Ideally, the local version of your webpage should be stored in a folder on your hard drive, as you will eventually have quite a few files that will together make up your whole website (some will be .html files, some will be image files, CSS files, or other). The easiest way to work in this course would be to keep a copy of your local web folder on a portable USB drive (thumb drive, flash drive, etc) so you can work on the files in class. When we start adding image files to your website, a 3.5” floppy disk will no longer provide enough space. I would advise always keeping a backup of this folder on your hard drive too.