What Should I Name my HTML File?

Question: What Should I Name my HTML File?

Filenames are part of your URL and so are an important part of your HTML.

Answer:

When you create a Web page, you need to save that page as a file on your file system. And for that you need a name. While you can name your file nearly anything you choose, there are some rules of thumb to apply to make sure that it displays correctly in the most situations.

  • Do not use special characters
    For best results you should only use the letters a-z, A-Z, the numbers 0-9, hyphens (-), underscores (_) and periods (.). Any other character could get you in trouble, causing the file not to load or the page to load incorrectly.
  • Do not use any spaces
    Most operating systems can handle documents with spaces in the file name without a problem, but it's not a good idea for Web page documents. The problem is that when a URL is displayed it is usually displayed with an underline. And so many people interpret a space as being the underscore character instead, and so can't get to your page. Plus, in order to use a space in a URL or Web file name, many browsers require that that space be encoded - either as a plus-sign (+) or %20.
  • Start the file name with a letter
    While this isn't absolutely required, some programming languages give numbers special notice, and so a file starting with a number might not be treated as a file.
  • Use all lowercase
    This is also not an absolute requirement, but it is a good plan for maintaining your website. While many personal computer operating systems are case insensitive, most Web server operating systems are case sensitive. This means that your Windows machine might see "Filename.htm" as the same as "filename.htm" - but your Web server would see that as two different files. This is a very common reason why images don't display on beginner websites.
  • Keep your filenames short
    While the total URL length is something like 2000 characters, it's a good idea to keep the whole thing as short as you can without sacrificing readability. I recommend creating filenames that are no more than four or five words in length - or around 30 to 50 characters.

Don't Forget the File Extension

Most HTML editors will add the extension on for you, but if you're writing your HTML in a text editor like Notepad, you'll need to include it yourself.

You have two choices for HTML files:

  • .html
  • .htm

There is really no difference between the two extensions, it's mostly a matter of personal preference which you choose.

HTML File Naming Conventions

When you're naming your HTML files you should keep the following things in mind:

  • People read the URLs and links for clues as to what the page is going to be. If your filename is clear, then you'll give your readers more confidence in your site.
  • Using words separated by hyphens can have some help in SEO because search engines read the URLs as well.
  • CamelCase, while popular with branding experts, can be very hard to read. Also, you run the risk of having a case sensitive file system not recognize that "filename.htm" and "fileName.htm" are the same file.
  • It's tempting to name files based on dates or other arbitrary methods, but editing the files later can be very difficult. If you were looking for a file about file names, which do you think would have the information, the one called "aa072700a.htm" or the one called "files-and-filenames.htm"?

Good file names for Web pages are easy to read and understand. They can be used by readers to understand your site and by yourself to remember what a page is about.

Good file names are easy to remember and make sense within the entire hierarchy of the site.