September 21, 2021

Top 10 browser extensions for web developers

Having the right tools at your disposal can make your life much easier and more efficient as a developer. Keeping on top of the right tools to use is essential as our digital landscape constantly changes. Right now, these are the handiest of the handy browser extensions that we swear by in the web development team at Punch.

1. SEO META in 1 CLICK

This extension is a one stop shop for all meta data and main SEO information in a website. Rather than pouring through source code or signing up to a third-party website scanner this handy tool shows this information at the click of a button. Some of the information shown includes:

  • Meta titles & descriptions
  • Header tags and their content
  • Images missing alt tags
  • Open Graph & Twitter social data

2. Fonts Ninja

Need to know what that great looking font used on that website is? Well, you don’t need to spend time finding it via the browser inspector anymore. Once activated Fonts Ninja will display the font, size, letter pacing, line height, letter spacing and colour (in hex code format) of any text you hover over.

A popup window lists all the fonts used in the current page and allows you to type in bespoke text to test out the fonts.

3. Colorzilla

Colorzilla is a fantastic extension that allows you to use an ink dropper tool to select colours used on a website. Once selected you can conveniently copy the colour code into your clipboard in different formats including hex code, RGB and HSL.

Other useful features include a colour picker tool and the option to generate swatches of every colour used on the page.

4. Google Analytics Blocker

While working on our clients’ websites we tend to visit them regularly. Such traffic can have an effect on the analytics reports. This practical extension blocks Google Analytics from recording our visits to our client’s websites keeping the analytics clear of test hits. The extension can be toggled on or off at the click of a button.

5. Builtwith

When working with an existing website one of the first questions asked is what is the site built with? We work with a variety of different programs and frameworks including WordPress, Laravel, Magento 2, PHP, etc. This practical extension analyses a website and tells you what programming language or framework a website has been built with. It also detects other web technologies used such as Javascript and WordPress plugins.

6. Tag Assistant

When working with Google Tags it is imperative to know that your tracking scripts are installed correctly. Loading a page with this extension running lets you know if Google Analytics, Adwords Conversion Tracking and Google Tag Manager have been installed correctly. If there is an issue found the extension will give instructions on what can be done to resolve the installation issue.

7. IP Address and Domain Information

The name is a bit of a mouthful, but it perfectly describes the key features of this extension. The extension displays the IP address of the website you are currently on upon opening it. You can also use the extension to find your own IP address without having to resort to Google to find it. The extension also provides a wealth of domain/IP information listed below:

  • WHOIS information
  • Spam databases and blacklists
  • ISP information
  • Hosting server location
  • DNS information

8. Broken Link Checker

This extension will scan the page you are currently on and will list all broken links found on the page. This is a great extension in improving the user journey on a website and stopping visitors from being faced with a 404 page.

9. Page Load Time

Sometimes even the most basic extensions can be the most useful. When a page loads the extension icon shows the amount of time it took to load the page in seconds. Site loading speed is one of the signals used by Google’s algorithm to rank websites. Being able to see how quickly it takes for a site to load helps our developers to deliver fast efficient websites.

Clicking the extension icon also displays a more detailed breakdown of the loading time showing which events took the longest to load.

10. Grammarly

Spell checkers aren’t just for content authors. The Grammarly extension is an essential tool that provides real-time spell checking and grammar correction for all kinds of test editing in a browser. From content authoring a website to composing emails Grammarly assists our developers in providing correct, clear and concise spelling and grammar.

You can check out the latest web projects from our development team in our portfolio.