Dot vs. Pixel - rudimentary explanation

Question

I've read many explanations, but either they all are too abstruse or they gainsay each other.

Why Dots Per Inch Isn't Pixels Per Inch

A dot refers to ink density, effectively; a pixel refers to image density on a screen.

Well what does "density" mean?

A quick PSA on "dots" versus "pixels" in LCDs | TechCrunch

It’s actually pretty simple: LCDs are made up of pixels, and pixels are made up of dots.

joojaa's answer is similar.

No, each pixel is represented by multiple dots*.

But Scott gainsaid all this.

There is absolutely zero correlation between pixels and dots. None.

Then I tried Alan Gilbertson's answer.

A pixel (the word was originally coined, iirc, by IBM and derives from "picture element") is the smallest indivisible unit of information in a digital image. Pixels may be displayed, or they may be printed, but you can't divide pixels into smaller pieces to get more information. How many channels and bits per channel make up one pixel is the measure of how subtle the information in a pixel may be, but the basic fact is that 1 pixel the smallest increment of information in an image. If you do video, you know that pixels don't have to be square -- they are non-square in all older video formats. Square or not, a pixel is still the smallest unit of a picture.

The sentence colored in gray addled me. What are "channels" and "bits per channel"?

An inch (okay, so you know this already -- bear with me) is a unit of linear measurement on a surface, which could be a screen or a piece of paper.

A dot is, well, a dot. It can be a dot on a screen, or it can be a dot produced by a printhead. Like pixels, dots are atomic. They're either there, or they're not. How much fine detail a screen can display depends on how close the dots are (what they used to call "dot pitch" in the old CRT days). How small the dots are from an inkjet, a laser printer or an imagesetter determines how much fine detail it can reproduce.

What does "atomic" mean? I feel I need to know some physics to understand this answer!

Rafael's answer is the least abstruse, but it still refers to recondite terms like "the bit depth".

Answer 1

In simple, rudimentary, terms...

• A dot is the smallest possible spot of ink on paper.

• A pixel is the smallest possible spot of light on a screen.

Dots are never on a screen and pixels are never on paper.

---

This does not cover how pixels are made. Nor does it cover how ink is made. If you care about construction of either, then a rudimentary explanation is another matter, especially where pixels are concerned since they are intangible and not a physical object, unlike dots/ink.

Upon output (printing) pixels are translated, via mathematical formulas, to dots. Such formulas could mean 1 pixel = 2 dots or 2 pixel = 1 dot or 1 pixel = 15 dots... there's no direct correlation between pixel and dot. It's the output formula which determines how a given number of pixels may relate to dots.

Answer 2

(It's clear now that a simple answer to this question doesn't exist. Our language simply isn't precise enough. I like the two other answers, but would still like to give an answer seen more from the viewpoint of a graphic designer.)

A pixel is simply the smallest unit of an image. An image file is a collection of pixels. Nothing more than colored squares in a grid. The pixels don't have a physical size until you assign one to them and they are not necessarily the same as the pixels you see on a monitor. It depends on how you choose to display them. They are to be seen as an abstract idea. Pure information.

You might be making pixel art for a game. So you design your graphics by coloring a grid of pixels. But when you display the graphics, you probably scale it up several times. On the design level, your pixel character can still be said to consist of for example 7×12 pixels even though it might be taking up 28×48 pixels on the screen.

So we live with different meanings of the word "pixel".

Likewise, when working with design for print, a pixel in itself have no meaning in a physical sense. In vector layout applications, you often place images at different resolutions in the same document. You can even rotate or stretch the images.

In this (very ugly) collage from InDesign, because we have defined a physical size for each image, the four images now have each their own resolution measured in PPI (pixels per inch). The stretched image where the pixels aren't square have a different resolution horizontally and vertically.

A dot is, for a graphic designer, a less ambiguous term. It's the smallest square a printing device can print. Unlike a pixel, a dot does have a physical size although it differs from device to device.

Most (if not all) printing devices can only print solid inks. Either there is color applied or there isn't. Like an old-fashioned stamp. So they need to have a rather high resolution of dots to be able to make some kind of pattern to create the illusion of different colors.

For example the offset machine we have at my job use printing plates that has a resolution of 2400 DPI (dots per inch). When a document is sent to the so-called RIP (raster image processor), it creates a 1-bit image of each CMYK channel. The tints of the original pixels are interpreted into different densities of halftone screen. These patterns are made of dots.

Note that the circles of the halftone screen are not what we talk about when we say "dots". The dots are the square elements which the circles consist of. Of course they are saved as pixels in an image file, but at this stage of production we still refer to them as dots.

Below is a close-up of part of the collage from above after being interpreted by a RIP. It shows all four CMYK channels layered on top of each other. The original pixels are sort of used as masks for the halftone raster. It's one big messy soup of pixels at different PPI, normalized into halftone raster at one specific DPI.

The 1-bit images of each channel are burned onto printing plates and thereby the dots become physical. Ink is applied to the plates and then pressed onto paper. So the dots are directly transferred to paper, but the original pixels are long gone.

(I'm focusing on offset print as its my expertise. On a digital printer like an inkjet, the process is different but more or less follows the same principle.)

Answer 3

This is more like a long comment than a answer.

The reason why you fail to get this is simply you have no need for this information. The only way you can ever understand this is if you care about the actual technical implementation details of the underlying system. In this case a printer and a screen. Since you most likely live in a all digital world you will likely never get it nor does knowing this benefit you at all.

Human language is not fixed enough that the definition of a dot is so definitive that you can not say a screen does not contain dots. The definitions of the words depend on context, audience etc. Most humans dont write academically correct language at all times. In fact they can not as the meaning of the word dot and pixel varies depending on what academic field they would follow some persons might need to cross fields. In fact monitor manufacturers sometimes call technical elemens of pixels dots.

But they are indeed different. Its just that dividing something into only two categories is a bit misleading. There are several different ways to implement screens and several ways to implement printers. Lumping them all under pixels and dots is a bit arbitrary. But as long as you talk of:

• Laser printers and offset printers
• Most generic color screens

Then it is ok to divide them in two categories. But just be aware that once you start talking about inkjets, or some exotic system like chemical or heat based printing it becomes increasingly harder to keep up the appearances that this nomlencature makes sense.

So roughly speaking saying that a dot is printed and a pixel is on screen is prudent. But i dont like that definition as it lacks predictive value. I would much rather point to the fact that we mentally treat them differently. For some reason we treat a pixel as whole all included in one even if the color channels are separate sub pixels, and may in fact be grouped in some wierd stochastic clumping. This leads to:

• A pixel has any amount of intensity in all 3 colors
• While a dot has one intensity, on or off one color.

So they do not compare very well. A pixel is more like a group of dots (called a halftone screen), so its disengenious to compare dots of a printer to pixels of a screen. Its much more honest to compare a pixel to the size of your halftone. But then that wouldn't allow so much marketting bulshit to happen.

Answer 4

In the beginning, there was no difference between a dot and a pixel - the two terms were interchangeable. That's why you still encounter the term DPI in contexts where they're clearly referring to PPI. Even on a CRT where it was clear that a single pixel lit up a varying amount of phosphor dots, nobody bothered to draw the distinction.

As technology progressed, clever people figured out that you could subdivide a pixel to provide variations on pixel brightness. A pixel subdivided into dots where half the dots are dark and half are light would look like it was at a 50% intensity. "Bit depth" is how you describe the number of possible variations of intensity; for example 8 bits allows for 256 different levels of intensity, because that's the number of unique values you can represent with 8 binary digits.

I think you already understand the "per inch" part of the equation. As the density of elements per inch goes up, whether they be dots or pixels, the sharper your image will appear.

Answer 5

Some units are very precisely defined. Others much less. And you'll learn that some can have very different definitions depending on context or whoever you're talking to.

Supposedly, a pixel (picture element) is the smallest addressable unit on a screen. So your screen may have 1920 x 1080 pixels ("full HD"), with each pixel being able to have a different color. But RGB pixels are actually made of 3 elements (sub-pixels), one for each channel: one red, one green, one blue (sometimes one is doubled). And some technologies (e.g. ClearType) will actually use those subpixels individually to take advantage of the higher resolution for anti-aliasing purposes (this requires knowing how the sub-pixels are arranged, and in what order).

Some people will tell you each of those sub-pixels are dots. Others won't and tell you the pixels are dots. Some people (a minority, though) will even tell you that each of the sub-pixels are actually the pixels (this is most common coming from the actual display manufacturers).

It is worth noting that screens can vary the intensity of each sub-pixel. This is where the bits per channel come in. Each sub pixel is not just on (full red, green or blue) or off (black) — this would only give us a total of 8 colours: black, red, green, blue, yellow (red+green), purple (red+blue), cyan (green+blue) and white (red+green+blue).

Instead, each sub-pixel (channel) can take a number of values between the two. If you have 8 bits per channel (so a total of 24 bits for RGB), that means each of those sub pixels can take 256 different values (1 bit = 2 values, 2 bits = 4 values, 3 bits = 8 values, and you continue doubling until 8 bits = 256 values). So in total, you get 256 x 256 x 256 = 16 million colours.

---

The dot is more commonly used in print. Initially, on black-and-white printers, where each dot can only have two states: it is white (no print/no ink) or black (print/ink).

Note that on printers (especially inkjet printers), dots can be larger than the spacing between them and overlap (usually the opposite for pixels, which if you look very very closely may have a bit of space between them), though of course older dot matrix printers usually had spaces between dots.

Contrary to screens, printers usually don't handle anything but on or off (printed or not, ink deposited on the paper or not). You can't get a half-printed dot. So to get grayscale, or a large variety of colours, one will use patterns (called halftones). To have something quite dark, you set most dots to black. To have something quite light, you'll set only a few. Likewise to get any colour you want, you'll combine multiple patterns on top of each other, one each for cyan, magenta and yellow (and usually black for best results).

If you look at large billboards e.g. in subway stations, which are produced by expanding a smaller image, you'll see those patterns quite clearly.

To achieve the same kind of results you would on a screen (in terms of number of colours), you thus need multiple dots for each individual unit you want to assign a different colour to. For instance, if you want to have the same 8 bits per channel, you need to be able to print anywhere between 0 and 255 ink dots for each unit. That requires 256 dots, or a square of 16 x 16 dots.

Note that you may think that 8 dots are enough, with each dot matching one bit, but that's not the case. In an 8-bit channel, each bit has a different weight, while all the dots have the same weight. So you need a lot more.

This means that if all those dots where arranged in a perfectly rectangular fashion, you need 16 times more dots in each direction to achieve the same result as a screen (in term of number of colours). That's one of the reasons why professional printing usually uses resolutions of about 1200 or 2400 dots per inch. In the end, this is not much better (for pictures) than a screen at 75 to 150 dpi (but it makes a whole lot of a difference for cases where you're printing pure black and white, like text, because you don't use halftones for those). The resolution once you take into account the pattern size is measured in... lines per inch.

This is the reason why, in print, in you want a specific colour but also need fine detail, you won't print in regular CMYK, but actually have a separate channel using a predefined colour with will use a specific ink. So if you want very readable purple text, you won't print it as a combination of cyan and magenta (which will give a very fine grid of dots mixing the two, and you'll end up with "fuzzy" text), but directly using purple ink. That's where Pantone colours and other palettes come in, they're actually inks (of course this is for professional offset printing, usually not on your home laser printer which can only use the standard inks).

You'll notice that I mentioned "dots per inch" (dpi) both for printers and for screens. Yes, "dots per inch" for screens are actually pixels per inch. Same thing for your screen's "dot pitch".

---

If that wasn't complex enough, some units also have standardised sizes. As for a long time computer screens had vaguely similar resolutions (in dots per inch) usually in the 70-90 dpi range, programmers often measured things in pixels rather than more absolute units like points (1/72 of an inch), mm, cm, picas, or whatnot.

The problem? When higher-resolution screens (e.g. the "Retina" screens) came along, anything that was measured in pixels would become a lot smaller if the relationship with the physical pixel was maintained, not the intended effect.

So some technologies (like CSS) define a pixel as being something which is not a physical screen pixel! They actually define it as 1/96 of an inch.

This gives quite interesting discussions between CSS pixels and actual physical pixels. This page for instance will show you the difference between "points" used by programmers/designers (which are not actual 1/72 inch points, and in the context of CSS, are the same as CSS pixels), rendered pixels (using an integer ratio), physical pixels (after bit of downsampling the match the actual number of screen pixels) and physical size.

Welcome to the wonderful world of pixels and dots!