I had a meeting in one of our county offices earlier this week. While talking with their wonderful support staff I mentioned using an image of a document on the website to link to the actual document. It’s more visually pleasing then just text and easy to do. They were eager to learn how and very happy with the results, so I figured I would share the technique here for others. Here’s what you do:
- Bring the image of the front page of your document up on screen. Make sure the whole page is visible.
- Click on the PrtScn key (print screen) which is generally located to the right of your F12 key. You won’t see anything happen, but it takes an image of your screen.
- Click on Start > All Programs > Accessories > Paint
- Click the Paste button (or CTRL V). An image of your screen will appear.
- Depending on the version of Paint on your computer, you may be able to select the area (page image) you want and then crop it, but I prefer to wait until I open it with Photoshop. Do whatever feels best for you.
- Click on the drop down arrow at the top right and choose Save As. Save as a png file. It will look great and the size will be small.
- Save the file to your desktop for easy access.
- Open the file with Photoshop.
- Choose the crop key (marching ants square) and crop the image to the page.
- If you are planning on using the image in the “What’s New” box, you need to make sure the image is 165px wide or less. The height does not matter as much. Click on Image > Image Size and resize to 165px wide. Be sure “Constrain Proportions” is checked so the width will change with the height proportionally.
- Save the file.
- You are now ready to place the image on the website.
Once you add it to the website, click on the image and choose the link command. Link the photo to the image. Remember, if you don’t want the image to have a blue square around it, right click on the image, choose properties and choose “0” for the border size. Give it a try and let me know what you think.
No comments:
Post a Comment