- On February 25, 2021
Sign up for Behind the Browser®
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.
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.
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..
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
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
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.
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.
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.