Рекомендации по использованию дополнительных средств браузера для помощи в разработке

Для Firefox:

Firebug является удивительным для исследования и развития.

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

Я также использую заголовки Live HTTP (я думаю, что он называется, но он находится на моей рабочей машине, поэтому не могу найти ссылку сейчас). Что помогло нам решить проблемы с кэшированием и тому подобное.

Я много занимаюсь разработкой мобильных телефонов, поэтому я также использую UserAgent Switcher . Очень полезно для притворяться разными мобильными телефонами.

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

Firefox:

• Проверьте это , если вы используете инспектор DOM вообще
• Измерьте его , чтобы сообщить вам расстояния в пикселях (если вам это нужно)
• IE View или Safari View для удобства тестирования в других браузерах
• HTML валидатор , если вы заботитесь о проверке
• Консоль ²

Другим обязательным элементом для Firefox является панель инструментов веб-разработчика Криса Педерика .

Вы обязательно должны установить Safari. Он имеет ряд встроенных инструментов. Я использую его в сочетании с другими браузерами все время.

• Сетевой График
• Консоль Ошибок
• веб-инспектор
• Редактор Фрагментов Кода

Кроме того, он позволяет установить пользовательский агент для ваших запросов.

Учтите это, у него есть отдельное меню верхнего уровня, называемое Develop .

В случае IE, следующие инструменты могут быть полезны

• Панель инструментов разработчика Microsoft -dom / просмотр стилей
• Fiddler HTTP отладчик -http монитор
• Мгновенный источник -dom / просмотр стилей
• Companion.JS-dom |просмотр стилей, расширенная консоль ошибок

Расширение "uber" для IE - "инструменты разработчика", предоставляемое в составе IE8

Opera имеет:

Стрекоза (инструменты - > дополнительно - > инструменты разработчика)

Меню Отладки

UserJS методы перехвата вещей

opera:config#CompatMode%20Override для форсирования причуд или стандартного режима

Виджеты веб-разработчиков

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

Консоль разработчика и снимок DOM для Opera:

http://dev.opera.com/tools/

Удивительность заключается в том, что это букмарклеты, реализованные с помощью JS. Отстойность заключается в том, что они требуют Интернета.

Firefox:

Проверьте это, если вы вообще используете инспектор DOM

Измерьте его, чтобы сообщить вам расстояния в пикселях (если вам это нужно)

IE View или Safari View для удобства тестирования в других браузерах

HTML валидатор, если вы заботитесь о проверке

Console2 для улучшения консоли ошибок js

Букмарклет Javascript Shell также удобен (и посмотрите на другие там же)

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

Этот список Cebjyre является почти полным (так как FireBug уже упоминалось в вопросе). Я бы только добавил Tamperdata . Время от времени это очень полезно.

Вот мои ориентированные на разработку дополнения для Firefox 3 :

1. веб-разработчик
2. Firebug
   1. Фейерверк
   2. FirePHP
   3. Радуга
3. TamperData
4. Плакат
5. FireFTP
6. ReloadEvery
7. Selenium IDE

YSlow -это сладкий аддон Firebug для устранения неполадок во время загрузки страницы.

Вот что я использую:

Firefox:

• Инспектор DOM: я использую это больше, чем что-либо еще для веб-разработки
• Launchy: для открытия сайтов в других браузерах / приложениях
• Данные вскрытия: это может быть полезно для отладки запросов GET / POST
• Панель инструментов веб-разработчика: здесь есть так много удобных функций для отладки: инструменты проверки W3C, встроенная линейка, инструменты изменения размера, манипуляции с исходным кодом, простые инструменты cache/css/script

IE:

• Панель инструментов разработчика Internet Explorer: нигде не так удобна, как Firefox, но, по крайней мере, она дает вам достойный инспектор DOM

Разное:

• Удобные букмарклеты Джесси: букмарклет shell особенно удобен
• Я также устанавливаю Safari и Opera, но в основном просто использую их для тестирования и бенчмаркинга, поскольку их инструменты разработки не так надежны, как Firefox, и они не так глючны, как IE.
• Lynx: я использую это, чтобы убедиться, что любые JS-тяжелые сайты все еще работают, так что я уверен, что они будут выглядеть OK для google, Screen readers и любого другого бот-подобного приложения.

Помимо уже упомянутых превосходных инструментов, я нахожу Чарльза чрезвычайно полезным. Тем более, что я много работаю с удаленным удалением Flash, которое он отлично обрабатывает.

Charles-это прокси-сервер HTTP / монитор HTTP / обратный прокси-сервер, который позволяет разработчику просматривать весь трафик HTTP между своей машиной и интернетом. Это включает в себя запросы, ответы и заголовки HTTP (которые содержат файлы cookie и информацию о кэшировании).

Чарльз может выступать в качестве man-in-the-middle для HTTP/SSL связи, что позволяет отлаживать содержимое ваших сеансов HTTPS.

Это кроссплатформа, стоит $50,, но есть"30 минут за сеанс" -оценка, которую вы можете скачать.