This is the first part of a two part series (see part 2)
I know you’ve been there. We’ve all been there.
It starts as a simple request from a client “Hey, can we just add a photo gallery to that page”.
You reply “Of course! Just send me the photos you want added and I’ll take care of it.” Simple enough right?
In your super-intelligent brain, you think to yourself “Self… I’ll just install NextGen Gallery, upload a few photos and I’ll be done. Easy peasy”.
Yeah right… but not so fast partner.
Your client innocently asks if you can “just swing by and pick up a flash drive of photos”.
Now you’re thinking “What? Why would I need a flash drive for a little gallery, just email it to me.”
But, you’re all about good customer service so you stop by and pick up the flash drive. You pop it into your computer and you’ve got something that looks like this:
267 photos and it’s 14.7GB? 14.7GB? Seriously?
That’s wayyyyyyyyy too big for a website photo gallery. The files are huge, some are tiff’s, some are gifs and the filenames are horrible.
So what do you do?
Let me show you.
Start By Renaming
The first problem is that the filenames are awful. You can tell that multiple cameras/phones were used (based on the sequence of some of the files), they tried to rename some files, some they didn’t and some are even spelled wrong.
It’s a disaster the Red Cross wouldn’t touch (and sadly, this is very common).
So let’s start by bringing sanity to the filenames, to do that we’ll need a free Mac app called NameChanger. You can get by going to the Mac App Store and searching for NameChanger or by going here and downloading it directly.
As you can imagine, NameChanger changes filenames in bulk (and we need some of that). Once you install it, launch it and the first screen will look like this:
There are a few ways to load the files you want into that window, you could click the Add button in the top-left corner and browse to them OR you could take the lazy way and select all the files you want to add and click and drag into the window. Like this:
However you get the files in there, your screen will now look like this:
With the files loaded into NameChanger, the first step is to click on Options then check the box for Hide Extensions. Like this:
When you did that, did you notice that the file extensions disappeared? We need to do that so that when we rename them all it will keep the original file extension (and not overwrite/remove them causing the files to be corrupted).
The next step is to click on the drop down in the middle of the window and choose Sequence, like this:
This option allows us to rename the files with a sequential number at the end. As soon as you click that, a new popup (titles Sequence) appears and it looks like this:
You want to start by giving it a Sequence Name. This will be the beginning part of the filename.
Since all these photos are going into a photo gallery, I’m going to give it a Sequence Name of photo-gallery-.
Did you notice the extra dash (-) I added to the end? This just helps space out the sequential numbers so they are not right up against the name.
If you look behind the Sequence popup window, you’ll also notice that there is a column named Renamed Filename, this show you what the filename will be with the current options selected. Do you see how it added photo-gallery-000 to the end first one? This is just a preview of the filename so you know that you are setting it up right.
But we are not done yet.
The last options we need to change are
- Location, choose Replace Entire Filename. As you can imagine, this will remove all the disaster filenames and leave the sequential filename.
- Starting at, change that to 1. This makes the first sequential number 1 instead of 0. I just think it’s weird that the first one would be 0.
Once you’ve done that, let’s take the final step… click the blue Rename button.
Now go checkout the folder of images! Look at the gorgeous filenames.
Welcome to filenaming zen young warrior.
Half Way Done
So the filenames are good now, but there is an even bigger problem. The file SIZES are huge and the dimensions are all random sizes! We need to bring some order to this.
We’ll tackle that in the next part in the series where you’ll learn how to let Photoshop do all the hard work for you.
Stay tuned for Part 2.
Amy & Ian Anderson
PS: Here is a little video showing you a slightly different way of getting photos into the app and how to change the order/numbering:
All Blog Posts
Copy & Paste FAQ
Learn Gravity Forms Fast
Managing Your Server
Web Design Business
Web Design Inspiration
Web Design Tutorials