Here we have a list of the 30 best Google Chrome web extensions that will help web developers and designers. These extensions are used by a reputed web development company in India.
1. Yslow
As a web developer, you may have come across Yslow. Yslow developed by Yahoo was previously a website that allowed you to check your website’s speed score. But now Yslow is only available as a browser extension. The browser extension is really easy to use. And helps you fix issues regarding your website’s speed.
2. Web Developer
Web Developer is a really useful tool for web developers. It is an all-in-one tool for web developers. It can edit, delete or add new cookies, Disable images, Disable all styles, Edit CSS, Hide Images, Make Images Full Size, and a lot more. Web Developer is a tool that needs another article for its features. As a web developer, you must give it a try.
3. What Font
What font is an easy-to-use Chrome extension that helps you easily detect the font used on an element with just a click? It can be used on any website. It detects the font family, Font Weight, Font Size, Line Height, Color, and the Font Provider.
4. Web Developer Checklist
Web Developer Checklist is another great tool that allows you to check your website for the completion of different things. It allows you to check if the website you are working on has Twitter Cards, Open Graph Meta Tags, Robot.txt files, and other important things. You can visit the web dev checklist(dot)com for a complete list of important tasks for web developers.
5. Google Font Previewer
Google Font Previewer is one of my favorites. It allows you to preview google fonts on your web page with just a click. You just need to select a google font and it will change the font of your website. It really helps in deciding on a font for your web pages.
6. User-Agent Switcher
User-Agent Switcher is a great tool to check your website for different user agents. This tool comes in handy when you are working on a website that tailors different content for different devices(especially mobile devices). It allows you to change the User-agent string of your browser with iPhone, iPad, iPod, Android, and other User-agent strings. It is not limited to the predefined user agent strings, You can also use your own custom user agent strings or customize the predefined ones. One of my previous articles will help you learn more about how you can detect mobile device users with PHP.
7. FB-flo
Fb-Flo is an extension created by Facebook that allows you to edit your applications without reloading your web browsers. All resources that are changed will be reloaded automatically without refreshing the browser window.
8. Corporate Ipsum
Corporate Ipsum is a handy extension that generates lorem ipsum dummy text. It allows you to choose the number of paragraphs or words to generate. No more visiting websites to generate Lorem Ipsum text.
9. MozBar
Created by Moz, Mozbar is a useful extension that allows you to check MozRank, Pagerank, and other SEO-related stuff.
10. Built With
Built With allows you to check what technologies a website is using. It is not completely accurate. But still able to tell a lot about the website. When I tried using it on my blog, It displayed that it is using WordPress, Apache, jQuery, Open Graph Protocol, etc. And is hosted on Logic Boxes. My Blog isn’t hosted on Logic Boxes’ server but on HostGator. It was wrong about the hosting provider. Still a good tool.
11. Rescue Time
It helps you to be productive. And reports you websites that you visited. It also displays the category of each website and indicates the percent of productive time spent on the internet.
12. Page Ruler
Page ruler is an awesome tool that allows you to check the size and position of an element easily. It works like a ruler.
13. Stylebot
Style bot allows you to edit CSS properties of elements on the page. It not only allows you to make basic changes like font size, color, and background but also allows you to add custom CSS properties for an element. It is not limited to just editing. You can even share the style you create with friends.
14. JunkFill
A great tool that comes in handy when you are working on a website that needs a lot of form filling. This extension fills form fields with Junk names, emails, and websites. Just one click and this plugin will fill all the forms available on the web page with Junk information.
15. Appspector
Appspector is an extension built with. But Appspector is much more straightforward and displays the logos of the technologies used. And when you click on those logos, it takes you to the website for the technology.
16. Full Page Screen Capture
As the name implies, the chrome extension captures a screenshot of the complete webpage and opens the screenshot in a new tab. You can then save the screenshot as a PNG file. I like it and I have used it many times.
17. StayFocusd
Stay Focused is a really great tool for people who get diverted while working. It allows you to block websites for a certain period of time specified by you. Once you block the website, you will not be able to unblock it until the time specified passes. It blocks websites you specify after 10 minutes. It also has a nuclear option which when used blocks all the websites. I use it to block Facebook while writing articles and working on websites. Give it a try, I am sure it will help you increase your productivity.
18. Color Zilla
Color Zilla allows you to pick colors from a web page. Its color picker works much like Photoshop’s Color picker. It also includes a Web Page color Analyzer, Which Analyzes the Colors used on a web page.
19. Clear Cache
Clear Cache is a great tool that clears cache with just a click. It not only clears the browser cache but allows you to choose more things that it can clear like Passwords, Form Data, Plugin Data, History, Download, and WebSQL. When working on websites, many times cache starts creating problems and this plugin will help you fight that problem.
20. Resolution Test
Resolution Test is a basic extension that re-sizes your browser window to different sizes to help you check the responsiveness of your website. It not only has a lot of predefined resolutions to check your website but also allows you to add different custom resolutions to test your website.
21. ModHeader
Mod Header allows you to modify response and request headers sent to the server. I have never used this plugin before but I am including it because a friend suggested it.
22. Snappy Snippets
Snappy Snippets allows you to store HTML and CSS Snippets of inspected elements easily.
23. PerfectPixel
Pixel Perfect comes in handy when you are converting PSD files to HTML. It allows you to test your PSD layers with the elements on your website. It helps you make the conversion Pixel Perfect.
24. Image Downloader
As the name implies, this chrome extension allows you to download all the images on a web page. It also includes filters for image size. It helps you easily find and download images on a web page.
25. Mobile/Responsive Web Design Tester
Responsive Web Design Tester is a chrome extension like Resolution Tester. But has a big set of predefined mobile devices. And opens all the device tests in a popup window.
26. Check My Links
Check My Links is a great tool that detects broken links in web pages. And it does it really fast. It highlights all the broken links in Red and Working links in Green.
27. PHP Ninja Manual
PHP Ninja Manual allows you to search the PHP documentation even when offline. It also displays example code for functions along with documentation.
28. Image Properties Context Menu
The easy-to-use Chrome Extension opens up a pop-up with image properties. After installing this extension if you right-click on an image then you will see a context menu option for Image Properties. Can be helpful sometimes.
29. Alexa Traffic Rank
Alexa Traffic Rank is a simple chrome extension that displays Alexa rank information for websites. It displays a number of sites linking, Alexa rank, and Alexa rank in the website’s country.
30. Website Destroyer
A really cool chrome extension. It helps you release stress. And I really love it. I use it on all the websites that use tabular layouts and the websites that I don’t like. It allows you to use shotguns, Knifes, and many more different types of tools to destroy websites. I don’t hate or dislike google, I was just trying to create a screenshot and Google was the first website to open when I opened up a new tab.
Conclusion
Web Browser extensions can help you increase productivity but too many of them may distract you from work. I use almost all of these extensions. I have all of them installed in my Chrome. But I hide them whenever they are not in use. Rescue Time, What Font, And Web Developer are my favorite tools that I use almost every day.
Use comments to share your experience with these extensions. You can also recommend more extensions, suggest or advise something and correct me if I am wrong anywhere through the comments.
