B.Y.O.L.: Using Less.js for More Manageable Style Sheets

Conference Archive

DevLearn 2014 Conference & Expo - October 31, 2014

Molly Burke

Director of Online Education
Arizona Center for Integrative Medicine, University of Arizona

Amy Som

Manager, Instructional and Front-End Design
University of Arizona Center for Integrative Medicine

Complex online learning platforms usually mean complex visual styles. Maybe your platform has different skins for different groups of learners. Or maybe the styles change depending on the learning context, e.g., in a practice exercise versus a learning evaluation. All that visual complexity transfers to complex, often messy, stylesheet code.

In this session you will explore Less.js, a CSS preprocessor, which extends the CSS language to allow for variables, functions, and reusable sets of style declarations called mixins. You will learn how these features can help you create stylesheets that are more themable, reusable, and better organized. You will gain an overview of the concepts and advantages of Less, and walk through the process of creating your own Less stylesheets.

In this session, you will learn:

  • What a CSS preprocessor is, and why you would use one
  • The features of Less.js that make it easier to manage and use stylesheets
  • How to write stylesheets in Less
  • How to compile Less for deployment

Intermediate and advanced designers, developers, and project managers with a good practical understanding of CSS and how it is used to style HTML pages.

Technology discussed in this session:
CSS, Less.js, HTML.

Participant technology requirements:
Participants will need to install Crunch (Less editor and compiler), available free from http://crunchapp.net/. Participants are invited to bring their own CSS stylesheet files to rework during the session and show as examples.


You do not have access to these files. Please log in or join with a free membership to download these files.


 Back to Library
Advertise Here
Advertise Here

Upcoming Events

Recent Job Postings