Themes control look-and-feel

Skilling is based on Drupal. Drupal separates the look-and-feel of a site from the data processing. A group of files that create the look-and-feel of a Drupal site is called a "theme."

Themes set fonts, text color, background color, margins, borders... much else. They also control how things like menus work.

Themes adapt to mobile devices

Skilling automatically adjusts to the small screens of mobile devices. If you're on a laptop or desktop, you can simulate a small screen by shrinking your browser window. See how, for example, the main menu changes, so it will fit on a small screen.

A warning, though. Good courses are active. For example, to encourage metacognition, give students two similar examples. Chunks of code, equations, whatever the course is about. Ask students to spot the differences and similarities between the two examples, and type their conclusions into the web page. Students will form an abstract schema, with "slots" for the differences in the examples.

(BTW, schema abstraction is a natural cognitive activity for humans. The Skilling lesson just prompts them to do it, and think it through by typing something in their own words.)

Students need a keyboard for this task. They can use a phone's virtual keyboard, but it's inconvenient, so they're less likely to do the task.

The base hardware students should use is a tablet, with a Bluetooth keyboard. You can get a good one on eBay (11" screen + keyboard) for about USD $70.

My dog Rosie uses an old Android tablet, with a Bluetooth keyboard. One of the keys is missing, but it works fine.

Rosie has an old tablet

A laptop is better. A recent survey of online students found that 99% had laptops; even if fewer of your students have them, it will still be a big percentage. Windows, Mac, Linux... doesn't matter.

Skilling has a custom theme

Skilling has a custom theme based on Bootstrap 4. It is responsive, that is, it adapts to mobile devices. It is specially designed for the task of learning skills.

Bootstrap is perhaps the most widely used front-end framework on the web. It was released in August, 2011, and has been under continuous development ever since.

Skilling comes with a custom theme based on Bootstrap 4. Although the theme could be used for any Drupal site, it is designed for students taking skills courses. For example, students doing tasks will want to split their screen space. One half will have a browser showing a Skilling course. The other half of the screen will have and a worksheet, code editor, or whatever students use.

Skilling's theme will help. It makes best use of available screen space. All pages stretch horizontally to use the entire browser window. Students can collapse sidebars at will. On a large monitor, Skilling will pretend it is on a mobile device, if students make its window small enough.

Here are screenshots of one lesson. (It's on a test site, so the content makes no sense.)

First, here's the lesson as it might be on a laptop, with a largish browser window.

Lesson on a big screen

The main menu is fully visible, and there are sidebars on the left and right.

Suppose a student wants more screen space to, say, run Excel, and still see the lesson. They hide the sidebar, and shrink the browser window by a third.

Lesson on a medium screen

The student decides Excel needs even more space. They shrink the browser window down to mobile-phone size.

Lesson on a small screen

The bottom line: Skilling helps students make the best use of whatever screens they have available.

Highlights

Accessibility
Highlights
Open source