The best browser extensions for working with the site

3e4a518150841dacef892123d211d08f

Browser extensions are a time saver during development, as well as a benefit for those who want to explore a site that they liked. For example, you can pick up any color on the page with an eyedropper or quickly analyze SEO information.

In this article, we will look at popular extensions that will help developers, designers and SEO specialists when working with sites.

For developers and designers

Most of the extensions we’ll talk about in this article will fall into this category. These are tools that help you interact effectively with the code and design of the site.

Web Developer

An extension for working with the Web Developer site

The Web Developer extension allows you to equip the browser with a panel containing many different tools. With their help, you can disable JavaScript, manage page layout, and work with images.

Download link: Google Chrome, Firefox

Eye Dropper

Eyedropper in the browser extension Eye Dropper

Eye Dropper allows you to quickly find out the desired color on the site without going to the developer console. The feature of the plugin is that the color can be determined not only in specific elements, but also in photos. For example, if the site has a photo with a picturesque landscape, then you can take the color of the sky, sea, etc. from there.

The extension is great for designers who want to grab a palette they like. For developers, the Eye Dropper will work to a lesser extent, but will also be useful for quick color determination.

Link on downloading: Google Chrome, Opera, Firefox

Site Palette

How to find out the site palette using the Site Palette extension

Another extension for working with color. It can be called an analogue of Eye Dropper, but Site Palette works somewhat differently. It allows you to extract the colors used from the site and arrange them in the form of a color palette. In addition to everything, the plugin supports several ways of generating palettes, allows you to share them, supports the ability to print palettes and can convert them to PDF.

Link on downloading: Google Chrome

Google Font Previewer for Chrome

How to find out the font on the site using the Google Font Previewer for Chrome extension

An extension for those who like to “play with fonts” – allows you to experiment with the entire range of fonts from the Google Fonts library without changing the page code. You can change not only the font itself, but also its size, writing style, etc. You need to check how the font looks before making changes to the page code.

Link on downloading: Google Chrome

Project Naptha

An extension for working with the Project Naptha site

An extension for Google Chrome that allows you to select and copy text even from pictures will be useful to anyone who at least once in their work had to deal with embedded text.

Link on downloading: Google Chrome

Library Sniffer

How to find out what a site is built on with the Library Sniffer extension

Library Sniffer is a great tool for those who want to quickly find out what tools, libraries or frameworks are used to create the pages they are viewing. You can see what the site is built on – WordPress, Drupal, React, Vue.js, AngularJS or something else.

Download link: Google Chrome

What Font

    How to quickly find out the font on the site using the What Font extension

This is the extension every designer needs. It is enough to run it and move the mouse cursor over any word – the font will be shown as a result. And if you click on any word on the page, additional information will be displayed: font size, its color, height, and more.

Download link: Google Chrome, Firefox

SVG Grabber

How to download all SVGs from a website page using the SVG Grabber extension

This tool is suitable for those who need to quickly download all SVG elements from a site page. Just run the plugin and it will generate a page with all vector images that can be downloaded in a few clicks.

Download link: Google Chrome, Firefox

Lighthouse

Alt - Browser extension for working with the Lighthouse site

Lighthouse is a tool for improving the productivity, quality and correctness of website pages. Lighthouse runs a bunch of tests on a page and then generates a report on how well it’s performing. Thanks to this, you can detect serious errors, determine the speed of page loading and understand how to improve it.

Download link: Google Chrome, Firefox

Page Ruler

Browser extension for working with the Page Ruler website

A simple tool that helps you determine the height, width and position of any element on a page.

Download link: Google Chrome, Firefox

CSS Scan 2.0

How to quickly copy CSS on a site using the CSS Scan 2.0 extension

CSS Scan 2.0 is a useful extension that allows a developer to explore and copy CSS by simply hovering over page elements. However, there is one significant drawback – the cost. Unfortunately, it will not be possible to use it for free – you need to pay a subscription.

Link on downloading: Google Chrome

React Developer Tools

A browser extension for working with the React Developer Tools site

The React Developer Tools extension extends the capabilities of the developer tools. With it, you can explore React components, the properties passed to components, and the state of components.

Download link: Google Chrome

JSONVue

    A browser extension for working with the JSONVue site

A simple JSONVue extension that quickly and neatly formats JSON data.

Download link: JSONVue

Talend API Tester

A browser extension for working with the Talend API Tester website

Talend API Tester is an extension that allows you to work from a browser with various APIs. For example, it can be APIs based on REST, SOAP and HTTP technologies. The free version of the extension supports the execution of all types of HTTP requests, secure data exchange and authentication.

Link on downloading: Google Chrome

Window Resizer

Browser extension for working with the Window Resizer website

Window Resizer is an extension designed specifically for developers and designers. Its main purpose is to show how the site looks on different screens. Unlike the built-in emulator, this extension narrows the boundaries of the browser to the required dimensions. For example, if you choose the mobile version, your browser will shrink to the required size, thus showing how the site will be displayed in this version.

Download link: Window Resizer

Daltonize

A browser extension for working with the Daltonize site

An extension that helps adapt web services for those users who suffer from color blindness.

Download link: Daltonize

The community is now in Telegram

Subscribe and stay up to date with the latest IT news

Sign up

SEO plugins

In this section, we will talk about the best permissions for an SEO audit. They will help you quickly analyze site statistics, find errors and understand what to emphasize.

Seo Meta in 1 Click

Browser extension for SEO analysis Seo Meta in 1 Click

Analyzes SEO information:

  • meta tags: Title, Description, Canonical, Robots Tag and others;
  • h1-h6 headings, images, their alt and title values, links;
  • Open Graph markup;
  • has hot links to sitemap.xml and robots.txt;
  • checks installed analytics counters.

An interface with a convenient tab structure, one of which contains links to quickly check the page in other Google tools. These include: Mobile Friendly, Google PageSpeed, micro markup checking and others. With this plugin, you can quickly view important SEO parameters.

Download link: Google Chrome, Firefox

RDS bar

RDS bar SEO browser extension

RDS bar extension analyzes incoming links, number of links to the site, presence and position in search engines.

features:

  • user-friendly interface, visibility – display of Title, Description and page title in the background block;
  • a large amount of statistical data: indexing of the page in major search engines – Yandex, Google, Yahoo, Bing, as well as in Twitter, the number of mentions of the domain by search engines, the name of the host, provider and much more.

Download link: Google Chrome, Firefox

MozBar

MozBar SEO Analysis Browser Extension

MozBar is another extension from the SEO category. It displays the keywords for which the page appears in Google results, tracks Page Authority, Domain Authority, Link Profile. It also conducts a detailed analysis of search engine results.

Among the features, it is worth noting a wide range of additional chips in the form of site speed analysis, headings of any sites and alt-texts. Any keyword you are looking for on the page can be highlighted by the plugin – this will help in analyzing the spam of the page.

Link on downloading: Google Chrome

Google Analytics Debugger

Google Analytics Debugger browser extension for SEO analysis

The extension from Google receives data from the code transmitted to the Google Analytics counter. It will help to get information about successfully executed commands. With its help, you can also get detailed information about each call sent to Google Analytics. This will allow you to check exactly what data is being tracked and whether the Google Analytics tool is configured correctly.

Download link: Google Chrome, Firefox

Yandex.Metrik

Browser extension for Yandex.Metrik SEO analysis

The extension allows you to quickly go to Yandex.Metrics of the current site, download the traffic of the Internet resource, a map of links or clicks, as well as get form analytics.

This extension is perfect for those who have many sites – access to metrics can be obtained in just a few clicks.

Download link: Google Chrome, Firefox

Check My Links

Browser extension for SEO analysis Check My Links

The extension checks for 200 and 404 links. It scans the page and tracks broken links. At the end of the scan, the utility presents a detailed report of the URLs of such links and error codes. Among the advantages, it is worth noting the ease of use – there are only two settings: the option to exclude from checking links that belong to specific domains, the type of request.

Link on downloading: Google Chrome

Web Developer checklist

Browser extension for analyzing SEO Web Developer checklist

An extension for automatically checking whether a site meets the basic principles of SEO, whether it is sufficiently productive and user-friendly. The results of the check are presented in the form of a kind of checklist – you can view more detailed information and recommendations for each of the unfulfilled items, as well as instantly correct errors.

Download link: Google Chrome, Firefox, Opera

General purpose extension

Editor in Chief

Browser extension for working with the Glavred website

The online service analyzes the text and identifies its weak points: stop words, advertising clichés, inappropriate use of words, clericalisms, and more. Also examines the stylistics of the text, helps to make it informative, easy to read and convincing for the reader.

Of the features, it is worth noting that Glavred not only highlights verbal garbage, but also gives advice on how to correct the situation with clear examples.

Download link: Google Chrome

Loom

A browser extension for working with the Loom site

The extension is a great fit for any development team. With Loom, you can record your screen and instantly get a link to share with colleagues. This is the fastest and easiest way to make a screen recording to show how the site works or its individual elements.

Link on downloading: Google Chrome

Instead of imprisonment

We have considered the most successful extensions for working with sites that can be found in the stores of popular browsers. Each of them will be able to simplify your work in different directions.

If you have a number of interesting extensions in your collection, it would be interesting to learn about them in the comments. And that’s all I have to see you!

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *

© 2022 ZoNa365.ru - Theme by WPEnjoy · Powered by WordPress