Плагины для Firefox, необходимые веб-разработчику

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

FireBug

Это самый главный инструмент. Он позволяет посмотреть структуру HTML-кода так, как видит его браузер. И не просто посмотреть, а можно изменить код и сразу увидеть как это будет выглядеть на самом деле. Аналогично можно проделывать и с CSS. Кроме того, можно посмотреть структуру DOM, отладить JS, смотреть заголовки.

firebug

И это еще не все. Имеется замечательная функция Inspect, с помощью которой можно посмотреть какие тэги и свойства определяют положение конкретного элемента на странице. Кроме того, в закладке Layout можно посмотреть какие поля и отступы у этого элемента.

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

Скачать: Firebug

Web Developer

Про этот плагин можно говорить часами. Он представляет собой панель, на которой размещены средства для просмотра и анализа любых(!) элементов и их атрибутов.

webdeveloper

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

Скачать: Web Developer

Pixel Perfect

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

Скачать: Pixel Perfect

HTML Validator

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

html validator firefox

Скачать: HTML Validator

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

  • FireBug отличный плагинт, постоянно им пользуюсь и все советую, автору спасибо за пост

  • Darmoid

    Хороший пост спасибо! Некоторые из етих аддонов я не знал.

  • Спасибо за HTML Validator, действительно очень облегчил себе жизнь

  • Вот, спасибо, добрый человек! Особенно за информацию о Pixel Perfect и HTML Validator. Раньше про них не знал…

  • Добавлю парочку своих —
    http://amb.vis.ne.jp/mozilla/scrapbook/ ScrapBook, позволяет корректно сохранять вебстраницы.
    http://tamperdata.mozdev.org/ TamperData, позволяет отследить, какие данные передаются запросом(пост, гет) на сервер.

  • Самое приятное, что на сам плагин FireBug можно ставить c десяток плагинов по работе с CCS, jQuery…