15 chrome plug-ins for web designers and developers

Because I am dependent on the firebug plug-in, there is not a completely corresponding plug-in the Chrome browser, so I still use the Firefox browser from time to time, however, I am very satisfied with Google's browser speed, screen space utilization, and many other aspects. In this article Article I will share with you some of the best Google browser plug-ins I found during website design and development, listed in alphabetical order as follows.

1. Aviary screen captureScreen

Aviary screen capture allows you to take screenshots of web pages. After obtaining the screen snapshot, use the aviary.com ApplicationProgramEdit the snapshot in the browser. The basic image editing device allows you to tag (by drawing arrows and rectangles), edit (crop, rotate, and resize), and get precise pixel colors.

Its features include:

• Save to desktop, online host, or edit on other aviary applications
• Instant
• Captures any part of all webpages and images.
• Able to intercept the entire webpage
• You can add visible remarks, such as arrows, text, and conspicuous symbols on your captured images.
• Crop the captured image
• Resize, rotate, and flip
• Intelligently select and remove elements
• Obtain color information from the page
• Quick Start of 6 aviary design tools including image, Tag, vector, palette, effect and Audio Editor.

2. Chrome SeoSearch Engine Optimization

Chrome Seo provides a convenient path for search engine optimization tools. These tools help you perform daily search engine optimization, such as competition analysis, keyword analysis, reverse link check, and Web page ranking check.

3. Chrome sniffer

Chrome sniffer enables Web developers to check web frameworks/CMS and JavaScript libraries running on their websites. This plug-in uses an icon to display the detected framework. Currently, this plugin can detect up to 70 popular CMS and JavaScript libraries.

4. eye dropper droppers

Eye dropper allows you to select a color from a webpage or an advanced color selector.

5. firebug Lite for Google Chrome

Firebug Lite for Google Chrome is not a substitute for firebug (unfortunately) or a tool for browser developers. Idea. You should use it with other tools. Firebug lite provides a large number of visual effects, similar to firebug's HTML elements, DOM elements, and box-mode shadows. Firebug lite also provides other cool functions, such as detecting HTML elements with a mouse and editing CSS in real time.

6. ie Tab

With IE tab, you can switch to the chrome tab to display webpages. This plug-in is very helpful for developers who want to use the IE rendering engine for cross-browser testing. (This is a unique plug-in windows .)

7. Instant image editor instant image editor

When you press and hold the Alt key (the ctrl key on Linux), the instant image editor allows you to right-click any image or element on a webpage with a background image. You can use pixlr to instantly edit images on the new tab. pixlr is a fast and easy-to-use program running on a browser. When the element you right-click is not an image, the instant image editor determines whether the element has a background image for editing.

8. lorem ipsum Generator

The lorem ipsum generator randomly generates the "lorem ipsum" text with a simple and attractive design.

9. measureit!

Measureit! Used to measure the width and height of any element on a webpage.

10. pendule

Pendule is a development tool provided by chrome for Web developers. The built-in development tool plug-ins include: viewing, reinstalling, and disabling CSS, viewing JavaScript, table editing, viewing, hiding, and obtaining image information, color selector, gauge, topographic map, tag validators, etc!

11. php console PHP Console

The PHP console is a plug-in of lagger (lagger: a lightweight and flexible open-source PHP library for PHP to handle errors, exceptions, and debugging ), it displays PHP errors/debugging information in the Google Chrome console and the pop-up window.

12. Speed tracer speed Tracker

The speed tracer speed tracker helps you identify and fix performance problems in your website applications. When the application is running, the plug-in visualizes and analyzes low-level detection points in the browser.

This application helps you understand where time is spent in your application. This includes problems caused by the following reasons:

• Javascript parsing and execution
• Layout
• CSS style recalculation and Selector matching
• DOM Event Processing
• Network Resource Loading
• Timer
• XMLHttpRequest callback
• Plotting
• Others

13. Web Developer

Web Developer adds a toolbar in the browser with buttons for web development tools.

14. webpage screenshot web page Snapshot

Webpage screenshot is a fast and simple plug-in that captures the entire webpage. Even if the webpage is long, it can be stored in an image file. This plug-in allows you to store images of any web page in PNG/jpg format with just one click.

• Drawing tools: lines, ovans, rectangles, arrows, etc.
• Add text to the screen snapshot
• Quickly crop images by size
• You can edit the image before preparing it.
• It can be uploaded to Facebook, Twitter, Gmail, and MySpace for sharing.
• Print: Send the image directly to the printer
• Stored in the hard disk: this unique plug-in allows you to store large images in the hard disk.
• Can intercept local files: can intercept "file ://"
• Color selector: Remember the last color you use
• It can also intercept webpages of a horizontal website.

15. Window resizer

Window resizer can resize the browser window to suit various resolutions. This plug-in is especially useful for website design and developers to help them Test layout design on browsers with different resolutions. The resolution list can be customized (Add/delete/re-sort ).

Three screen types are available:

• Desktop Computer (standard; adjust the size of the entire window according to the specific resolution)
• Laptop (same as a desktop computer, but different icons; easy to scan resolution list)
• Mobile phone (different from the first two screens; suitable for the specific view size, does not fill the entire window, because the browser of the mobile phone usually has no border)