10 крутых инструментов для верстки

10 крутых инструментов для верстки

Автор: Сергей Усачев 18 Августа 2017 110

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

Notepad++

Notepad++

Основа основ и самого мироздания кодеров! Бесплатный вариант текстового редактора с различными встроенными функциями: подсветкой синтаксиса самых разных языков программирования и HTML-разметки, возможность сворачивания блоков кода, сравнения файлов, выделения текстов блоками и многое другое. Notepad++ поддерживает внешние плагины и множество форматов файлов.

Sublime Text

Sublime Text

Пару положительных словечек о данном редакторе мы уже сказали в прошлый раз, а сегодня добавим еще немного. Кроссплатформенная программа Sublime Text по функционалу схожа с Notepad++, но обладает огромным множеством дополнительных возможностей, среди которых:

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

Firebug

Firebug

Полезное расширение для Mozilla Firefox – отладчик JS, CSS и HTML, который определяет часть кода, вызвавшую ошибку. Также позволяет редактировать код на стороне клиента в браузере.

PerfectPixel

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

WinMerge

WinMerge

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

WinLess

WinLess

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

CSS3 Generator

CSS3 Generator

Программа для генерации CSS-кода с минималистичным дизайном и богатым набором предустановленных задач.

Ultimate CSS Gradient Generator

Ultimate CSS Gradient Generator

Сервис генерирует градиенты и отображает результат тут же в боковой панели в виде кода.

Livetools Ui Parade

Livetools Ui Parade

Содержит четыре бесплатных генератора элементов для макетов: кнопки, формы, иконки, ленточки. Полученный результат доступен для выгрузки в HTML или CSS-формате.

Page Ruler

Page Ruler

Удобная виртуальная рулетка, которая может определить размер любого элемента на странице.

Изображения взяты из блога Netology.ru

comments powered by HyperComments

Вернуться к списку