8 of our Favorite Browser Extensions for Website Management

WAVE

Available for Chrome, Firefox and Opera

WAVE, from webaim.org, is hands down the browser extension we use the most. WAVE is an acronym for Web Accessibility Evaluation Tool and the name says it all. With this extension you can instantly review any web page to see how it stacks up against WCAG, the Web Content Accessibility Guidelines put out by the World Wide Web Consortium or W3C. This tool is a must for anyone managing a website and especially those charged with website compliance.

Awesome Screenshot

Available for Chrome and Firefox

An example of a long page screenshot taken at latimes.com

Taking screenshots is an all too frequent practice when working on websites. But, as you know, most web pages are taller than the height of your screen or viewport. Trying to get a single image of these long scrolling pages can mean taking multiple screenshots and ‘sewing’ them together with image editing software.

The Awesome Screenshot extension will allow you to create an image from a full, scrolling webpage in just one click. You can also create basic screen recordings with the tool. And, if you upgrade to a paid account for $5 per month, you’ll be able to create 4K resolution video screen captures and to connect your images and recordings to services like Jira, Slack and Asana.

VisBug

Available for Chrome and Firefox

An edited version of the nytimes.com front page

The VisBug extension allows you to inspect and make edits to the elements of any webpage. The edits you make will only show on your screen (i.e. they don’t affect the live webpage) and can’t be saved. But the tool provides you with a great way to quickly test different changes you’re considering making, without enlisting the help of a designer or developer..

PixelZoomer

Available for Chrome and Firefox

PixelZoomer at work, getting up close to an iPhone on apple.com

For those times when you need to find a precise color or measure a specific area, even down to a tiny cluster of pixels on your high resolution screen, PixelZoomer is the tool for the job. This extension will blow up the active webpage (in a new tab) up to 32x its native size. With the extension’s selector tool you can measure the width and height of any page part. With the eyedropper tool you can copy the color value of any pixel, which is essential when you need to match web colors and don’t have a web style guide to reference.

Save Page WE

Available for Chrome and Firefox

The Save Page WE tool creates and quickly downloads an HTML version of whatever page you’re viewing in the browser. For developers or website managers who are tasked with building or modifying pages in HTML/CSS, this tool gives you an easy way to create a file to work on from an existing webpage. Have you ever wanted to copy the layout of a page you’ve seen on the Web? Use Save Page WE and, in an instant, you have a copy to start working from.

It’s also a great tool for saving an article (and its images) to read later.

Search by Image

Available for Chrome, Firefox and Opera

Image searching for the Perseverance rover on bing.com

If you ever find yourself looking at an image on the Web and thinking, “This looks good. We could use something like this on our website.” then this extension is for you. Search by Image lets you find images similar to the one you’re viewing with a simple click.

Search by Image also allows you to select which search engine(s) you’d like to use for the search.  The extension opens a new tab for the results from each search engine selected.

SVG Grabber

Available for Chrome

SVG images such as logos and icons can’t be downloaded like JPGs or other typical web images. This is because SVG’s are vector-based images (not raster or bitmap images) and are actually blocks of code that tell the browser how to render an image with a set of mathematical instructions.  This allows SVG images to scale smoothly and look sharp at any size in your browser.

So how can you grab an SVG from a webpage? The easy way is to install the SVG Grabber browser extension. This tool grabs all the SVG files on a given page and drops them into a new tab for copying or downloading. We launch the extension on the Wall Street Journal Site for this example.

NetCraft

Available for Chrome, Firefox and Opera

Checking the risk profile of bostonglobe.com with Netcraft

The NetCraft extension is primarily a security tool to help you stay safe from phishing sites, sites that host malicious javascript and sites that are compromised by other exploits like the heartbleed bug.  But NetCraft also exposes other key information about the sites you’re visiting, such as a site’s country of origin, the year it was first published, the status of its SSL connection and its overall risk rating.

And if you come across a site that appears to be a phishing site or otherwise malicious, with Netcraft you can report that site to the extension’s community of users with a simple click.