Программы. Советы. Безопасность. Интересное. Накопитель

Лучшие расширения дизайнеру и разработчику chrome. Расширения Google Chrome для веб-разработки и не только

Google Chrome - это самый быстрый и популярный браузер в мире от разработчиков Google. Главным плюсом является, конечно легкий интерфейс и скорость. Он не только быстро обрабатывает веб-страницы, но и запускается быстрее чем другие браузеры. В Chrome появилось множество расширений для дизайнеров и разработчиков.

В этой статье мы собрали список самых лучших и полезных расширений Google Chrome для веб-дизайнеров и разработчиков.

1.

Расширение Chrome, которое добавляет боковую панель к исходному коду, которая отображает информацию о градиентах, применяемых к проверяемому элементу. Вы также можете переключать каждый градиент индивидуально, так как они представляют собой разные слои.

2.

Emmet LiveStyle - это плагин для живого двунаправленного (редактор ↔ браузера) редактирования CSS кода. В настоящее время он работает в Google Chrome, Safari и Sublime Text, другие браузеры будут дополняться разработчиками. С помощью этой расширении вы можете связать два совершенно разных источника CSS для живого редактирования.

3.

Расширение Dimensions Toolkit предлагает полезные инструменты для тестирования ваших адаптированных веб-проектов, с точками отслеживания и по умолчанию, изменяемыми по размеру размерами и т. д. Он доступен как расширение Chrome, так и веб-приложение.

4.

Если вы работаете с Batman.js, это расширение Batman.js Devtools Chrome является бесценным для вас инструментом. Он включает в себя множество инструментов, полезных для разработки с Batman.js прямо в браузере.

5. Clockwork

Если вы разработчик PHP и используете Chrome, ознакомьтесь с расширением Clockwork Chrome. Он предоставляет новую панель со всеми полезными данными отладки и профилирования, включая информацию о данных GET и POST, куки, запрос, заголовки, данные сеанса и многое другое.

Google Chrome - быстрый и популярный браузер среди пользователей Интернета, он быстро запускается с вашего рабочего стола, быстро загружает веб-страницы и быстро запускает сложные веб-приложения. Окно браузера Chrome обтекаемо, чисто и просто. В Chrome появилось множество расширений, поддерживающих веб-разработчики, для Chrome, но разработчики все чаще предлагают Chrome попробовать, а некоторые из них не оглядываются назад.

В этом обзоре мы собрали некоторые из лучших и полезных расширений хром для разработчиков и дизайнеров, которые упростят задачи разработки легко и без особых проблем. Таким образом, без особого внимания ado позволяет проверить следующие хромированные расшир

Независимо от того, что вы слышали о Google Chrome, когда речь идет о веб-дизайне и разработке, Firefox по-прежнему остается лучшим браузером с дружественной средой разработки, который вы можете найти.

Черт, у Firefox даже есть специальная версия браузера, созданного только для веб-разработчиков. Вот насколько сильно Mozilla заботится о веб-дизайнерах и разработчиках.

У Firefox также есть огромная коллекция расширений, которые делают браузер более мощным для максимального эффекта. Вот некоторые из лучших расширений Firefox, которые вы можете использовать, чтобы облегчить себе жизнь в процессе веб-разработки.

Установите, протестируйте и используйте большинство из этих расширений. В конце концов, все они бесплатны для использования!

  • Что делает: Инспектирует веб-страницы

Firebug - это расширение, без которого веб-дизайнеры и разработчики просто не могут жить. Это расширение похоже на расширенную версию интегрированной консоли разработчика, которая поставляется вместе с Firefox. Firebug значительно облегчает вам проверку элементов на веб-страницах и показывает, как все работает на разных сайтах.

  • Подходит: веб-разработчикам
  • Что делает: клиент для Firefox

FireFTP - это FTP/SFTP-клиент для Firefox, который позволяет вам безопасно загружать и передавать файлы между вашим компьютером и сервером непосредственно из вашего браузера. Благодаря этому дополнению вам никогда больше не придется прыгать между браузером и клиентскими приложениями FTP.

  • Подходит: веб-разработчикам и дизайнерам
  • Что делает: анализ и проверка веб-страниц

Это своеобразное расширение «все в одном», которое добавляет в ваш Firefox ряд полезных инструментов. Некоторые из инструментов, включенные в этот аддон - отображение и редактирование таблиц стилей CSS, отключение стилей, инструменты отладки и т. д.

  • Что делает: инструмент для анализа цвета

ColorZilla - отличный инструмент, который интерфейсные веб-дизайнеры найдут весьма полезным. Этот аддон имеет пипетку для быстрого выбора цвета на веб-странице, генератор градиента CSS, цветовой анализатор, цветовые палитры и многое другое.

  • Подходит: веб-разработчикам
  • Что делает: изменение веб-сайтов с настраиваемым кодом

Любимое более миллионом пользователей Firefox, Greasemonkey - это расширение, которое подарит вам бесконечное удовольствие. Это дополнение позволяет вам настраивать популярные веб-сайты, редактируя их с помощью собственного кода JavaScript. Вы также можете получить удовольствие от скриптов, уже созданных другими разработчиками.

  • Подходит: дизайнерам интерфейсов
  • Что делает: регулирует смещение веб-элементов

Простой, но полезный плагин, который позволяет вам проверять веб-элементы и визуально видеть, сколько пикселей отключено в элементах, создавая композицию с прозрачными слоями. Используя эту композицию, вы можете настроить свою реальную веб-страницу так, чтобы она соответствовала наложению для достижения наилучшего результата без каких-либо догадок.

Например, если одно из изображений на вашей веб-странице перекрывает другой объект, вы можете использовать Pixel Perfect, чтобы определить, сколько пикселей нужно настроить, чтобы получить это изображение в нужном месте.

  • Подходит: веб-дизайнерам
  • Что делает: загружает все с веб-страницы

Этот плагин соответствует своему названию, позволяя вам загружать все с веб-страницы. С помощью одного щелчка вы можете загрузить все изображения, ссылки и другие данные, содержащиеся на веб-странице, используя данное расширение. Аддон также имеет встроенный ускоритель загрузки, который оптимизирует скорость загрузки в четыре раза.

  • Подходит: дизайнерам интерфейсов
  • Что делает: проверяйте веб-страницы в Internet Explorer

Хотите - верьте, хотите - нет, но есть люди, которые все еще используют старые версии Internet Explorer для выхода в Интернет. Создание сайтов, хорошо работающих в этих старых браузерах, является одной из проблем, с которой веб-дизайнеры по-прежнему борются. Этот плагин упрощает настройку веб-дизайна для более старых браузеров Internet Explorer, создавая новую вкладку в IE.

  • Подходит: веб-дизайнерам и разработчикам
  • Что делает: показывает о технологии, используемые на веб-сайте

Хотите знать, какие технологии использовались для создания ваших любимых веб-сайтов? Тогда это дополнение вам пригодится. BuiltWith - это расширение, которое позволяет сканировать веб-сайты, чтобы найти, какие технологии используются на странице. Отличный инструмент для всех начинающих веб-дизайнеров, чтобы учиться на примере готовых веб-сайтов.

  • Подходит: веб-разработчикам
  • Что делает: включает или выключает Java

Это дополнение позволяет вам легко включать или отключать Java в вашем браузере. Он также может отключить на веб-странице Javascript, Cookies, анимированные изображения, Flash и другое. Это полезный плагин не только для разработчиков, но и для обычных пользователей, чтобы повысить безопасность браузера и снизить пропускную способность.

  • Подходит: дизайнерам интерфейсов
  • Что делает: Измеряет элементы в пикселях

Функция этого дополнения проста, он позволяет вам рисовать виртуальную линейку поверх веб-страницы или элемента на странице, чтобы измерить ширину, высоту или выровнять элемент по пикселям на веб-странице. MeasureIt пригодится большинству разработчиков интерфейсов для создания макетов.

  • Подходит: веб-дизайнерам
  • Что делает: переключает язык в браузере

Это полезный инструмент, который мгновенно переводит ваш Firefox на другой язык. Все в вашем браузере, включая пользовательский интерфейс, словарь проверки орфографии и содержимое веб-сайта, будут переведены на выбранный вами язык. Отличная возможность, которую вы можете использовать при разработке многоязычных веб-сайтов.

  • Подходит: дизайнерам интерфейсов
  • Что он делает: генерирует фиктивный текст

Создание фиктивного текста для ваших новых макетов и прототипов веб-сайта - это скучная задача, которая вряд ли способна развлечь хотя бы одного дизайнера. Это расширение сделает этот процесс менее скучным, позволяя вам создавать фиктивный текст «Lorem Ipsum» прямо из Firefox.

  • Подходит: веб-разработчикам
  • Что делает: редактирует и создает cookie

Это дополнение не только управляет файлами cookie вашего сайта, но и позволяет легко редактировать и создавать новые файлы. Некоторые из функций плагина включают встроенный просмотр файлов cookie, возможность сменить домен, возможность одновременного редактирования нескольких файлов cookie и многое другое.

  • Подходит: дизайнерам интерфейсов
  • Что делает: выбирает цвета на веб-странице

Простой в использовании инструмент, который позволяет вам выбирать цвета любого пикселя на веб-странице и легко копировать цветовой код RGB или Hex для использования в ваших собственных проектах. Красота и визуальный интерфейс этого инструмента значительно облегчают новичкам изучение цветов на веб-страницах.

  • Подходит: веб-дизайнерам и разработчикам
  • Что делает: дает информацию о программном обеспечении, используемым веб-сайтом

Подобно дополнению BuiltWith, Wappalyzer – это еще одно полезное расширение, которое позволяет вам узнать, какое программное обеспечение используется на веб-сайте. Например, вы можете узнать, какой тип CMS использует сайт, какую операционную систему поддерживает сервер веб-сайта и многое другое.

  • Подходит: веб-разработчикам
  • Что делает: изменяет пользовательский агент браузера

Хотите узнать, как будет выглядеть ваш сайт на разных платформах и операционных системах? Тогда это инструмент, который пригодится вам точно пригодится. User-Agent Switcher позволяет переключаться между различными платформами, такими как Android, Mac, Windows, и выбирать операционные системы для изменения пользовательского агента вашего браузера.

  • Подходит: веб-дизайнерам и разработчикам
  • Что делает: показывает пример использования вкладки памяти браузера

Это удобное дополнение, которое поможет вам определить, сколько ресурсов вашего компьютера используется каждой открытой вкладкой в Firefox. Вы можете использовать этот инструмент, чтобы выяснить, сколько ресурсов используется вашим сайтом и оптимизировать сайт для достижения максимальной производительности.

  • Подходит: веб-дизайнерам и графическим дизайнерам
  • Что делает: открывает изображения в Photoshop

Это дополнение делает то, что говорит его название, просто открывает одним щелчком изображения, которые вы находите на веб-странице с помощью Photoshop. Не нужно загружать изображение или запускать Photoshop, расширение будет делать все, что необходимо.

  • Подходит: дизайнерам интерфейсов
  • Что делает: улучшает таблицы HTML

Графики, статистика, сравнения, таблицы - это дополнение может сделать все. Вы можете использовать этот инструмент для создания удобных и красивых HTML-таблиц и схем.

  • Подходит: веб-разработчикам
  • Что делает: клиент SSH для Firefox

Как правило, вам нужно установить приложение для запуска SSH-терминала. Эти приложения отличаются одной операционной системы от другой. FireSSH, однако, работает на всех платформах, если у вас есть Firefox. Расширение позволяет запускать SSH-терминал непосредственно из браузера.

  • Подходит: дизайнерам интерфейсов
  • Что делает: автоматически обновляет веб-страницы

Одна из раздражающих вещей, с которыми сталкиваются веб-дизайнеры при разработке веб-сайтов, это необходимость обновлять веб-страницу вручную после внесения каждого небольшого изменения в код. Auto Refresh - это расширение, которое устраняет эту проблему, позволяя автоматически обновлять одну или несколько вкладок в Firefox с определенными вами интервалами.

  • Подходит: дизайнерам интерфейсов
  • Что делает: изменяет размер окон Firefox для конкретных разрешений экрана

Это дополнение позволяет изменять размер окна Firefox в определенных разрешениях, чтобы увидеть, как выглядит ваш веб-сайт на разных экранах. Вам понадобится установить Firefox Add-On Bar для того, чтобы это расширение работало должным образом.

  • Подходит: веб-дизайнерам и разработчикам
  • Что делает: находит информацию о шрифтах страницы и ее элементов

Font Finder - удобный инструмент, который позволяет вам изучать элементы веб-сайта, чтобы узнать важную информацию о шрифтах, используемых на странице, такую как название семейства шрифтов, цвет шрифта, межстрочный интервал, декор и многое другое.

  • Подходит: дизайнерам интерфейсов
  • Что делает: проверяет веб-страницы в различных браузерах

Функция этого дополнения проста. Оно позволяет мгновенно открывать любую веб-страницу, которую вы просматриваете в Firefox, с помощью другого браузера одним щелчком мыши. Нет необходимости копировать URL-адреса, открывать каждый браузер один за другим и вставлять URL-адреса, чтобы открыть веб-сайт.

  • Подходит: веб-дизайнерам и разработчикам
  • Что делает: очищает кэш браузера

Это дополнение моментально очищает кэш браузера Firefox (RAM и DISK), чтобы сократить использование ресурсов компьютера. Расширение позволяет очистить кэш, просто нажав на кнопку или нажав клавишу F9 на клавиатуре. Если вы хотите быстро просмотреть изменения, внесенные на веб-страницу, это дополнение окажется очень полезным.

С момента своего появления отличился хорошей скоростью работы, простотой и удобством, чем с первых дней завоевал массу поклонников. В то же время, на Хром обрушилось много «критики» от людей которые привыкли к удобным плагинам на Firefox — плагины были одним из факторов, которые не позволяли использовать Google Chrome в качестве привычного рабочего инструмента. В их числе были веб-дизайнеры, веб-мастера, разработчики и др.

К счастью, эти времена давно остались позади и сегодня для Google Chrome разработано (или адаптировано) огромное количество расширений (Extentions). Давайте рассмотрим те что будут полезны веб-дизайнеру или веб-мастеру.

Web Developer

Web Developer - это не один, а целый набор инструментов для дизайнера и веб-разработчика. С помощью этого расширения вы можете получить информацию о том или ином элементе страницы, стилях, изображения и прочее. Лично я использую Web Developer но только под Firefox, чаще всего с его помощью просматриваю страницы в размере 1024*768 для корректного отображения в меньших мониторах, тестирую и правлю CSS на лету, использую для валидации, можно удалить Cookies и еще много чего.

Firebug Lite

Firebug Lite - облегченная версия популярного плагина Firebug (известного так же на Firefox). Расширение представляет из себя инспектор элементов и удобный инструмент отладки. В Lite-версии отсутствует Net-панель и JavaScript debugger. Для опытных разработчиков, думаю, нет смысла рассказать в чем преимущества Firebug.

CSSViewer

С помощью CSSViewer вы можете быстро посмотреть набор стилей для любого элемента страницы. Простой, но очень удобный плагин. Насколько я знаю в Firebug и Web Developer есть тоже что-то подобное, но если не нужны другие функции этих расширений, то можно установить это куда более простое.

Window Resizer

Window Resizer позволяет вам посмотреть как ваша страница будет выглядеть при различных разрешениях экрана. Имеется предустановленные форматы мониторов, ноутбуков и мобильных устройств, что выгодно отличает это расширение Google Chrome от того же Web Developer, где (насколько я знаю в Firefox) нужно самому создавать размеры для проверки.

HTML Validator

Согласитесь, каждый раз заходить на сайта W3C чтобы проверить валидность кода не очень удобно? Расширение HTML Validator делает процесс удобным и практически молниеносным. В одной из прошлый статей Tod’s Blog я рассматривал вопрос валидности HTML в том числе с использованием noindex. После обсуждений пришел к выводу, что она хоть и не является обязательным на 100% условием успешного сайта, но поможет выявить ошибки верстки, которые (по возможности) лучше всего исправить. Кстати, если сравнивать с тем же Web Developer, при валидации в нем вас перебрасывает на сайт W3C где можно посмотреть ошибки, но нет просмотра в текущем окне как это показано для Google Chrome на картинке выше.

PHP Consol

PHP Consol - мощный инструмент отладки PHP. Причем, данное расширение не такое простое каким кажется с первого взгляда (полный набор функций вы можете изучить на странице расширения). Консоль позволяет увидеть ошибки, исключения и разные отладочные сообщения.

ColorPicker

ColorPicker - это «пипетка» для Google Chrome. С помощью этого расширения вы можете определить значение цвета в любой области страницы. Основные особенности плагина:

  • — Регулируемая область пипетки - от 1 до 101 пикселя (вы можете определить значение цвета определенного пикселя или области);
  • — Проверка на совместимость (соответствие) с WCAG 2.

Одним словом — архиважный и очень удобный инструмент для дизайнера.

Chrome Palette

Chrome Palette - еще одно полезное расширение для работы с цветом. Благодаря Chrome Palette можно за считанные секунды сформировать палитры из любого изображения:

Font Editor

Расширение Font Editor позволит вам посмотреть как будут выглядеть те или иные шрифты (включая гарнитуру, начертание, размер шрифта и прочее) на любом сайте:

Chrome Page Extended

Chrome Page Extended нельзя назвать чисто «дизайнерским» плагином, зато он поможет вам управлять (в том числе и с помощью горячих клавиш) всеми имеющимися (установленными) расширениями. Надеюсь эти 10 расширений для Google Chrome повысят вашу производительности и эффективность в этом, безусловно, очень перспективном браузере! И если раньше одним из немногих останавливающих факторов от его использования был недостаток расширений Google Chrome, то сегодня этой преграды нет.

P.S. Если вы новичок в интернете и пока еще не знаете как создать свой блог можете попробовать бесплатный и полезный видеокурс по вордпресс.
Компания СпецСервис Логистика поможет с сертифицировать продукцию для которой держспоживстандарт требует наличие специальных сертификатов.
Хотите установить интересный статус посмотрите готовые статусы о любви в контакте которые можно использовать для своих персональных страниц соц.сети.

Google Chrome поддерживает нескольких различных каналов обновлений, начиная от ежедневных сборок Canary и заканчивая стабильными релизами с 6-недельным циклом выхода.

Обратите внимание, что Вы можете запускать релизы Canary совместно с сборками другого канала, потому что в этом случае не производится обмен данными профиля с другими каналами. Это позволяет пользователям тестировать новейшие разработки, сохраняя проверенную версию Google Chrome.

Обзоры каналов Google Chrome

  • Stable : данный канал получает полностью протестированные тестовой командой Google версии браузера, которые не содержат серьезных сбоев и значительных проблем. Канал обновляется каждые 2 недели для промежуточных выпусков и каждые 6 недель для основных релизов. Скачать стабильную версию можно на странице - Google Chrome .
  • Beta : Если Вы хотите протестировать новые функции и улучшения с минимальными риском, канал Beta будет отличным выбором. Сборки обновляются каждую неделю, а основные версии появляются каждый 6 недель, более, чем за месяц до выхода стабильной версии.
  • Dev : Если Вы хотите ознакомиться с нововведениями как можно быстрее, вам подойдет канал Dev. Канал Dev получает обновление один или два раза в неделю и наглядно демонстрирует над какими улучшениями ведет работу команда Chrome. Задержка относительно основных версий отсутствует, и пользователь получает последний код. Несмотря на то, что данные сборки проходят тестирования, в них может содержаться большое количество ошибок.
  • Canary : В сборках Canary тестируются изменения, связанные с риском. Релизы выпускаются ежедневно и не проходят предварительное тестирование. Так как нет гарантий, что данные версии запустятся, они используют собственный профиль и настройки, а значит могут работать параллельно релизам другого канала Chrome. По умолчанию версии Canary сообщают о сбоях и статистке использования в Google, но Вы можете отключить данную опцию на странице загрузки.
  • Другие сборки : Если Вы - абсолютно бесстрашный тестировщик, Вы можете загрузить последнюю рабочую сборку из непрерывного потока разработки Chromium, посмотрев на номер под "LKGR", перейдя в загрузочный сегмент Google и скачав соответствующую сборку.

Примечание: Релизы раннего доступа (сборки Canary, Dev и Beta) будут лишь частично переведены на другие языки, отличные от английского. Текст, связанный с новыми функциями может не быть переведен на другие языки до того, как выйдет стабильная версия.

Что нужно знать, перед изменением канала?

Резервное копирование данных

Перед тем, как Вы перейдете на другие сборки, Вы должны создать резервное копирование данных профиля (закладки, самые посещаемые страницы, история, файлы куки и т.д.) Если Вы захотите снова перейти на более стабильный канал, обновленный данные могут быть несовместимыми со старыми версиями.

Сделайте копию папки User Data\Default directory (например, скопируйте в папку "Default Backup" в той же директории). Путь зависит от операционной системы:

  • Каналы Stable, beta, и dev: \Documents and Settings\username\Local Settings\Application Data\Google\Chrome\User Data\Default
  • Сборки Canary: \Documents and Settings\username\Local Settings\Application Data\Google\Chrome SxS\User Data\Default

Windows Vista или 7:

  • Каналы Stable, beta, и dev: \Users\username\AppData\Local\Google\Chrome\User Data\Default
  • Сборки Canary: \Users\username\AppData\Local\Google\Chrome SxS\User Data\Default
  • Каналы Stable, beta, и dev: ~/Library/Application Support/Google/Chrome/Default
  • Сборки Canary: ~/Library/Application Support/Google/Chrome Canary/Default
  • ~/.config/google-chrome/Default

Примечание: если Вы используете Проводник Windows для поиски папки, может потребоваться включение опции “Показывать скрытые папки и файлы” в Панели управления> Свойства папки (Параметры Проводника) > Вид

Работая в качестве веб-разработчика, вы, вероятно, много времени используете браузер. Сегодня почти каждый браузер имеет свои собственные инструменты для разработчиков, которые позволяют увидеть, что происходит за кулисами. Некоторые из браузеров имеют множество расширений, которые помогут вам оптимизировать процесс веб-разработки.

В этом посте мы собрали наши любимые и полезные расширения для Google Chrome, помогающие упростить жизнь веб-разработчика.

1 Web Developer

Web Developer Tools является одним из самых полезных расширений для любого разработчика. Он добавляет панель инструментов в Chrome. С её помощью можно удобно редактировать CSS, просматривать JavaScript и многое другое. Расширение доступно для браузеров Chrome, Firefox и Opera.

2 Accessibility Web Developer Tools

Миллионы людей пользуются Интернетом, в том числе люди с ограниченными возможностями. Поэтому обязательно ваши сайты должны быть доступны этой категории пользователей. Это расширение позволяет запустить проверку доступности на любой странице в сети. Добавьте его в список инструментов для веб-разработчика. Чтобы использовать его, щелкните на вкладке аудиты, выберите аудит доступности, далее пункт выполнить. Если страница нарушает какие-либо правила, они будут отображаться в виде списка с одним или несколькими нарушениями элементов на странице.

3 Responsive Web Design Tester

Используйте расширение Responsive Web Design Tester, чтобы проверить, как страница реагирует на различные устройства. Оно отражает размер и браузер мобильного устройства, поставляется с пресетами различных Android устройств. Он также работает в автономном режиме, который полезен при разработке сайтов на локальном хостинге без доступа к Интернету.

4 Wappalyzer

Если вы когда-либо использовали Built With, вы будете знакомы с концепцией Wappalyzer . Это расширение определяет системы управления контентом, платформы электронной коммерции, веб-серверы, базы JavaScript, аналитические инструменты и многое другое. Кроме того, приложение доступно для браузера Firefox.

5 PerfectPixel

Благодаря этому расширению , вы можете быть уверены, что дизайн будет идеально соответствовать полученному коду. Просто установите расширение, это позволит вам поставить полупрозрачные наложения изображения поверх веб-страницы, чтобы сравнить изображение с версткой. Накладки могут быть различными для каждого сайта и сохраняются между сессиями просмотра.

6 Refined GitHub

Если вы разочарованы пользовательским интерфейсом GitHub, это расширение является обязательным для вас. Оно упрощает интерфейс GitHub по умолчанию и добавляет все виды дополнительных функций: маркировка вопросов; выделение запросов, как непрочитанных; добавление кнопки быстрого редактирования; добавление авторской ссылки и многое другое.

7 CDN Headers & Cookies

Это расширение позволяет просматривать все HTTP-заголовки и куки в одном месте. Это легкое и простое расширение. Вы можете добавлять, редактировать или удалять пользовательские заголовки запросов и куки, а также заголовки запросов на экспорт и куки в файл CSV.

8 User Agent Switcher

Используйте это расширение , чтобы изменить агента пользователя для подмены устройства и/или браузера. Вы можете быстро переключаться между различными пользователями или добавлять свои собственные с настройками, имитирующими Internet Explorer, iPhone, или имитирую работу Google бота. Это полезно для отладки и тестирования поведения сайта на различных устройствах.

9 JSON Viewer

Расширение для печати JSON и JSONP, которое вы можете настроить под свой вкус. Оно включает в себя такие функции, как разборные узлы; интерактивные URL-адреса; блокнот, в который вы можете внести JSON формат на неопределенное время с помощью одной кнопки или комбинации клавиш; 27 встроенных тем и много другое.

10 Check My Links

Если вы регулярно редактируете страницы с большим количеством ссылок, не забудьте включить это расширение в свой список помощников для веб-разработчика. Оно может быстро найти все ссылки на странице и проверить каждую из них. Хорошие ссылки выделяются зеленым цветом, а битые красным. Расширение также будет публиковать полные URL-адреса битых ссылок в журнале консоли.

11 Usersnap

Часто веб-разработчики ежедневно сотрудничают с несколькими людьми, работая над проектом. Это небольшое расширение позволит упорядочить процесс совместной работы, поскольку оно создает скриншоты текущего контента. Вы сможете общаться более эффективно по различным вопросам, обмениваться обратной связью между другими разработчиками, клиентами и другими людьми, участвующими в веб-разработке проекта.

12 IE Tab

IE Tab эмулирует Internet Explorer, используя свой движок рендеринга непосредственно в Chrome. Приложение позволяет использовать элементы управления ActiveX для проверки разрабатываемых сайтов с различными версиями IE, начиная от IE6 до IE9.

13 DevTools AutoSave

Использование инструментов разработчика для внесения изменений на лету с целью тестирования, дальнейшая вставка произведенных изменений в текстовый редактор и загрузка на сервер могут обернуться адскими муками. К счастью, это расширение приходит как спасатель, поскольку оно позволяет автоматически сохранять любые внесенные в CSS и JS сайта изменения в исходный файл.

14 Chrome MySQL Admin

Если вы ежедневно работаете с базами данных, рассмотрите возможность включения этого расширения в свой рабочий процесс. Это простой MySQL клиент со всеми необходимыми инструментами для управления базами данных и таблиц MySQL. Вы сможете подключиться к базам данных и управлять ими, выполнять запросы, создавать и удалять таблицы и многое другое в быстром и легком интерфейсе приложения.

15 Grunt Devtools

Это расширение инструментов разработчика Chrome добавляет инструменты с поддержкой фоновых задач и позволяет выполнять задачи для многочисленных проектов в одном окне.

Если вы используете другие полезные веб-разработчику расширения для Google Chrome, то поделитесь ими в комментариях к статье. Нам интересно узнать, что используют другие программисты и верстальщики в своей работе.

Похожие публикации