5

Сайт-
визитка:

Сайт-визитка – это небольшой по размеру сайт (объем до 10 страниц), на котором размещается информация например о вашей компании.

0

Корпоративный сайт:

Это, веб-интерфейс определенной компании, который создан для доступа сотрудника к корпоративным данным и приложениям.

8

Интернет-магазин:

сайт, позволяет пользователям онлайн, в своём браузере, сформировать заказ на покупку, выбрать способ оплаты и доставки заказа.

Изучаем LESS: введение

Сегодня мы начинаем серию статей, посвященных технологии LESS – динамическому языку, который использует CSS-код и, так сказать, накачивает его стероидами. LESS позволяет вам использовать переменные, mixin’ы, разветвленные правила и даже функции прямо внутри кода CSS. Это поможет вам в значительной степени ускорить процесс разработки и улучшить качество проектов. Конечно же, как и в любом деле, вам потребуются некоторые знания, но как только вы поймете суть данной технологии, вам вряд ли снова захочется использовать чистый код, без применения LESS.

Содержание нашего курса

* Введение
* Использование переменных
* Использование mixin’ов
* Использование разветвленных правил
* Использование функций
* Разделяй и властвуй!
* Применяем на практике

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

Что такое LESS и почему меня это должно волновать?

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

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

Из материалов Wikipedia, LESS – это:

Динамичный язык для разработки каскадных таблиц стилей, созданный Алексисом Селлиером. Он был создан под вдохновением от Sass, и повлиял на обновленный синтаксис Sass под названием «SCS», который перенял его форматирование синтаксиса на примере блоков в CSS.

LESS появился в 2009 году, и в последние месяцы стал стремительно набирать обороты, так как его все чаще и чаще применяют в проектах, как маленьких, так и гигантских, включая Bootstrap из Twitter’а – самый популярный проект на GitHub.

С ознакомлением с новыми сериями этого руководства, вы все ближе и ближе будете узнавать LESS, и как его использовать. Вкратце можно сказать, что он поможет вам создавать мощные библиотеки переменных, быстрые CSS3-эффекты и многое другое.

Какими ресурсами следует воспользоваться?

В интернете есть множество мест, где вы сможете прочитать о LESS, но для начала мы настоятельно рекомендуем вам сосредоточиться на less" type="text/css" href="type.less">
Как только вы загрузите все необходимые LESS-файлы, наступает время вызова файла LESS JS, который компилирует все ваши файлы LESS в одну каскадную таблицу стилей CSS.

<script src="less.js" type="text/javascript"></script>
Это то, что требуется для работы на стороне клиента. Удостоверьтесь в том, что вы вызываете файл less.js после того, как в документ включены каскадные таблицы стилей .less.

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

Использование LESS.app для Mac OS X

Один из самых мощных клиентов, которым мы пользовались при разработке кода в LESS – это LESS.app для Mac OS X (простите нас, пользователи Microsoft; хотя, вы все равно можете попробовать SimpLESS). LESS.app компилирует ваши LESS-файлы в CSS-файл в процессе разработки, и даже дает вам возможность минимизировать ваш CSS-файл. Это делает процесс разработки стилей очень удобным и мощным, так как вы можете использовать множество LESS-файлов, компилировать их в одну каскадную таблицу стилей, минимизировать и загружать на сервер.

Для того чтобы использовать LESS.app, просто перетащите вашу папку с разработкой в окно приложения и LESS.app автоматически обнаружит все ваши LESS-файлы. Затем вы можете указать, который из них должен быть конвертирован в CSS, где его следует сохранить (в вашей папке с разработкой) и нужно ли его минимизировать.

Отличный инструмент, не сомневайтесь!

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

В нашем следующем уроке мы будем изучать способы применения переменных в LESS. До встречи!

Comments are closed.