Getting a Great Screen Shot

I have been doing a lot of technical blogging and writing lately; in doing this I need to take screen shots of dialog boxes, browser screen, etc… Good screen shots can break up text, make the blog post visually appealing, and help the reader navigate through the task you are writing about. I wanted to share a few of my tricks on getting a good screen shot.

Alt – Print Screen

My preferred way of getting a good screen shot is to use the print screen button, usually located at the top right of your keyboard. This is great for capturing the whole screen. However if you just want to capture the active dialog use Alt-Print Screen. This doesn’t require any cropping. It is almost impossible to correctly crop with the Aero theme in Windows Vista or Windows 7, because it is hard to tell where the borders of the dialog end.

Use Notepad as a Background

When taking screen shot on Windows Vista or Windows 7 using the Aero theme you can see the applications behind in your title bar. To avoid this, open notepad and maximize it to full screen. With the default colors, notepad’s background provides a nice white backdrop for the window you are capturing. Move the window (it should never be maximized) you are capturing into the middle of the notepad window and you will have a clear title bar.

Web Screen Shots

The trend these days is to use a fixed width, center align main panel for your web pages; twitter is an example. The standard size for these is 960 pixels, so they appear nicely on a 1024 wide screen. 1024 pixel wide screen is the most prevalent minimum size screen. With this in consideration you don’t want to take a screen shot wider than 900 pixels – it will not fit on the web page. To easily accomplish this, reduce your screen resolution to 1024 width. Most of us are running very large screens, which make lots of text look great, however make for bad screen shots. By reducing your screen resolution you get bigger text, smaller widths and better screen shots.

Embedding the Image in Word

When you embed the image in a Microsoft Word document, word will resize it to fit the width of the page. This is not what you want; you want the original image at the original size. The person publishing the web page will resize the image; resizing it only once keeps its clarity.

When you embed the image in Word, right click on the Image choose Size from the drop down context menu, and then the Reset button in the Size dialog.  It will look big in Word; however it will be saved full size.

Security Considerations

To protect my own security I blur all references in the images of these things: Client hardware address, Magic cookie, Host name, Server host name, Server identifier, Subnet mask, Domain name, Domain Name server, NBOverTCPIPNameServer, Computer name, IP address, logins, and passwords. I usually use the spray can feature in Microsoft Paint.

Edit with Microsoft Paint

Starting in Vista and continuing on to Windows 7, Microsoft Paint will allow you to save your images and jpegs or gifs, which is great for web publishing. Once I press the print screen button the image is stored in the clipboard. Then I:

• Open Microsoft Paint
• Reduce the default working area to a very small size (smaller than the screen capture).
• Paste in the image from clipboard. The working area is automatically expanded to include the whole working around.
• Make security edits.
• Use the cropping tool to crop only want I want.
• Copy the cropped area into clipboard.
• Paste it into Word document.

Third Party Products

There are many third party products that produce better screen shots than the techniques above, however everything above is free and is installed with Windows.

 

{6230289B-5BEE-409e-932A-2F01FA407A92}