Why your screenshots look blurry (and how pixel density causes it)
You take a screenshot on a modern laptop. It looks perfect. You paste it into a document and the text has gone soft and slightly smeared.
The capture was fine. Something between the capture and the page resampled it, and resampling text is destructive in a way that resampling photographs is not.
Logical pixels and physical pixels
A high-density display draws roughly two physical pixels for every logical pixel the interface is designed around. A window the operating system considers 800 points wide occupies about 1600 physical pixels on screen.
When you screenshot that window, you get the physical pixels — a file about 1600 pixels wide. That is correct and desirable: it's the full detail the display was showing. But it also means the file is around twice the dimensions you might expect, which is where the trouble starts.
The four ways to lose it
Downscaling to "fix" the size. You see a 1600px file, decide it's too big, and resize it to 800px. Every pair of pixels is averaged into one, and text edges that were crisp become intermediate greys. This is the most common cause by a wide margin, and it's entirely self-inflicted.
Upscaling a standard-density capture. The reverse. A capture taken on a non-high-density display, then displayed larger, has no additional detail to draw on — so the software invents intermediate pixels and everything softens.
Lossy compression. JPEG works by discarding high-frequency detail, and sharp high-contrast edges are the highest-frequency thing in an image. Text edges develop faint halos and speckling. This reads as blur even though the geometry is untouched.
Browser or app zoom at capture time. Capturing a page at 110% zoom means the browser has already resampled the text before you photographed it. The capture faithfully records something that was already soft.
Fixing it
Capture at native resolution and don't resize. Let the file be large. If the destination needs it smaller, control that with display dimensions rather than by resampling the file — in HTML, set a width in CSS and let the browser render the high-density source into that space. It stays sharp because the extra pixels are still there.
Reset zoom before capturing. Cmd 0 or Ctrl 0 in a browser.
Keep screenshots in PNG. Lossless, no compression artefacts around text.
If you must resize, halve exactly. Going from 1600 to 800 — precisely 50% — maps each 2×2 block to one pixel cleanly. Arbitrary ratios like 73% force interpolation across pixel boundaries and look markedly worse.
Mixed-display setups
Plugging a standard-density external monitor into a high-density laptop means captures differ depending on which screen the window was on. The same dialog produces a 1600px file on one display and an 800px file on the other.
If your documentation mixes both, images will visibly disagree in sharpness. Pick one display for capture work and stay on it — usually the built-in high-density one.
The rule that covers most cases
Capture big, display small, never resample.
A 1600px-wide screenshot shown in a 700px column looks excellent. The same screenshot resized to 700px and shown at 700px looks soft. Identical final dimensions on screen, visibly different result — because in the first case the detail is still in the file, and in the second it was thrown away.