What's In A Name Anyway?

Written by: Eric Kiefer | May 13, 2023

Proper naming of files and URLs can save you time and stress

As a web developer, I have accepted content from the public for decades. I have seen things that would make both my 2nd grade English and 11th grade computer science teachers squeal in unison. In the world of computers, it is very important to follow some simple standards in file naming. Unfortunately both Windows and MacOS have gone to great lengths to allow users to create any file name they want, no matter how absurd. Once we look to the online world, things change quite a bit. Linux, the operating system running most web servers (well, the good ones), is much more strict and is case sensitive. That means that it rightly sees X as something completely different from x. Delivering web content also involves some reserved characters in the URL. A forward slash, / , is a great example of a reserved character that would simply not work in a filename when it was used as a URL. So if you had a file called this/picture.jpg the url would be yourwebsite.com/this/picture.jpg and would return an error since there is no directory called "this". # is another character that would absolutely confuse your webserver. Picture#1.jpg would have your browser looking for an anchor point called "1.jpg" in your document "Picture" so that would also return a file not found.

The best solution for this would seem to be to enforce this naming policy programmatically, so when you upload an image to a website, for example, it is automatically renamed correctly. That said, not every developer thinks of this, and there are plenty of systems that will allow you to upload a bad filename, but will not know what to do with it once it has been uploaded. The only surefire way, however, is to have a naming policy and enforce it within your company.

Think about portability

Think about where an image might end up. If it will be anywhere near the web, it is important to stick to using unreserved characters, no spaces, and all lower case. My Silly's Picture #4.jpeg should simply be my-silly-picture-4.jpg. Using lowercase is the best way to ensure that your filenames and urls will always work. A URL like www.website.com/MySpecialFolder/MySpecialPage.html is an absolute nightmare. One missed capital letter means your beautiful custom 404 page was shown instead of your content. For that reason, URLs should only include lowercase letters.

Hyphen or Underscore?

This is kind of a funny one. It really doesn't matter, but hyphens tend to look better. That said in most modern GUIs like Windows or Mac, when you click on a filename, a name with underscores will be viewed as one word while the hyphens will make two. For example click on both of the following: this-filename.jpg or this_filename.jpg

Just do it... no buts!

This is one of those things that will make your company more organized, more consistent, and give your web designer fewer headaches. Start a file naming convention and stick to it! For more reading on this, check out the following links:

Google Developers Style Guide: Filenames
Princeton University Library Data Management Best Practices


Create Content Your Web Developer Can Use Posted on: July 27, 2023 When it comes to pictures, text, etc., organization and outlining are your friends.
WebP Or Not WebP, That Is The Question... Posted on: April 7, 2023 Next-gen image formats speed up your website without sacrificing quality.