WebTools. Веб-утилиты.

19.11.2009 11:04 / Сергей Дяговченко / 1377 просмотров / ...

Под катом - список утилит, которые частично облегчают жизнь веб-программисту... :)

JavaScript

A JavaScript Compressor - по ходу, лучший и самый известный упаковщик кода JavaScript.

JSLint - проверка качества кода JavaScript. Есть куча опций для форматирования кода и т.п.

Javascript unpacker and beautifier - очень удобная штука если необходимо разобраться в чужом коде или, даже, в своем :)

Underscore.js - маленькая библиотечка с полезными функционалом Prototype и jQuery.

CSS

Texster - подбор шрифтов и создание CSS стилей для текста. Визуально можно подбирать шрифты для проекта и получить CSS-код.

Typetester - утилитка для визуального сравнения шрифтов. Вводим текст, настраиваем параметры шрифта и сравниваем. Сравнивать возмонжо 3 шрифта.

CSS tests and experiments - различные CSS тесты для браузеров.

RichInStyle.com test suite - тоже, тесты...

Official W3C CSS Test Suites - офиц. тесты W3C.

CSS2 Test Suite: Prototypical Pages - и еще одни...

Работа с изображениями

Base64 Decoder and Encoder - кодируем и декодируем изображения в base64 код.

RIOT - Radical Image Optimization Tool - утилита для оптимизации изображений формата JPG, GIF, PNG.

Для вебмастера

Pingdom - позволяет визуально просмотреть скорость загрузки страницы, увидеть проблемные места.

Fiddler - утилита для отладки Web Proxy. Позволяет просматривать весь HTTP(S) траффик и "играться" входящими и исходящими данными. Одна из функциональных фишек, которая часто используется - возможность имитировать "модемную" скорость интернета.

Работа с Regex

RegexBuilder - удобная утилитка для проверки регулярных выражений

Для верстки

Генераторы XHTML кода

XHTML/CSS Markup Generator - полезная вещь для быстрого генерирования каркаса XHTML шаблона вместе с прилагаемым CSS файлом. Возможно добавление XHTML тэгов, id значений, названия классов и др. XHTML атрибутов. Глубина иерархии тэгов в генерируемом шаблоне определяется количеством пробелов в структуре (входящие данные). Там же, есть пример...

HTMLipsum - подборка стандартных XHTML элементов (параграфы, списки, формы, тексты) с Lorem Ipsum текстом внутри. Достаточно скопировать и вставить в свой код.

Генераторы текста

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

Яндекс.Рефераты - русский аналог «рыбо-генератора».

Шифруем e-mail

E-mail Obfuscator - утилитка для шифрования e-mail адресов. Таким образом делая их невидимыми для спам-ботов. Принцип работы: вводим e-mail адресс - получаем результат.

Распознование текста

Free OCR - сервис помогает распознать текст из изображение... на сколько он хорош, пока не знаю, но будем использовать по мере необходимости. Обнаружилась одна неприятность - ограничение в 10 загрузок изображений в течении часа. Нас это не пугает, так как есть еще один сервис:

Free Online OCR

Программы-помощники

FastStone Capture - утилитка из категории "все-в-одном":

  • линейка - для выполения измерительных действий;
  • пипетка - для получения значения цвета любой точки экрана;
  • захватчики экрана (области, окна...);
  • возможность сделать принтскрин с прокруткой окна, удобно для веб-страниц;
  • редактирование захваченных изображений в собственном редакторе;
  • захват действий пользователя с экрана в видео;
  • экранная лупа.

PicPick - аналагоична FastStone Capture с парой новых возможностей:

  • Углометр - для измерения угла между элементами на экране;
  • Перекрестие - для измерения прямоугольной области экрана (в FastStone Capture это возможно через снятие скриншота прямоугольной области);
  • Грифельная доска - позволяет прямо на экране обводить, выделять, делать пометки без дополнительных телодвижений (в FastStone Capture сначала необх. сделать скриншот рабочей области экрана и затем уже в редакторе делать такие манипуляции).