Hi again this is Freddy with web-design-tips-and-tricks.com. And today I want to share quick tip with you about how you can create a professional looking portfolio on your website using screenshots of your designs using the simple plug in for the Firefox browser called screengrab.
Now you may have gone to other company’s websites and have seen their portfolio. You have seen how they have full screen images of their designs. And you might have actually saw it, “Wow, how do they that?” Well, it’s actually quite simple and I have to show you a quick method to do it and in fact if you have the Fixefox browser I highly recommend that you use a plug in for that browser and go to Mozilla.com. Even if you have Firefox if you don’t have it go ahead and download it. I highly recommend it, it’s open source so it’s free to use. That’s what I used myself personally.
Now on the top menu of Mozilla go ahead and click on Add-ons. This is going to be a plug in that you’re going to download for the browser. Now, you have this search bar tool that will come up just go ahead and type in screengrab. That’s the name of the plug in. They should be the first one that will pop up and there you go showing now the screengrab by Andy M and you’ll see it has about 14,600 weekly downloads. Just go ahead and click on add to Firefox you’ll get this little pop up that says you have ask to select the column item just click the Install Now. Once it installs Firefox will shut down and then restart. Once it restarts then you’ll get this little icon down to your screengrab icon in the bottom part of your browser, okay.
Now let me show you how this works. Let me go to one of my favorite websites calls
SmashingMagazine.com. Now if you’re into any type of graphics whether it’s Photoshop or Illustrator or if you like Icons and free word themes and things like that visit SmashingMagazine.com, subscribe to their RSSP I highly recommend it. I check this website almost everyday.
But now let’s say I want to get a full screen image of their whole website. I mean I know it’s super long but I want to see it while you go to screengrab you click on Save. Click on Complete Page Frame. And you should get a little save screen save as and I’ll see that SmashingMagazine.png I’ll save it on the desktop. And sure enough here we go. It’s saved I click on it. And there we go as an image as a PNG image and I can zoom in. I can view the whole thing because it gas saved everything. That should come in handy, when you want to save the full picture of your full website for your portfolio.
Now listen I just want to say just what I can see here on this window. Well, again I’ll go to screengrab save, no I want to save in Visible Portion, and I’ll save this as SmashingMagazine.2 there we go it’s save okay. Let me open it up this is the image right here at PNG file, but you see I can’t scroll up and down because this is all that is saved, that is the image I think and this can come in handy as well.
Another benefit or feature as you go to screengrab save selection. Under selection there whatever you highlight that’s what’s going to save. I highlight that let me save as SmashingMagazine.3 and save again on my desktop, open it and I can use this as an image such a fancy image.
So it has lots of features. It’s fun. It’s easy to use. And let say for example if I go to my website kangomedia.com. Let’s say I want to save the full page again screengrab save complete and save it as kangomedia.png on my desktop and there we go. There’s the image. I can resize it make it bigger make it smaller so that it fits right into my portfolio. This is a simple, simple plug in to use by the Firefox browser. It’s very valuable. I highly recommend it again just go to Mozilla.com, Firefox Add-ons, screengrab.
I hope you enjoy that. If you have any questions go ahead and email Fred@webdesigntipandtricks.com sign up for my RSS feed so you can know whatever I update, and if you want to share the tips go ahead and make a comment on my blog. We can share some tips with everyone. Again, this is Freddy where in web-design-tips-and-tricks.com. Have a good day.
Transcription by:
Scribe4you Transcription Services