Инструменты и сервисы для верстальщика

1) Редактор иконок - IcoFX
2) Оптимизатор изображений в формате PNG - PNG optimizer

 

пользуюсь brackets + emmet очень нравится! И еще бутсрап, конечно!

 

Использую notepad ++, winscp и firebug как правило этого достаточно ну еще сервисы для генерации например скругленых углов или градиентов

 

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

 

а для swf что есть?

 

Massonian, Для разработчика swf есть редакторы например у Adobe очень хороший. Но этот формат уже уходит как сложный и громоздкий

 

Google Chrome + PerfectPixel для точечной проверки соответствия макета и верстки

 

есть такой язык sass, с ним удобнее писать темы,делать изменеия что связанно с css( переменные и так далее) с помошю его пишеш а, потом написанное конвертируется компилятором (пример sgout) в css. почитайте удобная вешь !

 

SublimeText + Dev Chrome + Colormeter.

 

Нотпад это конечно хорошо, не грузит систему и все такое, но редактор Брекетс круче

 

phpDesigner 8 пользуюсь, хорошая программка.

 

http://ami.responsivedesign.is/# быстренько глянуть как смотрится верстка на разных экранах
http://www.viewlike.us/ не быстренько глянуть как смотрится верстка на разных устройствах
http://csssprites.com/ спрайты
http://www.colorzilla.com/gradient-editor/ градиенты
http://habrahabr.ru/post/149863/ тут много генераторов
http://zashel.kz/description.php?iin=mySize линеечка, иногда очень кстати)
http://operafan.net/content/view/309/2/ эмулятор на самый привередливый браузер, есть и на другие, но например андроид - такая головная боль
http://htmlbook.ru/html/valid настольный сайт каждого верстальщика
https://validator.w3.org/nu/
http://jigsaw.w3.org/css-validator/ валидаторы
мне нравится юзать брекетс с эмметом, конечно. Но говорят, еще саблайм крут и чаще всего используется в компаниях, даже чаще шторма

 

adobe brackets
Ставьте плагины.
В первую очередь установите вот этот плагин.

extensions rating - рейтинг приложений
Позволяет видеть рейтинги приложений, тем самым вы увидите какие приложения в тренде.

Ну и моя подборка плагинов.
Tabs - Custom Working - добавляет вкладки файлов как у браузеров вкладки страниц в верхней части.


brackets icons - иконки к файлам
ColorHints - при выборе цвета выпадает меню, в котором предлагается используемые в css файле цвета.
Indent Guides - делает направляющие по отступам.
CodeFolding - сворачивание блоков кода
Minifier - сжатие css и js кода
JSBeautifier - наоборот, "распаковывает" код, делая его удобочитаемым.
Brackets Snippets - снипеты

Response for Brackets - адаптивный дизайн сайта.
Это особый плагин. Очень удобный для тех кто делает адаптивный дизайн собственными руками.

 

Юзаю Chrome, PHPStorm, Notepad.

 

Notepad наше всё!)

 

Notepad++
ColorZilla
PhpStorm

 

Notepad++
http://htmlbook.ru/ все в голове не удержишь, а справочник хорошо помогает
https://www.google.com/fonts шрифты
http://colorscheme.ru/ но это больше, чтоб убедиться, что время потрачено зря и ничего не подходит )
Chrome и его "просмотр кода" - как раз помогает лучше и цвет подобрать, и компоновку с прочим потестить, если что-то не нравится

 

Добавлю, что в Brackets есть плагин Extract - сильно упрощает верстку по готовому PSD. Автоматом подтягивает размеры, цвета, шрифты, тени, градиенты. Вытаскивает картинки из слоев.
Очень удобно, плюс есть Live view.

 

https://tinypng.com/ хороший оптимизатор png и jpg
https://web-font-generator.com/ генератор шрифтов