Photoshop File Formats: PSD, TIFF, JPEG and PNG – Day 3

File Formats Explained

Photoshop can read almost anything you hand it, which is why the format question only really bites on the way out. Two dialogs, seven formats, and a lot of guessing.

The way to keep it straight is to stop thinking about formats and start thinking about jobs. There are two: a working file you can still take apart, and a delivery copy for a browser, a printer or a client. Save As handles the first job. Export As handles the second. Nothing in either list does both.

Make the Edit First

There has to be something worth saving, so the tutorial starts with a quick two-layer grade on a JPEG straight off a stock site.

1. Add a Brightness/Contrast Adjustment Layer

   From the Adjustments panel (Window > Adjustments if it is not open). Push the brightness up until the subject reads properly. It lifts the whole frame for now, which is the next problem to solve.

2. Mask It With a Reversed Radial Gradient

   Click the layer mask thumbnail, not the adjustment thumbnail — the white outline tells you which one is selected. Take the Gradient tool (G), choose black to white from the Basics group, set the type to radial, and drag out from your subject. If the result is dark in the middle, tick Reverse in the options bar. The brightening now sits on the subject and fades away toward the edges.

3. Color Grade With a Gradient Map

   Add a Gradient Map from the Adjustments panel and pick a gradient from the Properties panel. At full strength it will look absurd — that is expected. Drop the layer opacity to somewhere around 10–20% and it turns into a color grade. Double-click the adjustment thumbnail any time to try a different gradient.

Two adjustment layers over a background. Nothing has been baked in, which is the whole reason the next decision matters.

The Four Formats Under Save As

These all preserve your layers. They differ in size limits and in what else can open them.

PSD — Photoshop Document

The default, and the right answer nearly every time. Keeps layers, masks, adjustment layers, vectors and type. Capped at 2 GB. Its one weakness is portability: outside Adobe’s own apps, support is patchy.

Large Document Format — PSB

PSD’s big brother, for files past that 2 GB ceiling. Same feature set, and it handles canvases up to 300,000 × 300,000 pixels — territory you only reach with a poster full of high-resolution Smart Objects. Do not reach for it by default. Save as PSD and let Photoshop tell you when the file is too big; it will offer PSB itself.

Photoshop PDF

Raster and vector in one file, with layers optional and embedded fonts if you choose to embed them. You also control the compression on the way out. This is the client-proof format — it opens in Acrobat, Illustrator and InDesign as well as Photoshop, so the person receiving it does not need your software.

TIFF

Layers optional, transparency supported, high bit depth, and you can write it completely uncompressed. Files are large. It is the standard in print, archiving and professional delivery, and it is what a commercial client or a print house will usually ask for, because almost every program on earth reads it.

The Three Formats Under Export As

These are delivery copies. All three are flat — the layers are gone the moment you export.

JPEG

Flat, no transparency, and compressed by an amount you choose. Best for photographs, web images and social. The compression is lossy, so the trade is always quality against file size, and you get to pick where on that line you sit.

PNG

Supports real transparency and does not throw quality away, which also makes it enormous for a photograph. Right for logos, icons, UI elements and anything that has to sit on a transparent background. Wrong for a full-size photo destined for a web page.

GIF

Limited to 256 colors, so photographs come out banded and flat. Its reason to exist is frame-by-frame animation. Transparency is 1-bit, meaning fully on or fully off — there is no 50% transparent pixel in a GIF the way there is in a PNG. Use it for simple web animations, memes and small low-color graphics.

What the Numbers Actually Look Like

Same image, same export dialog, and the spread is not subtle. At maximum JPEG quality it comes out around 14 MB. Pull the quality slider down and zoom to 100% and the difference is very hard to see, while the file drops under a megabyte. Scale it to 50% at that quality and it lands at roughly 345 KB.

Switch the same file to PNG at full scale and it climbs to about 44.6 MB.

That is the whole argument for JPEG on the web in one comparison. Choose the lowest quality that still looks right at 100%, rather than the highest quality the slider offers.

Export Two Sizes at Once With Scale All

Top left of the Export As dialog there is a Scale All panel, and it is the most useful thing in there.

1. Set the First Size to 1x

   Give it a suffix so you can tell the files apart later — something like @1x or -full.

2. Click the Plus Icon and Add 0.5x

   Suffix that one too. You can keep adding rows for as many sizes as you need.

3. Export Once

   Photoshop writes every size in a single pass into the folder you choose. In the example, full size came out at 2.3 MB and the half-size version at 712 KB — both from one click.

Always Convert to sRGB

At the bottom of the JPEG settings, tick Convert to sRGB and Embed Color Profile. Browsers and phones assume sRGB, and an export that skips it is the usual explanation for colors that looked right in Photoshop and went dull or strange after uploading.

Which One, When

JPEG for photographs, gradients and anything where a small file matters. PNG for transparency and hard-edged graphics like logos and icons. GIF for short, low-color animations and deliberately retro limited-palette graphics. TIFF when it is going to print or into an archive. Photoshop PDF when a client needs to open it without Photoshop. PSD for everything you intend to work on again.

Save the PSD, Export the Rest

Open the sample file, run the two-layer grade, save a PSD, then export the same image as a JPEG, a PNG and a GIF and compare the file sizes on your own machine. The numbers make the argument better than any rule of thumb.

Then reopen the PSD and change the gradient map. Every export you just made is disposable; the PSD is the only file that lets you do that. Day 2 covered the open-edit-save loop these formats sit inside, and tomorrow Day 4 gets into layers — the thing the layered formats exist to protect.