Need to create a picture of a web page

keltra · #1 (**permalink**) 07-02-2004, 06:35 PM

I am not sure if this is the correct place to post this question. I am creating my portfolio page and would like to include a picture of the web sites I have created that will link to the site. I do not know how to accomplish this task. I designed them in dreamweaver and cannot find a way to do this.

Thanks in advance.

Tracy

redelk · #2 (**permalink**) 07-02-2004, 08:02 PM

Here's one way in windows... open a new file around 1280 x720 in your image editor (photoshop, fireworks, whatever)...open the dreamweaver page you want to copy, then preview it in whatever test browser you choose...during preview hit the printscreen button on you keyboard(should be the top row of keys next to scroll lock)...this copies the image to the clipboard.....maximize or open your image editor and paste the image onto the page...then you can crop and optimize the image to suit your needs... keep in mind that whatever you have open during print screen will be included in the pic's task bar in the image....acually takes longer to explain it than to do it.... hope it works for ya...

mushroom · #3 (**permalink**) 07-03-2004, 02:18 AM

There are also a number of screen capture programs out there

Just type "screen capture" into an SE........

keltra · #4 (**permalink**) 07-05-2004, 10:09 AM

Thank you so much. That worked perfectly.

Tracy
McCarthy's Business Services

grease · #5 (**permalink**) 07-05-2004, 11:35 PM

Press the 'prt scr' button on your keyword (print screen) then go to your graphic editor and paste.

Cheers

Mac 5 · #6 (**permalink**) 07-09-2004, 10:00 AM

On a Mac, open your site in a web browser. You can do a screen capture by pressing "command-shift-3" or to capture a selected area "command-shift-4" then draw a marque around your browser window. A graphic called Picture1 (or other number) will appear on your desktop. Double clicking it will launch Acrobat, but if you launch Photoshop and pull down "file open" you can open it in Photoshop to edit it, crop, splice together seperate images, etc.

justinw · #7 (**permalink**) 07-14-2004, 05:11 PM

So what is a good size for a profile picture?
And also, whenever I do that and save it the quality is bad. I have tried saving with JPG and GIF.

elso · #8 (**permalink**) 07-18-2004, 11:53 PM

I am not familiar with the techniques mentioned here as I use Corel for doing screen captures. But, screen capture images can be tough when it comes to resizing and they can become real poor quality. I usually do a high resolution capture to retain as much quality as possible. Again, I don't if the methods mentioned will allow you to set the resolution of the capture. If you are looking to capture some text in your shot, it may be helpful to capture or convert to 8 bit color. This will reduce the number of colors uses and thus sharpen any edges by reducing the color transition.

Nelson

grease · #9 (**permalink**) 07-19-2004, 12:41 AM

When you resize a screen capture in Photoshop you will lose quality. Your small image will tend to look blurry. The best trick is to use the unsharp tool. In the options palette drag the top slider all the way to the right, then next one to .2 and the next one to 0. This will do the trick!

Grease

Mac 5 · #10 (**permalink**) 08-18-2004, 09:20 AM

You could also do a combination of screen capture and redrawing the image.

-Open the screen capture in Photoshop and delete the text.
-Place the screen capute in Adobe Illustrator or Freehand.
-Go back to your original Dreamweaver file and copy the text and paste into Adobe Illustrator or Freehand.
-If you have vector artwork or higher resolution images delete them from the screen capture and replace.

Depending on how many websites you have this may be a lot of work, but your portfolio will apear a lot more impressive.

hal · #11 (**permalink**) 08-18-2004, 06:08 PM

Hi Tracy,

I like Corel PhotoPaint, myself. The process I use would be to click Print Screen to capture the page.

Assuming an 800x600 screen, I create a new blank 800x600 image in PhotoPaint. (If this is to be posted to the Web, I perceive a sharper picture if you also start with resolution 72 dpi rather than 600 dpi.)

Then click Edit > Paste as new selection. Then you can Edit > Resample to as small as 25% (200x150). The small type is lost, but you can still see that it's there. That's OK, though, because being a smart really cookie, you'll use that as a thumbnail, triggering a larger rendition when they click on it. <grin>

I also like to design for compatibility between 800 and 600 pixel screens. On such a page, I'd start with the 600x480 version, to capture just that much more detail.

Don't forget to use Effects > Sharpen > Adaptive unsharp on the Thumbnail to "fool the eye" with crispness.

Hal