Clipdaythe right-size picture: a reference on image formats and preparation

An independent reference on image formats and preparing pictures. It does not distribute images or files, does not give legal advice and is not affiliated with the previous site on this domain.

Glossary

Glossary of terms

A picture's save dialog is full of words that sound more impressive than they are. Resolution, anti-aliasing, color model — each one stands for a simple idea, and understanding it beats guessing which box to check. Here's a short guide to the main terms.

Half the questions about pictures go away as soon as it's clear that “resolution” and “size” are not the same thing.

— Editor's note

How to read the glossary: each definition fits in a couple of sentences and needs no formulas. Terms are grouped by meaning, and we've left alphabetical order alone.

Pixels and size

Pixel
The smallest dot of a raster image that has its own color. Like tiles in a mosaic, many pixels together make up a photo or a screenshot.
Resolution
The number of pixels in an image across its width and height. The higher it is, the more detail it holds and the larger the picture can be shown or printed without visible blur.
Dots per inch
The density at which an image is laid down on paper. It links pixels to the real size of the printout; for print, people often aim for 300 dots per inch.
Aspect ratio
The ratio of an image's width to its height. If it doesn't match the space the picture is going into, you have to crop it or leave margins, and stretching distorts the proportions.

Raster and vector

Raster
A way of storing an image as a grid of pixels. It handles photos and smooth color transitions well but loses sharpness when enlarged.
Vector
A way of storing an image as lines, curves and fills. The picture is recalculated for any size and stays sharp, which is why logos, icons and diagrams are stored this way.
Bézier curve
The basic building block of vector graphics: a smooth line whose shape is set by anchor points and direction handles. Dragging them changes the bend of the line, not individual pixels.
Transparency
A property of an image where some pixels are left unpainted and the background shows through them. PNG and SVG support it; JPEG does not.

Compression, color and captions

Lossy compression
Shrinking a file by discarding fine details the eye is less likely to notice. This is how JPEG works. Every repeated lossy save degrades the picture a little more.
Lossless compression
Shrinking a file without changing the image: once opened, every pixel is exactly as before. This is how PNG works. Files come out heavier, but you can re-save them as often as you like.
Color model
A way of describing color. Screens use RGB, where color is built from red, green and blue light, while commercial printing uses CMYK, where color comes from mixing inks.
Alt text
A short description of an image for people who can't see it: when using a screen reader or when the image fails to load. Good alt text says what's in the picture and why it's there.
  • Comparisons

    Raster vs vector, JPEG, PNG, SVG and PDF, screen vs print: tables that help you pick the right format and size for the job.

  • Guides

    Step-by-step guides: crop, shrink and compress a picture and get it ready for an email, a slide or print. The article catalog lives here too.

  • Tools

    The kinds of programs and features that help with images, from the built-in photo viewer to a vector editor and the eyedropper.

  • If it looks off

    What to do when a picture turns blurry or jagged, gets too heavy, loses its transparent background or looks dull on paper.

  • Questions

    Answers about this reference, about picture sizes and formats, about printing and about using images found online.

Sources

  • Documentation for graphics formats and editors (general principles)
  • Clipday editorial materials

This advice is written in general terms as of the date it was prepared. Menu items, save dialogs and export settings are named differently from one editor to the next and change with updates, so check the help for the program you actually use rather than matching our wording exactly.