25 полезных Chrome-расширений для веб-разработчиков
vc.ru![](/file/76a8199c9fb31263a0c7c.jpg)
1. iMacros for Chrome
![](https://static48.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/e5559d77b0f1c0c2f31e.png)
iMacros — расширение, которое помогает в тестировании веб-страниц. Вместо того, чтобы самостоятельно проделывать одни и те же действия на странице, разработчику нужно лишь записать требуемую последовательность действий в iMacros и запускать расширение тогда, когда это необходимо.
Расширение способно работать с сайтами, реализованными при помощи технологий Java, Flash, Flex, Ajax и Silverlight.
2. Font Playground
![](https://static42.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/fc78b4817a3341bf4df6.png)
Расширение для тех, кто любит «поиграть со шрифтами» — позволяет экспериментировать со всем спектром шрифтов из библиотеки Google Fonts, не внося изменений в код страницы. Можно менять не только сам шрифт, но и его размер, стиль написания и так далее.
Пригодится, по словам автора материала, для того, чтобы проверить, как выглядит шрифт, перед тем, как вносить фактические изменения в код страницы.
3. Project Naptha
![](https://static49.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/50e7afc42160c0b621d4.png)
Расширение для Google Chrome, которое позволяет выделять и копировать текст даже с картинок — будет полезным, по мнению Cretive Bloq, всем, кому хоть раз в своей работе приходилось иметь дело со встроенным текстом.
4. What Font
![](https://static41.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/7552af06164d555959a7.png)
Расширение, которое позволяет мгновенно определить, какой шрифт использован на той или иной странице, не производя почти никаких дополнительных действий — наведя курсор мыши на надпись.
5. YSlow
![](https://static49.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/72e983dfe67b9ed200ac.png)
YSlow — инструмент, который не только проверяет скорость загрузки той или иной веб-страницы, но и подсказывает разработчику, что её тормозит. Для этого расширение проверяет сайт на соответствие 23 из 34 правил производительности, сформулированных командой компании Yahoo.
6. Web Developer
![](https://static44.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/a04b958fa8aab5b33616.jpg)
Целый набор полезных инструментов для управления элементами сайта — например, для анализа веб-ресурсов и макетов, тестирования кода и мгновенного изменения параметров и внешнего вида страницы.
7. Web Developer checklist
![](https://static40.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/3d4189f91776149306c6.png)
Расширение для автоматической проверки, удовлетворяет ли сайт основным принципам SEO, достаточно ли он производителен и удобен для пользователя. Результаты проверки представляются в виде своеобразного чек-листа — можно посмотреть более подробную информацию и рекомендации по каждому из невыполненных пунктов, а также моментально исправить ошибки.
8. DevTools Autosave
![](https://static41.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/7f2f4ae630dc3038dae4.png)
Позволяет в автоматическом режиме сохранять любые изменения, внесённые в код страницы при помощи инструментов Chrome DevTools. Как отмечает автор материала, инструмент помогает разработчикам сэкономить большое количество времени.
9. Instant Wireframe
![](https://static47.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/a6fa44535bed057459ba.png)
Расширение, при помощи которого можно «превратить» любую страницу в структурную схему компоновки материала — wireframe. Позволяет разработчикам и веб-дизайнерам не выходя из браузера ознакомиться с компоновкой любой страницы в сети.
10. Ripple Emulator
![](https://static44.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/d5eb68019b2a0faa1676.png)
Ripple Emulator — расширение-эмулятор для Google Chrome, которое позволяет тестировать веб-сайты на различных мобильных платформах с различными разрешениями экрана. Может быть использовано в сочетании с другими расширениями для тестирования и отладки ресурсов.
11. Streak
![](https://static41.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/7711c96eebd076781071.png)
Streak — расширение, которое позволяет превратить почтовый ящик на Gmail в CRM-систему. Можно отслеживать статус сделок и переговоров, которые ведутся в электронной почте с контрагентами, использовать Streak для обработки запросов пользователей продукта и отслеживания исправлений присланных ошибок и так далее.
12. Search Stackoverflow
![](https://static45.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/e42860b3f0c4cf95ad2d.png)
Расширение для быстрого поиска по популярному ресурсу для разработчиков Stack Overflow.
13. PHP Ninja Manual
![](https://static40.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/41107f1215fe140f873b.png)
Позволяет получить мгновенный доступ к документации по PHP 5.5 из браузера.
14. PerfectPixel
![](https://static49.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/1a0f5f95b69e7a493018.png)
PerfectPixel — расширение для Google Chrome. Оно позволяет «наложить» на веб-страницу полупрозрачную сетку и сверять по ней заданные расстояния. Можно накладывать и другие изображения — например, первоначальный макет — чтобы убедиться, что получившаяся страница в точности ему соответствует:
![](https://static48.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/9f7710c90374ebb1fae2.png)
15. Code Cola
![](https://static46.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/9f54ff8f9651a219e555.jpg)
Инструмент для просмотра исходного кода страниц и редактирования CSS-кода.
Можно менять тени, окружности бокса и так далее с помощью перетаскивания ползунка. После внесения изменений можно скопировать получившийся код и заменить его в коде сайта.
16. Chrome Sniffer
![](https://static40.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/73031dfa724797ad8e1f.png)
Расширение для браузера, которое определяет, какие JavaScript-библиотеки, фреймворк или CMS используются на ресурсе.
17. User-Agent Switcher
![](https://static48.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/8ba5acd75608faad1d4e.jpg)
User-Agent Switcher — это расширение, которое позволяет «маскировать» браузер Google Chrome под Internet Explorer, Opera или любой другой браузер.
18. IE Tab
![](https://static43.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/f149be05f6a25356768a.png)
Встроенный эмулятор Internet Explorer для Chrome.
19. PicMonkey
![](https://static47.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/7a424919c42aba305664.png)
Простой и бесплатный онлайн-редактор изображений. Позволяет «захватывать» изображения или делать скриншоты браузера — и сразу же редактировать их при помощи расширения для Chrome.
20. Chrome Daltonize
![](https://static41.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/41bc38e33dc8b4f83c51.png)
Расширение, которое помогает адаптировать веб-сервисы для тех пользователей, которые страдают дальтонизмом — демонстрируя разработчику, как сайт видят те, кто страдает этим заболеванием. Позволяет веб-дизайнерам и разработчикам создавать более доступные сервисы.
21. Page Ruler
![](https://static49.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/a37b44862e968eaeaebd.png)
Простой инструмент, который помогает определить высоту, ширину и положение любого элемента на странице.
22. Check My Links
![](https://static45.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/11cd37c68a8869d25523.jpg)
Расширение, которое проверяет веб-страницу на наличие «битых» или неправильных ссылок.
23. Flickr Tab
![](https://static40.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/e973ddd858328d8c51c1.jpg)
Расширение, которое помогает не столько в разработке, сколько в поиске вдохновения и хороших фотографий. Показывает на каждой новой вкладке в Google Chrome одно изображение с сервиса Flickr. При нажатии на него пользователь переходит на страницу автора, где может ознакомиться с другими его работами.
24. Google Art Project
![](https://static49.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/b6850555e3bf12cd01a3.jpg)
Расширение для браузера, похожее на предыдущий плагин в этом списке — только вместо фотографий из Flickr в новой вкладке пользователь видит признанные произведения искусства — например, полотна кисти Ван Гога или Мане.
25. Data Saver
![](https://static40.siliconrus.cmtt.ru/paper-media/25-chrome-extensions/9da8c1deec489912c93e.jpg)
Официальное расширение от Google для сжатия трафика, которое включает экономию трафика в браузере Google Chrome.
Source vc.ru