Skip to content
Tpg strategic digital partner since 2002
Contact
  • Home
  • Website Services
  • About TPG
  • Blog
  • Contact Me
  • Home
  • Website Services
  • About TPG
  • Blog
  • Contact Me

Top tips – Annotated Screenshots

Tom garrigan - founder tpg

So, you’ve finished a project and you’re handing it over to the client. You don’t want to just dump it on them, but want to leave them with some clear and helpful notes that they can refer back to for quick and easy answers when you’re not around.

A visual document of annotated screenshots is so useful, but what is the best way to do this without spending far too much time creating some kind of mish-mash of a document using a variety of tools?

Moving on From Print Screen

I previously used ‘Print Screen’, paste into Photoshop, crop out browser bars and toolbars… maybe stitch some images together if I wanted an image of a whole webpage…..save and insert into a word/indesign document where I could write some text and draw some wobbly (even if they were straight it looked so hashed together) lines and circles to highlight areas.

Screengrab

I’ve since moved on to browser add-ons such as Firefox’s Screengrab that will capture any part of the website you want, even all of it and without including browser and unnecessary  and sometimes confidential bits and pieces.

But how about a tool that will take a screenshot of the desired area AND let you scribble over it, how much time would that save…?

Awesome Screenshot

I looked at Awesome Screenshot for Google Chrome, Firefox and Safari.  This is a great tool for annotating sections of a webpage to share with anyone; using boxes, circles, free-hand, lines, arrows, blurring out sensitive bits and adding in text.

However, it is not so good if you are making a few notes and want to go back to change a note you have made, without deleting everything you have done since that point.

Pixlr Grabber (NOW RETIRED – 2014)

Another Google Chrome and Firefox extension is Pixlr Grabber. This allows you to take a screenshot of the desired area of the webpage and then loads it into Pixlr for editing. With so many features similar to Photoshop it’s quick and easy to get your head around. You can then save these images to send to colleagues or to combine in a document for more extensive notes to go with the annotated images.

Page Serif

For this I experimented with a free version of Page Serif, (looking for a free alternative to InDesign), which is quite handy for very small layouts – up to five pages.  The features are limited, but I find it useful for small documents. For larger ones, I created new documents for every five pages and printed to pdf, then joined them together. Not time efficient if you need to make changes! I’ll stick to word for compiling my document for now and use the free Page Serif for birthday cards.

 And the Winner is…..

All in all, these tools are useful depending on the type of work you want to do. For any future client ‘how-to’ documents, I’ll be using the feature-rich Pixlr Grabber.

UPDATE

Sadly, our favourite tool has now been retired, to allocate more time and resources on other products. The good folks over at Pixlr recommend using Jing as an alternative. We’ll be trying this one out and are sure there will be more to review in the near future…

Table of Contents

Picture of Tom Garrigan

Tom Garrigan

All Posts
  • TAGS: Top Tips, TPG Design News
  • DATE PUBLISHED: November 11, 2013
PrevPreviousTelling Tales
NextOur New Team PictureNext

Claim your FREE Consultation

  • London Based Website & Digital Partner
  • 30+ Years Experience
  • Free Quote and No Commiment

Get a FREE QUOTE

Stephanie
StephanieRichmond, Surrey
I recently had the pleasure of working with Tom at TPG, and I couldn’t be more impressed with his exceptional service and innovative approach. From start to finish, Tom demonstrated a remarkable blend of creativity, professionalism, and dedication.
John B
John BTwickenham
One of the standout features of Tom Garrigan is his ability to listen and understand the clients’ needs. He took the time to thoroughly grasp our vision and provided thoughtful recommendations that truly enhanced the final product. The design solutions were not only aesthetically pleasing but also highly functional, which speaks volumes about Tom's expertise in balancing form and function.
Tracy L
Tracy LPutney, London
The project management aspect was top-notch. Communication was clear and timely, and Tom was always available to address any questions or concerns we had. Deadlines were met with impressive efficiency, and the final deliverables exceeded our expectations.
Josh
JoshKew, Richmond
What really sets TPG apart is the commitment to quality and client satisfaction. The passion for design is evident in every detail, and the ability to bring fresh, innovative ideas to the table is truly commendable. If you’re looking for a design partner who combines creativity with reliability, contacting Tom at TPG is the way to go. I wholeheartedly recommend him to anyone seeking outstanding digital solutions.
Orchards
OrchardsLiverpool
Tom was really easy to work with. He explained all aspects of the planned process, keeping us informed as the site developed. Would happily work with TPG again.
JF
JFKingston, Surrey
TPG came to the rescue and quickly resolved some issues then set about making changes and improvements. Brilliant service and kept me informed the whole time.
Francesca
FrancescaLondon
Working with the guys at TPG has been a total pleasure from the start. Tom is so helpful, and fast! I couldn't recommend him highly enough. It really has been a pleasure. Thank you I love my new site!

About TPG - Tom Garrigan

I help service-based businesses build a stronger digital presence through thoughtful web design, SEO, content, and ongoing digital support.

I design clear, strategically built websites that improve visibility, connect with the right audience, and help businesses grow with confidence in an AI-driven world.

Insights, Blog, Thoughts

Read all ->
Platforms are borrowed space

Is Your Website Really Delivering? Essential Checks to Run

Read More »
Sturgeon renovations website

Visit the Sturgeon Renovations Limited new website

Read More »
Social media text with lady on mobile phone screen

How to successfully promote your business without losing your mind

Read More »
Build a constellation, not just a website

Build a constellation, not just a website

Read More »
Your website matters more than ever

AEO, GEO and SEO: why search visibility is changing faster than most businesses realise

Read More »
Most businesses don't need louder marketing

What digital strategies actually drive consistent SME growth?

Read More »
Tom-holding a pink selfie-stick

The return of the pink selfie stick

Read More »
Richmond park beagle

The importance of stakes in the ground

Read More »
Your website matters more than ever

Should I stop using my website, and just use Social Media?

Read More »
Using reddit for business

How to use Reddit for business without sounding business-like

Read More »
Momentum matters more than perfection

Why your personal LinkedIn profile matters more than your company page

Read More »
Tom and a few screens

What is Chunking? And will it really increase your SEO and AI results?

Read More »
Wordpress logo
Squarespace logo
Elementor logo
Unsplash logo
Adobe logo
Logo-meta
Ahrefs-logo
Logo-mailchimp
Semrush-logo
Logo-bing
Rank-math-logo
Screaming-frog-logo
Google-tag-manager
Se-ranking-logo
Google-analytics-logo

Legals & Info

  • Terms & Conditions of Use
  • Cookie policy
  • Privacy notice
  • TPG Design Limited – Terms of Engagement
  • Contact Me
  • Terms & Conditions of Use
  • Cookie policy
  • Privacy notice
  • TPG Design Limited – Terms of Engagement
  • Contact Me

Contact

hello@tpg-design.com

+44 (0)7734 108729

Registered Office

TPG Design Limited
Richmond
Surrey
TW10 5AB

Registered in England & Wales 
Company Number 04403861

Tpg: strategic digital partner - since-2002 logo

© 2002 – 2026.  All rights reserved