Открыть меню

18 расширений Google Chrome для веб-разработки


*гостевой пост от Александра Олейникова — автора блога с уроками по созданию WordPress и еще огромным количеством полезной информации, несмотря на молодость самого ресурса.

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

Firebug Lite

Каждый из тех, кто занимался веб-дизайном или же написанием скриптов понимает, насколько важно порой увидеть исходный код страницы. К примеру, создавая шаблон, предназначенный для InstantCMS или темы WordPress, в любом раскладе сталкиваешься с вопросом – где какой назначен CSS стиль. Так вот, Firebug поможет веб-разработчику сэкономить массу времени, потому что при помощи этого расширения можно узнать абсолютно всё о странице и, конкретно, о какой-то её части. К тому же, с помощью Firebug можно править исходный код и сразу же наблюдать изменен

я в браузере.

Firebugconsole

 

Данное расширение не является заменой предыдущего, а используется вместе с ним. Благодаря Firebugconsole, веб-разработчик может получить более богатое визуальное представление HTML и DOM элементов, а также теней BoxModel.

Checkmylinks

 

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

RegularExpressionTester

 

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

Live CSS Editor

 

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

FormEditor

 

Это расширение позволяет создавать HTML формы. То есть, с помощью FormEditor можно легко и быстро создать любую форму, а также, при необходимости её проверить. Благодаря данному расширению, необходимость знания форм просто отпадает, так как здесь всё работает по принципу обычного перетаскивания. Редактор сам создаёт код, который будет проверять созданные формы.

UnixTimestampConverter

 

Данное расширение представляет собой своего рода конвертер времени. С помощью данного конвертера можно перевести UNIX time в привычное для нас время, а потом, обратно.

ColorPick

ng>

 

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

JSON Prettifier

 

JSON  — это формат текста обмена данными, который основан на JavaScript. Как правило, JSON и используется с этим языком. Так вот, расширение JSON Prettifier делает формат JSON читаемым.

ResolutionTest

 

Данное расширение представляет собой весьма интересный плагин, помогающий тестировать работу любого сайта при различном расширении дисплея. Самое интересное то, что плагин не меняет расширение дисплея ноутбука или ПК, а просто эмулирует всевозможные изменения разрешения.

WebDeveloper

 

Это расширение включает в себя набор различных примочек, предназначенных для включения, отключения и показа скрытых элементов страницы.

YSlow

 

Данное расширение предназначается для анализа веб-страницы. Оно способно интегрироваться с расширением Firebug и показывать подробную статистику по сайту. Также, при помощи YSlow можно получить информацию о том, что и где можно оптимизировать: где включено сжатие, или где отсутствуют необходимые заголовки – всё это способно показывать расширение YSlow.

ScreenCapture

 

Данное расширение позволяет снимать любую часть страницы и сохранять её в PNG формате. Также,  ScreenCapture может служить в роли редактора.

IE Tab

 

Бесспорно, браузер InternetExplorer не является самым популярным среди веб-разработчиков, однако он самый востребованный обозреватель в мире, именно поэтому считаться с ним придётся. Данный плагин позволит в среде GoogleChromeоткрывать интернет страницы так, как будто вы находитесь в InternetExplorer.

PerfectPixel

 

Данное расширение позволяет дизайнерам и веб-разработчикам легко накладывать различного рода “контент” поверх разработанной HTML страницы.

GoogleAnalyticDebugger

 

Изначально был выпущен отладочный код “ga_debug.js”, а уже потом отладочное расширение, которое и назвали AnalyticsTrackingCodeDebugger. Благодаря этому расширению можно получить детальную информацию о методах API. Помимо этого, расширение даст знать об устаревших методах, различных проблемах без изменения трекинг-кода.

Validity

 

Данное расширение способно помочь проверить исходный код на наличие различного рода ошибок.  То есть, Validity можно использовать для быстрой проверки HTML документов, а также адресной строки.

Editthiscookie

 

Это расширение позволяет удалять произвольные куки, находящиеся на текущем сайте, а также редактировать или создавать новые “плюшки”, с помощью всплывающей панели.

18 расширений Google Chrome для веб-разработки обновлено: Октябрь 28, 2016 автором: Елена Иванова
Обсуждение: 3 комментария
  1. Спасибо, очень интересные расширения!

    Ответить
  2. Нашел несколько новых и полезных инструментов, спасибо!

    Ответить
  3. Хорошие подборки, я бы еще добавил Tape — инструмент, с помощью которого можно любую страницу смотреть как фотошоп макет. А также  BuiltWith — помогает видеть все процессы, которые протекают на странице

    Ответить

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

© 2017 Женский SEO блог LadyMaksima · Копирование материалов сайта без разрешения запрещено
Дизайн и поддержка: GoodwinPress.ru

Рассылка 'Создание блога, заработок в интернет'