20 сервисов и советов для веб разработчиков. Часть 1

Редакция tmtm.ru

NounProject — лучшая и наибольшая коллекция SVG картинок

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

Codebeautifier — кроссбраузерная подготовка CSS файлов c уменьшением веса самого CSS файла.

Так как разные браузеры, в частности IE воспринимают некоторые параметры CSS по разному, это доставляет проблем при кроссбраузерности. С помощью этого ресурса можно создать CSS файл который будет идентично работать во всех браузерах.

Iterm2 — лучшая консоль для mac OS и замена страндартному терминалу. 

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

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

Web developer — плагин для Firefox дающее множество возможностей.

Например, смотреть/вносить/редактировать куки, просматривать топографию для симметрии, инфо по картинкам и прочее.

ColorZilla — плагин для firefox позволяющий кликнуть мышкой на любой точке экрана и получить код цвета. 

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

DataUrl — генерирует код из изображения. 

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

Pjax — плагин которой позволяет изменять содержимое страницы без ее перезагрузки. 

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

CopyPasteCharacter — большой набор специальных символов.

Например нужно вставить значек TM в тексте, или лого Apple, а на клавиатуре этого нет. Заходим на этот сайт, копируем символ и вставляем куда нужно.

Name Check — проверяет зарегистрировано ли введенное имя в многих интернет ресурсах.

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

Scrim — конвертирует емейл в ссылку.

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