Screenshots are one of the most common images in a blog post, and one of the most awkward. They arrive at whatever size the screen happened to be, often with a system frame around them, and they rarely fit the column they end up in. This guide walks through turning a raw screenshot into a clean image that sits well in a post, without special software.
Start by deciding what the reader needs to see
A screenshot usually contains more than the point you are making. Before resizing anything, look at the image and ask what the reader should notice. If it is one button in a settings window, you can crop away the desktop, the taskbar and any other open windows. If it is a full dialog, keep the dialog and trim the rest. Cropping first means every later step works on a smaller, more focused image, and the result is easier to read on a phone screen.
Crop to the shape the post expects
Blog themes usually give images a fixed width and let the height follow. A wide screenshot and a tall one in the same post will look uneven. Cropping to a common aspect ratio, such as the wide shape most post headers use, keeps a set of screenshots consistent. Crop tight enough that the interface text stays legible at the size it will display, and leave a small margin around the window so it does not look cut off.
Resize and convert in the browser
Once the screenshot is cropped, set the width to match your post column and let the height scale. If the file needs to be a particular format, convert it at the same time. The free tools at resizeimages.org run entirely in the browser, so you can resize by pixels or percentage, compress to a target size, convert between common formats, and crop, all without uploading the image anywhere. That matters when a screenshot shows account names, email addresses or internal tools you would rather not send to a server.
Check legibility before you publish
After resizing, open the image at the size it will appear in the post, not at full size on your own screen. Interface text that looked fine in a large window can turn into grey mush at half the width. If it does, go back and crop closer rather than scaling up. A tight crop of the relevant area reads better than a wide shot of the whole screen. It also helps to add a short caption naming what the reader is looking at, so the image still makes sense if it is viewed on its own.
Keep a plain original
Save the untouched screenshot somewhere separate from the version you edited. If you later change your theme or need a different crop, you can start again from the original instead of working from an image that has already been resized and compressed. A simple folder per post is enough.
Screenshots are often the clearest part of a technical post, and a little cropping and resizing makes them clearer still. If the screenshot is of an error message or a network problem you are writing about, the step-by-step fixes at Think Like a Computer can help you explain what the reader is seeing. Take the time to crop to the point, size it for the column, and check it at display size, and your images will do their job without distracting from the text.