Note: You can print this (or any page) from your web browser by selecting File/Print. This information is provided for your personal use only and is not to be redistributed without permission of the author. Copyright 1998 Laurie McCanna, Web Diner Inc.

How to Create a Perfect Screenshot Painlessly

This tutorial will teach you how to create a screenshot of any web page or capture any screen event. Step by step instructions are given for Photoshop, but you could also use this tutorial with Corel PhotoPaint or Paint Shop Pro or even MS Paint.

1. Open the web page in the web browser. On Windows, press the Print Screen or Prnt Scrn key on your keyboard, found at the upper right of the keyboard. Betcha didn't ever notice this key before! This key will capture the entire screen. If your monitor resolution is set to 640x480, that's the size of the screen capture. If your monitor resolution is set to 600x800, that will be the size of the screen capture, etc.

To capture only the active window, press Alt + Print Screen.

On the Mac, press Command + Shift + 3.

2. Next, open up your paint program - you can use virtually any paint program, including Photoshop, Paint Shop Pro, Corel PhotoPaint, or even Microsoft's Paint, usually installed on Windows in the Start/Programs/Accessories/Paint.

3. In the paint program, select File/New, then Edit/Paste. Pretty simple, right? Your screen capture is now ready to be cropped or scaled. opposite direction.

Troubleshooting Screen Captures

The trouble with screen captures comes when you need to scale them for print or the web. Because your screen resolution is so small, any resizing usually obliterates the type within the screen capture. To minimize the changes to your screen capture, try these tips:
  • If you scale (resize) the screen capture, make sure that you resize proportionately. Problems occur when you rescale more in one direction than another, ending up with something like a wacky hall-of-mirrors effect.
  • If you need to print the screen capture, try changing the dots per inch size rather than resizing the image. For instance, if your screen capture is 640x480 at 72 dpi, and you need it to fit on a letter sized page, change the dpi to 100 or 150 instead of reducing the pixel size.
  • Resizing a screenshot to display on a web page? Since you'll need to reduce the actual pixel size it's just going to get fuzzy. You can minimize this problem by showing only part of a large screen capture as shown below:

    a screenshot example, showing how to crop in on only the necessary portion of the image

  • How do they get such nice looking text on screen captures in magazine ads? Simple, they fake it. In your paint program, erase the text, but leave the rest of the web page layout. Open the screen capture in a drawing program like Adobe Illustrator, or Corel Draw, or Quark, or Pagemaker, etc. Then recreate the text in your drawing or page layout program.

Some Useful Utilities

The little print screen trick above works fine for a few screen caps, but to create a lot of screen captures you'll want to use a handy utility like those listed below. You may already have a screen capture utility available to you: Corel Draw includes a utility called Capture which captures both still screens and onscreen animation, and PaintShop Pro also includes the ability to do screen captures.

One last point - you will definitely need a screen capture utility to take screen captures inside Photoshop.

Home | Guestbook | Tips and Tutorials Menu