Bootstrap

Carousels

Slide shows

Bootstrap calls them carousels. Here's one:

Jumbotron

Lesson contents

The jumbotron is one of the easiest BS components, so it's a good place to start.

What is a jumbotron?

It's for highlighting key messages, like this:

Hello, doggo fans!

DoggLand is the barkiest place in the world.

Accessibility

Lesson contents

What is accessibility?

Accessibility is about making websites that people with disabilities can use. For example, blind people use screen readers, software that reads out a webpage's contents. A webpage can help a screen reader do its work, or get in the way, depending on how the page is designed.

Being responsive

Realistic layout

We want a site with a header, a sidebar, a content area, and a footer. like this:

Doggo World

Here's the code for a non-responsive version.

Get Bootstrapy

Lesson contents

Making a Bootstrap page

Twitter made the Bootstrap framework. It's a bunch of templates, along with stylesheets, and other things. We can copy the templates, and change them as we want. Bootstrap has been around for a while. It's on version 4, and has gotten quite powerful.

It's free. Free is good.

Pancakes

Make a responsive page about pancakes.