I’m always trying to find more efficient ways to work as a web developer. And creating/editing screenshots are no exception.

If you’re a designer, developer or web enthusiast and want to take a screenshot and edit the file before sending it off or uploading it, there are easier methods than using Fn/Print Screen on a PC or Command-Control-Shift-3(or 4) for Mac, then open in Photoshop or worse yet, insert into MS Word to edit…

In short order:

My personal favorite add-on for Firefox: Fireshot
https://addons.mozilla.org/en-US/firefox/addon/5648/

Love the fact that I can quickly invoke the screenshot from a menu, select the area to grab then immediate go into edit mode. I add notes, arrows, then save it as a .png. (unbelieveably fast)

And my stand alone favorite for the Mac: Snagit
https://snagit.en.softonic.com/mac/download

Awesome tool in that it also has tons-o-editing available within, just like Fireshot. Although this has a $49.99 price tag (unfortunately it’s not free, like many things mac) =( it’s well worth the price in that it makes the job easier and a huge time saver.

Hope that these tools can help save you time during the coming work days.

Cheers!