|
 Концепция Material Design (Материальный дизайн) уже хорошо знакома пользователям мобильных устройств на операционной системе Android. А 6 июля 2015 года Google представил библиотеку Material Design Lite, которая поможет еще и разрабатывать сайты в аналогичном стиле.
Представленная библиотека является современной интерпретацией Polymer Paper Elements, однако же к фреймворку Polymer не привязана: проект автономен и совместим с большинством существующих фреймворков для работы над веб-приложениями и сайтами. Основана библиотека Material Design Lite на CSS, JavaScript и HTML.
В Material Design Lite (MDL) веб-разработчики могут найти готовые шаблоны для своих проектов, отдельные компоненты (меню, кнопки, слайдеры, карточки). Для начала работы с MDL достаточно подключить файлы CSS и JavaScript библиотеки к каждой странице разрабатываемого проекта. Сделать это можно разными способами, например, при помощи мета-тегов <link> и <script> в теге <head> страниц:
<link rel="stylesheet" href="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.indigo-pink.min.css">
<script src="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
Далее можно переходить непосредственно к использованию возможностей MDL на сайте или веб-приложении. К примеру, чтобы использовать один из компонентов библиотеки на HTML-странице, необходимо добавить в желаемом месте стандартный тег, соответствующий желаемому компоненту, скажем, <button>, <div> или <ul>. Далее остается указать в стиле выбранного компонента один из имеющихся в библиотеке CSS-классов.
В Google ожидают, что новая библиотека поможет специалистам правильно расставлять элементы на страницах, использовать нужные анимации и т. д. Material Design Lite работает практически в любом современном браузере, правда на сайте библиотеки (getmdl.io) отмечается, что официально не поддерживается браузер IE8.
Теги:
material design lite,
библиотека material design lite,
библиотека mdl,
material design lite от google |
новости web дизайна 
