HTML and CSS Reference
Saving and Organizing HTML Files
HTML File Names
HTML files have an
extension of .html or .htm.
The home page of a
Web site is often called
default.htm. Check with
your Web hosting service
provider to find out which
name they use.
Before you can see how your HTML file looks in a Web browser, you must save it. It is
also important to save your HTML file for the following reasons:
The document in memory will be lost if the computer is turned off or you lose
electrical power while the text editor is open.
If you run out of time before completing your project, you may finish your document
at a future time without starting over.
To save your file, you use the Notepad++ File, Save command. When you save a
file, you give your file a name and follow that with the file extension. As mentioned earlier
in the topic, ile names should always make sense relative to their purpose. For instance,
naming a file page1 does not indicate the purpose of that file. Naming the file rockclimbing
immediately identifies that this file has something to do with that topic. The Web page
iles in this topic are always named with all lowercase letters and with no spaces. This is a
standard that is followed throughout the topic.
HTML files must end with an extension of .htm or .html . Many older Web page
servers can only display pages with the .htm extension, or short file names (i.e., file names
that are only up to eight characters in length). HTML files with an extension of .html
can be viewed on Web servers running an operating system that allows long file names
(i.e., file names that can be up to 255 characters in length). Almost all current operating
systems allow long file names, including Windows 7, Windows Vista, Windows XP,
Windows Server 2003/2008, Windows 2000, Mac OS X, and Linux. For Web servers
that run an operating system that does not accept long file names, you need the .htm
extension. In this topic, all iles are saved using the .html extension.
You will use a very simple folder structure with all the projects in this topic. It is
therefore important to organize your files in folders so that all files for a project or end-
of-chapter exercise, including HTML code and graphical images, are saved in the same
folder. If you correctly downloaded the files from the Data Files for Students (see the inside
back cover of this topic), you will have the required ile structure. When you initially save
the rockclimbing.html file, you will save it in the ChapterFiles subfolder of the Chapter02
folder. The graphical image used in Chapter 2, rockclimbing.jpg, will be stored in that same
folder — Chapter02\ChapterFiles. Because the chapter projects in this topic are
relatively simple and use few images, images and HTML code are stored in the same
folder. In real-world applications, though, hundreds or thousands of files might exist in a
Web site, and it is more appropriate to separate the HTML code and graphical images
into different subfolders. You will learn more about organizing HTML files and folders in
Saving Your Work
It is a good idea to save
your HTML file periodically
as you are working to
avoid the risk of losing
your work completed thus
far. You should get into the
habit of saving your file
after any large addition
of information (i.e., a
paragraph or image). You
might also want to save
the file after typing in
several HTML tags that
would be difficult to re-do.
Storing Your Files
Many schools provide
students with space on a
Web server to store their
Web pages. However,
saving your Web pages
to another medium
(e.g., a USB flash drive)
assures that you have a
backup copy of the files
that you created. Saving
Web page files to the hard
drive on a computer in a
school lab runs the risk of
it not being there the next
time you are in that lab.
Many schools delete all
files at the start-up of each
Determine where to save the Web page.
When saving a Web page, you must decide which storage medium to use.
If you always work on the same computer and have no need to transport your projects
to a different location, then your computer's hard drive will suffice as a storage
location. It is a good idea, however, to save a backup copy of your projects on a
separate medium in case the file becomes corrupted or the computer's hard disk fails.
If you plan to work on your projects in various locations or on multiple computers,
then you should save your projects on a portable medium, such as a USB flash drive
or CD. The projects in this topic use a USB lash drive, which saves iles quickly and
reliably and can be reused. CDs are easily portable and serve as good backups for the
final versions of projects because they generally can save files only one time.
The above are general guidelines about saving your files. Your instructor may give you
specific instructions for saving your work that differ from the steps that follow.