Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

10 инструментов HTML-верстки

4,008 views

Published on

«Нетология» подобрала 10 полезных инструментов, которые пригодятся при верстке HTML: от текстовых редакторов до генераторов CSS.

Published in: Design

10 инструментов HTML-верстки

  1. 1. 10 инструментов HTML-верстки ПОДГОТОВЛЕНО:
  2. 2. «Нетология» подобрала 10 полезных инструментов, которые пригодятся при верстке HTML: от текстовых редакторов до генераторов CSS. ОТ СОСТАВИТЕЛЕЙ
  3. 3. 11 книг-бестселлеров по маркетингу и менеджеру в 2014 годуНетология NOTEPAD ++
  4. 4. Бесплатный текстовый редактор по лицензии GNU для Windows, который подсвечивает синтаксис множества языков программирования, а также HTML-разметки. Умеет сворачивать блоки кода, сравнивать файлы, выделять текст блоками. Работает с большим количество форматов файлов, поддерживает внешние плагины. NOTEPAD ++ notepad-plus-plus.org
  5. 5. SUBLIME TEXT
  6. 6. Кроссплатформенный редактор, схожий с Notepad++, но обладающий множеством дополнительных функций. Подсвечивает синтаксис, автоматически сохраняет изменения в файлах, поддерживает 27 языков программирования, плагины и макросы на Python. Программа умеет запускать код без переключения в командную строку. Приложение доступно в версиях для Windows, OS X и Linux, лицензия стоит 70 долларов. SUBLIME TEXT sublimetext.com
  7. 7. FIREBUG
  8. 8. Расширение для браузера Mozilla Firefox. Консоль и отладчик JavaScript, CSS и HTML, определяет часть кода, которая вызвала ошибку. Умеет редактировать код на стороне клиента в браузере. FIREBUG getfirebug.com
  9. 9. PERFECT PIXEL
  10. 10. Расширение для Google Chrome, которое накладывает на верстаемый сайт полупрозрачный макет. Оба изображения можно попиксельно сравнить и на ходу внести результат изменений кода. Поддерживает несколько слоев и их гибкую настройку, а также функцию блокировки, при которой все элементы на странице становятся кликабельными. PERFECTPIXEL chrome.google.com/webstore
  11. 11. WINMERGE
  12. 12. Удобный бесплатный инструмент под Windows для сравнения разных версий файлов, в том числе макетов верстки. Различия отображаются в визуальной текстовой форме, из которой видно, что изменилось в проекте в новой версии. WINMERGE winmerge.org
  13. 13. WINLESS
  14. 14. Бесплатная Windows-программа для работы с препроцессором LESS. Он представляет из себя надстройку над CSS с дополнительными динамическими свойствами. WinLess поможет конвертировать LESS в CSS. Программа автоматически сканирует выбранную папку и выбирает файлы, которые содержат нужный код. WINLESS winless.org
  15. 15. CSS3 GENERATOR
  16. 16. Минималистичный инструмент для генерации CSS- кода под множество предустановленных задач. CSS3 GENERATOR css3generator.com
  17. 17. ULTIMATE CSS
  18. 18. Сервис для генерации градиентов. Результат сразу отображается в боковой панели в виде кода. Ultimate CSS Gradient Generator colorzilla.com/gradient-editor
  19. 19. UI PARADE
  20. 20. Подборка из четырех бесплатных генераторов элементов для макета: кнопок, форм, иконок и ленточек. Результат можно выгрузить в виде кода HTML или CSS. Livetools Ui Parade livetools.uiparade.com
  21. 21. Виртуальная линейка. Подскажет размеры любого элемента на сайте. Page Ruler chrome.google.com
  22. 22. БОЛЬШЕ ЦЕННЫХ ПОДБОРОК В НАШЕМ БЛОГЕ 15 неочевидных инструментов для дизайнеров Фестиваль 404: лучшие лекции о маркетинге, менеджменте и дизайне 7 сервисов, расширяющих возможности Instagram
  23. 23. СПАСИБО ЗА ВНИМАНИЕ «Нетология» — маркетинг и менеджмент от практиков Рунета УЗНАТЬ БОЛЬШЕ
  24. 24. ПОНРАВИЛАСЬ ПРЕЗЕНТАЦИЯ? ПОДЕЛИТЕСЬ!

×