HTML Naming Conventions

When the Macintosh came out in 1984, one of its breaks from computing tradition was in its liberal file-naming conventions. While DOS and Windows 3.x files had to follow the so-called eight-dot-three convention (ie myessay.doc), Mac files could have spaces, could include up to 31 characters, and could even neglect to have a file extension.

As a result, a designer can work on the Macintosh in programs like Photoshop, InDesign, or Illustrator for years without really worrying about how to name files. An EPS file, for instance, can be placed in Quark without any concern for whether the extension .eps is included. File names can be several words long.

Likewise, since Windows 95, the Microsoft OS has allowed spaces in file names and names longer than the traditional “eight-dot-three.” However, most web servers run a flavor of UNIX, which means you need to be aware of the file naming conventions of that operating system. Specifically, keep the following points in mind:

UNIX Doesn’t Like Spaces

Although a file named my page.html would work locally (ie on your computer), it wouldn’t once you’d uploaded it to a UNIX server. If you want to use several words in your files, connect them with the underscore character: my_page.html. Or just run them together: ihatenickelback.html.

UNIX is Case-Sensitive

Although you can get away with capitals, I would suggest that not using uppercase is a good rule to make part of your authoring practice. UNIX servers are case-sensitive. Windows and Macintosh computers, on the other hand, aren’t.

If my page has the following HTML to reference the file Dogfood.jpg,

<img src=“dogfood.jpg”>

the image would display perfectly when I tested it locally on my Mac. However, once I uploaded it to a UNIX server, the only image I’d see is the “broken link” image the browser puts up when it can’t find a file.

In short, in UNIX, “dogfood.jpg” and “Dogfood.jpg” are two different files. Both can exist in the same directory.

Simply because it can be a complete pain to keep track of whether you capitalized or didn’t, most designers and developers recommend that you stick to lower case. Using uppercase is syntactically legal, but the link and the file name must be consistent: if one is lower case while the other is upper, the link will not work.

Some Characters are Illegal

Illegal characters are simply characters that you are not allowed to use because their use is reserved for other purposes. Here’s a list (in no way exhaustive, though):

Quotation Marks (“)	Reserved for HTML tag values (<img src=”potato.jpg”>)
Dots (.)	Reserved for extensions (.html .jpg .gif)
Colons (:)	Reserved for script commands
Exclamation Marks (!)	Reserved for HTML comments
Forward Slashes (/)	Indicates directory structure (specifies a folder)
Back Slashes (\)	Used to “escape” characters in UNIX. (If that doesn’t make sense, don’t worry about it at this point). Also used by Windows servers.
At sign (@)	Used for email addresses

Basically, if you use letters, numbers, underscores, or hyphens, your file name won’t have illegal characters. Any other “funny” characters will most likely be illegal.

File Extensions are Mandatory

Although extensions aren’t necessarily mandatory on the Macintosh, they are mandatory practically everywhere else, including on the server. Use them. Here are some of the common extensions used in web authoring:

Graphics
.gif	Graphics Interchange Format
.jpg/.jpeg	Joint Photographic Experts Group
.png	Portable Network Graphics
Media
.swf	Shockwave Flash
.dcr	Shockwave Director
.mov	QuickTime
.wav	Windows Audio File
.mpg/.mpeg	Moving Pictures Experts Group
.mp3	Moving Pictures Experts Group (sound file)
Others
.pdf	Acrobat (Portable Document Format)
.htm/.html	Hypertext Markup Language