Introduction
Introduction to Google’s Material Design with Materialize CSS
Interested in applying Google’s Material Design to your next web project? This hands-on workshop offers an introduction to Materialize CSS, a modern responsive front-end framework based on Material Design. Learn to control layout using a responsive grid system, add components to display content and navigation, and incorporate select custom jQuery plugins.
Participants should come with a basic understanding of HTML/CSS, a laptop, and an opinion (or two).
Topics include comparing Materialize to other frameworks, downloading the framework and incorporating it into an HTML document, designing pages utilizing Material Design’s layout tools, adding basic page elements using CSS and customizing the CSS, creating navigational elements, and enhancing interaction through Javascript plugins.
Participants should come with a basic understanding of HTML/CSS, a laptop, and an opinion (or two).
Workshop Topics
- Downloading Materialize css and incorporating it into an HTML document
- Designing page layouts utilizing the Materialize responsive grid system
- Adding basic page elements using Materialize’s core CSS and customizing the CSS
- Creating navigational menus with Materialize (NavBar, Sidenav, card action links )
- Optional Topics (time permitting): web font icons, responsive multimedia elements, CSS customization, and CMS integration and more
Participants are expected to have:
- Basic HTML and CSS skills
- Laptop/notebook with a text editor